在本地环境中vue history模式刷新之后出现404解决方法

最新推荐文章于 2024-08-20 15:43:02 发布
最新推荐文章于 2024-08-20 15:43:02 发布
阅读量456 收藏
点赞数
CC 4.0 BY-SA版权
文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/minionsH/article/details/127607992
博客介绍了在Vue中解决路由问题的简单方法。只需在vue.config.js里的devServer添加historyApiFallback配置，设置index为'/index.html'，与output的publicPath对应即可。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

超级简单

在vue.config.js里面devServer添加

 historyApiFallback: {

                index: '/index.html' //与output的publicPath

            }

即可

minionsH
关注
vue路由history模式刷新404问题解决方案
caihuawei123的博客
08-19 459
1.使用nginx的方法 server { listen 8168; server_name localhost; location / { root /opt/apache-tomcat-8.5.8/XXX/webapps/ROOT; index index.html; try_files $uri $uri/ @router; index
vue history模式刷新页面进入404解决方案
郝峰vip的博客
12-02 9788
vue 路由模式 history模式 刷新页面进入404解决方案
vue下history模式刷新后404错误解决方法
01-19
本文介绍了vue下history模式刷新后404错误解决方法，分享给大家，具体如下： 官方说明文档： https://router.vuejs.org/zh/guide/essentials/history-mode.html 一、 实测 Linux 系统 Apache 配置： 更改站点配置文件即可，我这里在 Directory 标签后面添加了官方给的五行配置 <VirtualHost> #Created by linvic on 2018-05-24 Serveradmin 674206994@qq.com ServerName blog.xxx.com Doc
解决vue中history导致的刷新404问题
brillianceGlory的博客
03-09 446
解决vue中history导致的刷新404问题
vue 路由history模式刷新页面404问题
lucky_zouzou的博客
10-09 4874
vue项目中路由hash模式改为了history模式,由于hash模式时url带的#号后面是哈希值不会作为url的一部分发送给服务器，而history模式下浏览器会直接去服务器找这些地址，导致服务器没有对应的页面地址而报404。增加location配置，与项目中配置的名称一致，try_files 后面的文件名也要与名称一致。前端项目中修改项目的base路径,这里我设置为main。第二步，修改nginx配置。
Vue项目History模式404问题解决方法
12-01
- **其他服务器环境**：虽然本示例是针对Nginx，但类似的问题也可能出现在其他服务器环境中，如Apache等，解决方案也会类似，即配置服务器将所有未知路由转发给SPA的入口文件。 综上所述，解决Vue项目History模式...
Vue下路由History模式打包后页面空白的解决方法
12-09
在 Vue 项目中切换到 History 模式时，首先需要在 Vue Router 配置中明确指定 `mode`： ```javascript const router = new VueRouter({ base: '/history', mode: 'history', routes: [...] }); ``` 这里的 `base`...
在nginx上部署vue项目(history模式)的方法
11-30
在Vue.js应用中，`vue-router` 是一个常用的路由管理库，它提供了两种导航解析模式：`hash` 和 `history`。默认情况下，Vue应用使用`hash`模式，URL会显示为`http://localhost:8080/bank/page/count/#/`的形式，其中...
解决vue router使用 history 模式刷新后404问题
12-09
因为我们的应用是单页客户端应用，当使用 history 模式时，URL 就像正常的 url，可以直接访问http://www.xxx.com/user/id，但是因为vue-router设置的路径不是真实存在的路径，所以刷新就会返回404错误。 想要history模式正常访问，还需要后台配置支持。要在服务端增加一个覆盖所有情况的候选资源：如果 URL 匹配不到任何静态资源，则应该返回同一个 index.html 页面，这个页面就是你 app 依赖的页面。 也就是在服务端修改404错误页面的配置路径，让其指向到index.html。 警告： 因为这么做以后，你的服务器就不再返回 404 错误页面
vue路由用history刷新会404
sinye的博客
06-20 515
vue项目的路由使用history模式，然后刷新页面，居然报404。然而百度都是说改成hash，然而又不想路由出现“#”。有的说修改nginx，好家伙，我本地起的vue项目，哪来的nginx。
Vue 设置history模式下强制刷新页面报错404的问题
weixin_57095786的博客
04-23 3069
Vue 设置history模式下强制刷新页面报错404的问题
vue的history模式返回404
爱coding的大尾巴的专栏
05-14 574
让找不到路径的url重定向到单页应用index.html中。这样也可以解决在支付宝内置浏览器直接拦截404的问题。
06. vue history模式刷新后页面白屏、401、404的问题
qq_29517595的博客
06-21 7152
vue项目history模式刷新后页面空白的问题
前后端分离，Vue-Router使用history路由模式，页面刷新报401错误
qq_45754184的博客
08-20 702
页面，故返回401错误，所以将页面的路由地址/ops/logManage改成/manageOps/logManage或其他不会被代理配置匹配重写的路径就好了(或者去修改接口请求url地址和代理配置)。路由跳转和请求响应都正常，但是一刷新页面，就出现该401错误，查看vue前端项目，路由使用的是history模式。可看出对于^/ops'开头的请求路径会被重写，所以刷新页面后浏览器向服务器发送的请求。路径被重写后的URL匹配不到。
vue history模式
Shuanger112的博客
12-14 974
HTML5 History 模式 言简意赅的来说，History模式就是去除掉浏览器地址栏的#号 vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL，于是当 URL 改变时，页面不会重新加载。 如果不想要很丑的 hash，我们可以用路由的 history 模式，这种模式充分利用 history.pushState API 来完成 URL 跳转...
vue本地history 刷新后页面空白问题
wzwzwz555的博客
03-27 647
项目是调了不同得服务器 所以 做了代理。修改hash为history。
开发过程中，本地环境下Vue-router在history模式下二级页面刷新404问题
最新发布
12-14
在Vue.js开发过程中，使用Vue-router的history模式时，二级页面刷新后出现404错误是一个常见的问题。这个问题的根本原因在于服务器的配置。 在history模式下，Vue-router会使用HTML5的history.pushState API来管理...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值