【Nginx】 nginx 项目上线后刷新页面丢失 404

简介: 【Nginx】 nginx 项目上线后刷新页面丢失 404

nginx vue2项目上线后刷新页面丢失

history 模式下,会出现一个致命的BUG,在服务器上面上线之后,点击页面跳转没有问题,但是一旦点击刷新页面会出现404错误,原因是history模式下刷新界面,就等同于向服务器直接请求

解决:

在ngnix中的server总加入一句话

location / {
    try_files $uri $uri/ /index.html;
}
server
{
    listen 端口号;
    server_name IP地址;
    index index.html;
    root路径;
    #服务器代理
    # location /api/ {
    #     proxy_pass 代理地址;
    # }
    location / {
        try_files $uri $uri/ /index.html;
    }
}

下班~

目录
相关文章
|
5天前
|
监控 物联网 应用服务中间件
流媒体方案之Nginx——实现物联网视频监控项目
流媒体方案之Nginx——实现物联网视频监控项目
流媒体方案之Nginx——实现物联网视频监控项目
|
5天前
|
应用服务中间件 nginx
nginx配置项目的几种方法
nginx配置项目的几种方法
19 0
|
5天前
|
存储 应用服务中间件 数据库
C++文件服务器项目—Nginx+FastDFS插件—5
C++文件服务器项目—Nginx+FastDFS插件—5
45 0
|
5天前
|
前端开发 应用服务中间件 nginx
Nginx配置详解Docker部署Nginx使用Nginx部署vue前端项目
Nginx配置详解Docker部署Nginx使用Nginx部署vue前端项目
170 0
|
5天前
|
JavaScript 应用服务中间件 nginx
【报错】nginx部署项目后Echarts折线图无法展示
在Vue3+TS+Arco项目中,打包后使用Nginx部署的Echarts折线图显示异常,报`Cannot read properties of undefined(reading 'setOption')`错误。问题源于在定义div时使用了Vue2的`$refs`语法,导致DOM元素无法正确初始化Echarts。解决方法有两种:1) 不推荐使用`document.getElementById`获取DOM并初始化Echarts;2) 推荐在Vue3中通过`ref`获取DOM,在`onMounted`中使用`echarts.init`并借助`nextTick`异步绘制数据。
|
5天前
|
前端开发 应用服务中间件 nginx
nginx中配置不输入端口(指定地址)访问项目的方法
nginx中配置不输入端口(指定地址)访问项目的方法
72 0
|
5天前
|
JavaScript 前端开发 应用服务中间件
vue项目加载慢,Nginx页面优化
vue项目加载慢,Nginx页面优化
72 0
|
5天前
|
负载均衡 网络协议 应用服务中间件
C++文件服务器项目—Nginx—3(三)
C++文件服务器项目—Nginx—3(三)
73 0
|
5天前
|
JavaScript jenkins 应用服务中间件
Jenkins + Github + Nginx 自动化部署 Vue 项目
Jenkins + Github + Nginx 自动化部署 Vue 项目
191 0
|
应用服务中间件 Linux PHP
nginx怎么部署php项目,如何php项目部署到nginx
php项目部署到nginx的方法:首先安装“Nginx”和“php-fpm”;然后将项目复制到“nginx/html”文件下;接着修改配置文件;最后重新载入Nginx并启动“php-fpm”即可。