vue应用刷新404问题

页面刷新报404错误,查阅资料后发现这就是web单页面开发模式造成的。现在主流的前端框架基本都是单页面的。如:react、vue等。
单页面简单来说就是访问所有资源路径、其实页面内容只有一个。这个页面中引入的js框架会根据当前访问的url去路由到相应的子页面组件进行逻辑处理和页面渲染。对于nginx服务器来说正在访问的页面并不存在,所以刷新会报错,你要在nginx配置文件中加入以下片段

location / {

  try_files $uri $uri/ /index.html;

}

然后重启nginx服务器就行了

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
当你在使用 Vue Router 时,如果刷新页面出现404错误,可能是因为你的服务器配置不正确。Vue Router 是基于前端路由的,它使用了 HTML5 History 模式,这种模式需要服务器端正确的配置以确保在刷新页面时能正确地返回你的应用。 要解决这个问题,你需要在服务器上进行一些配置。具体的配置取决于你使用的服务器。以下是一些常见服务器的配置示例: 1. Apache 服务器: 在 Apache 服务器上,你需要启用 mod_rewrite 模块,并将所有的请求重定向到你的 index.html 文件。你可以在项目根目录下创建一个名为 `.htaccess` 的文件,并添加以下规则: ``` <IfModule mod_rewrite.c> RewriteEngine On RewriteBase / RewriteRule ^index\.html$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.html [L] </IfModule> ``` 2. Nginx 服务器: 在 Nginx 服务器上,你可以在配置文件中添加一个 location 规则,将所有的请求都重定向到 index.html 文件。例如: ``` location / { try_files $uri $uri/ /index.html; } ``` 3. 其他服务器: 如果你使用的是其他类型的服务器,可以根据类似的思路进行配置。关键是确保所有的请求都被重定向到你的 index.html 文件。 无论你使用哪种服务器,一旦配置完成,刷新页面时就不会再出现404错误了。服务器会将所有的请求都指向 index.html,然后 Vue Router 就能够正确地处理这些请求并展示正确的页面。 希望这能帮助到你!如果还有其他问题,请随时提问。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值