Vue 发布服务器(Nginx)后访问路由报错 404

简介: Vue 发布服务器(Nginx)后访问路由报错 404
server {
    # 监听端口
    listen 8089;
    # 主机名称
    server_name www.dzm.com;
    # 根目录
    root /usr/local/var/dzm;
    # 匹配协议
    # location / {
    #     index index.html;
    # }
    # 上面 / 的匹配协议换成这个
    location / {
        try_files $uri $uri/ /index.html;
    }
    location /api/ {
        proxy_pass http://api-test/;
    }
}
// 将这个匹配换成下面的
location / {
    index index.html;
}
// 将上面的匹配换成这个
location / {
    try_files $uri $uri/ /index.html;
}
  • nginxtry_files 的的作用一般用户 url 的美化,或者是伪静态功能:
  • 当用户请求 http://localhost/example 时,这里的 $uri 就是 /example
  • try_files 会到硬盘里尝试找这个文件。如果存在名为 /root/example(其中 root 是项目代码安装目录)的文件,就直接把这个文件的内容发送给用户。
  • 显然,目录中没有叫 example 的文件。然后就看 uri/,增加了一个 /,也就是看有没有名为 /root/example/ 的目录。
  • 又找不到,就会 fall backtry_files 的最后一个选项 /index.html,发起一个内部 “子请求”,也就是相当于 nginx 发起一个 HTTP 请求到 http://localhost/index.html
相关文章
|
1天前
|
应用服务中间件 Linux 网络安全
nginx安装部署ssl证书,同时支持http与https方式访问
为了使HTTP服务支持HTTPS访问,需生成并安装SSL证书,并确保Nginx支持SSL模块。首先,在`/usr/local/nginx`目录下生成RSA密钥、证书申请文件及自签名证书。接着,确认Nginx已安装SSL模块,若未安装则重新编译Nginx加入该模块。最后,编辑`nginx.conf`配置文件,启用并配置HTTPS服务器部分,指定证书路径和监听端口(如20000),保存后重启Nginx完成部署。
75 6
|
24天前
|
监控 应用服务中间件 定位技术
要统计Nginx的客户端IP,可以通过分析Nginx的访问日志文件来实现
要统计Nginx的客户端IP,可以通过分析Nginx的访问日志文件来实现
|
25天前
|
存储 编解码 应用服务中间件
使用Nginx搭建流媒体服务器
本文介绍了流媒体服务器的特性及各种流媒体传输协议的适用场景,并详细阐述了使用 nginx-http-flv-module 扩展Nginx作为流媒体服务器的详细步骤,并提供了在VLC,flv.js,hls.js下的流媒体拉流播放示例。
119 1
|
1月前
|
负载均衡 监控 应用服务中间件
配置Nginx反向代理时如何指定后端服务器的权重?
配置Nginx反向代理时如何指定后端服务器的权重?
63 4
|
1月前
|
安全 应用服务中间件 网络安全
如何测试Nginx反向代理实现SSL加密访问的配置是否正确?
如何测试Nginx反向代理实现SSL加密访问的配置是否正确?
61 3
|
1月前
|
安全 应用服务中间件 网络安全
配置Nginx反向代理实现SSL加密访问的步骤是什么?
我们可以成功地配置 Nginx 反向代理实现 SSL 加密访问,为用户提供更安全、可靠的网络服务。同时,在实际应用中,还需要根据具体情况进行进一步的优化和调整,以满足不同的需求。SSL 加密是网络安全的重要保障,合理配置和维护是确保系统安全稳定运行的关键。
120 3
|
1月前
|
Web App开发 算法 应用服务中间件
nginx开启局域网https访问
【10月更文挑战第22天】为了调试WebRTC功能,需要在局域网内搭建HTTPS协议。具体步骤包括:在已部署Nginx和安装OpenSSL的环境中生成私钥、证书签名请求和自签名证书;将生成的文件放置到Nginx的证书目录并修改Nginx配置文件,最后重启Nginx服务。注意,自签名证书不受第三方机构认可,如需正式使用,需向CA申请签名。
|
2月前
|
前端开发 JavaScript Java
第6章:Vue中的ajax(包含:回顾发送ajax请求方式、vue-cli脚手架配置代理服务器)
第6章:Vue中的ajax(包含:回顾发送ajax请求方式、vue-cli脚手架配置代理服务器)
94 4
|
2月前
|
JavaScript 前端开发 应用服务中间件
vue前端开发中,通过vue.config.js配置和nginx配置,实现多个入口文件的实现方法
vue前端开发中,通过vue.config.js配置和nginx配置,实现多个入口文件的实现方法
201 0
|
应用服务中间件 nginx
Nginx服务器的反向代理proxy_pass配置方法讲解
 Nginx服务器的反向代理proxy_pass配置方法讲解 这篇文章主要介绍了Nginx服务器的反向代理proxy_pass配置方法讲解,包括经常被提到的url的/问题的相关说明,需要的朋友可以参考下 就普...
5135 0