解决方案: 对于VUE的router[mode: history]模式在开发的时候,一般都不出问题。是因为开发时用的服务器为node,dev环境中自然已配置好了。 但对于放到nginx下运行的时候,自然还会有其他注意的地方。总结如下: 在nginx里配置了以下配置后, 可能首页没有问题,但链接其他会出现(404) 代码语言:javascript 代码运行
如果路由配置错误,Nginx可能无法正确地路由到请求的页面,导致404错误。需要检查Vue Router的配置文件(通常是router/index.js)是否正确定义了路由路径和对应的组件。 Nginx配置错误:Nginx的配置文件(通常是nginx.conf)可能存在问题,导致无法正确处理Vue.js的路由请求。需要确保Nginx的配置文件中正确地配置了代理或重定向规则...
2.1 重写api 2.2 vue-router跳转index页面避免出现404等界面 2.3 添加头部信息 2.4 还有人说是前端打包时baseURL的问题 3.我的解决方案: 3.1在前端config.js将这个localhost改为自己服务器端的地址,端口则是自己后端的端口 3.2 在Nginx.conf添加拦截路径和代理地址,ip和端口和上一步一致 *注意: 1.先看问题情况 ...
在Vue项目中,如果你使用了history模式来配置路由,并且在Nginx中刷新页面时出现404错误,这通常是因为Nginx没有正确配置以支持Vue的history模式路由。下面是一些步骤和建议来解决这个问题: 1. 确认Vue项目的路由模式 首先,确保你的Vue项目是使用history模式来配置路由的。你可以在vue-router的配置文件中找到这个设置。例如:...
刷新页面时访问的资源在服务端找不到,因为vue-router设置的路径不是真实存在的路径。 如上的404现象,是因为在nginx配置的根目录/html/dist下面压根没有/home/application/list这个真实资源存在,这些访问资源都是在js里渲染的。 在这里因为我使用的是vue-router的history模式 ...
关键在这里,当我们在 website.com/login 页执行刷新操作,nginx location 是没有相关配置的,所以就会出现 404 的情况 为什么hash模式下没有问题 router hash 模式我们都知道是用符号#表示的,如 website.com/#/login, hash 的值为 #/login 它的特点在于:hash 虽然出现在 URL 中,但不会被包括在 HTTP 请求中,...
vue项目history模式部署到服务器后 ,根路径访问没有问题,但是进入其他功能再刷新页面就会出现404,因为你没在nginx或者apache配置上面加上重定向跳转。 解决办法,只需要加上这段配置: nginx配置内容: location /{ try_files $uri $uri/@router; index index.html; ...
文章涉及到VUE路由模块化,懒加载,nginx安装,打包配置板块。 项目复杂,路由变多,代码维护性降低,从路由模块化开始一步步优化,解决各种BUG。参考了很多方法,会在文章中引用出来。 第一步、路由按模块配置和懒加载配置 1.1 普通路由配置 文件路径: src > router > index.js ...
生成dist文件夹,把该文件夹下的文件直接复制到nginx服务器目录下, 就可打开项目,但是只有首页是可以看到的,再刷新一下就404了, 原因是vue的项目为单页应用,路由找不到所致。 所以要在nginx服务器配置对所有的路径或者文件夹进行跳转。重定向到首页index下,这样就都能找到路由了。 location / { try_files $uri ...
vue 存在路由重定向nginx 发布后程序跳转到内置404页面 一、vuex的简介 # vue的插件,增强了vue的功能, 在Vue中实现集中式状态(数据)管理的一个Vue插件,对vue应用中多个组件的共享状态进行集中式的管理(读/写),也是一种组件间通信的方式,且适用于任意组件间通信...