当前位置:朝夕网 » 数码科技 » VUE项目打包发到Docker二次刷新页面报404错误问题解决

VUE项目打包发到Docker二次刷新页面报404错误问题解决

将VUE项目打包后发布到Docker的Nginx服务器后,基本使用正常,发现前端有一个404错误,但页面显示正常,在退出登录后,跳转到404页面,便这个404页面是nginx缺省的,并不是自己vue项

将VUE项目打包后发布到Docker的Nginx服务器后,基本使用正常,发现前端有一个404错误,但页面显示正常,在退出登录后,跳转到404页面,便这个404页面是nginx缺省的,并不是自己vue项目的,参考网上资料后搞定了此问题,特此记录:

一、原因 刷新页面时访问的资源在服务端找不到,因为vue-router设置的路径不是真实存在的路径。如上的404现象,是因为在nginx配置的根目录/Data/app/xqsj_wx/dist下面压根没有loading这个真实资源存在,这些访问资源都是在js里渲染的。二、Dockerfile文件

注意打包文件拷贝的目标路径,后面的default.conf要一致,否则会有问题

FROM urbgn6za.mirror.aliyuncs.com/library/nginxMAINTAINER Wu Jize <wujize188@163.com>RUN rm /etc/nginx/conf.d/default.confADD default.conf /etc/nginx/conf.d/

server { listen 8090; server_name 192.168.195.17; index index.html; #charset koi8-r; # cross # location /prod-api/ { proxy_pass http://192.168.195.17:8088/; } # 解决出现404问题 location / { try_files $uri $uri/ @router; index index.html index.htm; } location @router { rewrite ^.*$ /index.html break; } # redirect server error pages to the static page /50x.html # error_page 500 502 503 504 /50x.html; location = /50x.html { root html; }}

以上就是朝夕生活(www.30zx.com)关于“VUE项目打包发到Docker二次刷新页面报404错误问题解决”的详细内容,希望对大家有所帮助!

免责声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如有侵权行为,请第一时间联系我们修改或删除,多谢。朝夕网 » VUE项目打包发到Docker二次刷新页面报404错误问题解决