nginx配置之部署后刷新产生404错误的解决
作者：monimonicaca
文章总结：在前端部署过程中遇到浏览器刷新出现nginx_error的问题,通过配置nginx.conf文件中的try_files指令来解决,针对单页面应用的逻辑问题,确保登录页面的逻辑正确处理会话存储中的token,以避免页面刷新后回到登录页面的情况
在这里记录一下前端部署过程中，遇到的浏览器刷新出现的nginx_error问题。
将前端部署到服务器上之后，页面之间可以相互跳转，但是只要一点击浏览器刷新页面之后就会出现红红的大大的nginx_error。
一、配置nginx
在网上查找资料之后在nginx.conf上配置了try_files $uri $uri/ /index.html；这样配置之后浏览器刷新之后如果没找到目标页面就会重新定位到index.html页面。
二、注意页面之间的逻辑
虽然这样配置了之后不会出现nginx_error，但是每次刷新都会回到登录页面。
原因是vite创造的vue项目默认是单页面的，同时我对于路径IP：/重定位到了登录页面，所以每次都会重新回到登陆页面。
如果想要去到其他页面则需调整项目结构，而且可能需要引入插件，调整完之后还要配置nginx。
如果想在不改变页面结构的情况下，实现浏览器刷新不出错，就需要写好不同页面之间的逻辑。
我对项目比较简单，所以只用注意登陆页面的逻辑，如果会话存储中token存在则直接定位到首页，这样就不会出现一刷新就回到登录页面的情况啦。
但是这里需要提醒一下：
不要用pinia来存储token，可能是需要配置，欢迎大佬指导。
要用sessionStorage.setItem来存储token，不然读取不到token，导致一刷新就回到登录页面。
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。