1.在vue项目中，浏览器中看到的路线都标有#。如果要移除#，可以使用路由的历史模式，充分利用history.pushState API完成URL跳转，无需重新加载页面。只需在路由表中添加一行代码：使用属性mode :“history”，并在路由代码中添加模式：“history”

2.在构建被部署到服务器之后，将会有刷新页面报告404错误。查了一些资料和官方vue历史模式的配置方法，觉得这样配置就可以了。结果呢.

我的网站是阿里巴巴云虚拟机nginx tomcat搭建的。在nginx的配置文件中，删除#后初始配置如下(网站运行正常):

初始配置1

在这种情况下，我将vue的路由更改为历史模式，并删除了地址中的#号。但是如上所述，页面刷新时出现404错误，前端路由交给后端处理，导致映射不匹配。

官方nginx解决方案

以上是nginx的官方解决方案，所以我修改了nginx的域名配置文件，修改结果如下：

更新配置文件1

重新启动nignx服务后，测试结果显示主页可以访问，但是当我禁止从缓存中获取它时，所有静态资源都无法访问

静态资源不可访问

try_files属性按顺序检查文件的存在，并返回找到的第一个文件。结尾的斜线表示为folder -$uri/。如果没有找到所有文件，将对最后一个参数进行内部重定向。

Index.html应该找到了，但是为什么静态文件找不到？后来我更改了配置，把静态文件和index.html地址配置到了域名的根目录下(这种情况和地址跳转8082的配置有什么区别？请大神解惑)

更改配置，删除8082的proxy_pass，并添加根和索引属性，如下图所示：

更新配置文件2

因此，头版不能被问到

403禁止进入

一般来说，nginx的403禁止错误表示你在请求资源文件，但是nginx不允许你查看。

403禁只是一个HTTP状态码，和404，200一样，不是技术错误。

哪些场景需要返回403状态码？

1.网站禁止某些用户访问所有内容，例如，网站阻止某些ip访问。

2.访问禁止浏览的目录，例如，在关闭自动索引后访问目录。

3.用户访问只能由内部网访问的文件。

以上常见场景需要回到403禁。

我由此推断，不允许访问配置中的目录。更新nginx.conf会启动用户替换root重新启动nginx，并且主页和静态资源都被成功访问(这种配置是否存在安全风险？然而，后端api access报告了一个404的错误，所以我意识到我在错误的道路上越走越远。我的域名指向前端主页，但我的域名需要我指向后端服务。但是，在我使用代理将域名指向后端服务后，我之前的所有尝试都将不起作用。

如果我使用nginx代理，我不应该在nginx配置它。我需要在tomcat或nginx后面的应用程序上修改它。(可能我项目的设计很精彩，vue打包目录和后台springboot后台打包目录放在一起，前后页都是一样的html)

1.鉴于我项目的特殊性，在不改变项目结构的情况下，我在申请中进行了404状态转发。

具体代码如下：

索引主页转发

经测试，刷新时访问的页面虽然仍报为404，但可以重新加载“页面”，从而实现“刷新页面”。

页面加载成功，网络报告404

2.本着求知的精神，我把项目的前后分开重新部署，并尝试用try_files属性进行验证

结果和1一样。前景现象，除了网络状态变为304

页面加载成功，网络显示304

禁用缓存后的结果如下：

禁用缓存后，状态代码200

至此，我的问题已经完美解决了！

本来这是个小坑，因为自己的原因变成了大坑。虽然解决问题的过程看起来有点傻，但我终于想通了自己的问题：前端和后端合并和分离的区别，不要混淆

分离VUE的前端和后端，整合后在线部署，是不是很奇妙？如果我不应该改变项目结构，会有完美的解决方案吗？请留言解惑，非常感谢.

以上就是本文的全部内容。希望对大家的学习有帮助，支持我们。