VUE工程打包后,history模式在IIS服务器上,非初始路由下,刷新报404错误解决方案(亲测有效)

问题描述:

vue默认模式是hash模式,URL地址会带有“#”。

例如:http://www.xxx.com/#/index 

为了去掉这个#,需要在vue-router中,设置model为history,开发模式下木有问题,打包后,问题来了,

原始路径下,http://www.xxx.com/index刷新时候页面正常显示,如果路由跳转了,http://www.xxx.com/index/id,再刷新的时候就会报404错误  

问题原因:

服务端的URL匹配不到相应的路由资源

解决方案:

1、更新IIS版本,最好的6以上的IIS,否则可能装不上。

2、下载web程序安装平台

地址:https://www.iis.net/downloads/microsoft/url-rewrite

3、安装完成后,打开IIS,在主页上,可以看到安装的web程序安装平台

4、找到你配置的网站,双击打开web程序安装平台,并在他产品选项下的服务器中找到URL重写工具,进行安装

5、安装完成后,你的网站主界面上,会多出一个URL重写选项

6、打开这个工具,添加规则——空白规则—

7、随便给规则定个名字,在设置匹配URL时候,将“使用”选项改为“通配符”,将模式中写上“*”

8、设置条件选项,点击添加,在选择输入字符串是否时:选择不是文件,然后确定

9、接着就是设置操作中的操作属性,在里面写你打包后的index.html路径,因为你放入的是dist文件夹所以我们要在inde.html 前加上 

10、保存,重启IIS。完美解决。

11、设置好以后,在你的文件路径下,会都出一个web.config文件。其内容如下,如果安装不成功的,可以将这个文件内容直接写好放到目录下,也是可以的。

 

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值