vue router下的html5 history在iis服务器上的设置方法


Posted in Javascript onOctober 18, 2017

首先先照搬下官网的介绍

当你使用 history 模式时,URL 就像正常的 url,例如 http://yoursite.com/user/id,也好看!

不过这种模式要玩好,还需要后台配置支持。因为我们的应用是个单页客户端应用,如果后台没有正确的配置,当用户在浏览器直接访问 http://oursite.com/user/id 就会返回 404,这就不好看了。

所以呢,你要在服务端增加一个覆盖所有情况的候选资源:如果 URL 匹配不到任何静态资源,则应该返回同一个index.html 页面,这个页面就是你 app 依赖的页面。

但是官网上仅给了Apache服务器和Nginx服务器的配置,so。。。。。

那么下面我们开始介绍如何配置iis服务器。(我的iis为iis7.5)

1.安装url重写模块,找到管理下的web平台安装程序,搜索url,选择url重写工具2.0,选择安装。

vue router下的html5 history在iis服务器上的设置方法

vue router下的html5 history在iis服务器上的设置方法

2.添加规则。点击url重写,选择添加规则,空白规则,输入名称,按照下图进行配置。

vue router下的html5 history在iis服务器上的设置方法

vue router下的html5 history在iis服务器上的设置方法

vue router下的html5 history在iis服务器上的设置方法

3.vue程序中添加两条路由。

vue router下的html5 history在iis服务器上的设置方法

下面总结下:

url重写设置中,将配置url选择为与模式匹配,模式中填入*,使用选项选择通配符;即表示所有的网站都通过此模式进行检查匹配。匹配的条件是下面的条件选项,我们选择的是不是文件,逻辑分组为全部匹配。

操作为重写到我们的index.html(根据情况,设置为自己的单页面应用首页)。以上操作是设置我们的页面请求为先检查有没有此文件,没有此文件全部重写到我们的首页中,从而能够是的我们的自定义路由起作用。

然后我们在vue程序中设置/index.html路径为我们的起始页面,并且定义404页面。至此完成设置。

参考阅读:

总结

以上所述是小编给大家介绍的vue router下的html5 history在iis服务器上的设置方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript 写类方式之六
Jul 05 Javascript
Jquery getJSON方法详细分析
Dec 26 Javascript
jQuery中on()方法用法实例
Jan 19 Javascript
jQuery菜单插件superfish使用指南
Apr 21 Javascript
微信小程序 前端源码逻辑和工作流详解
Oct 08 Javascript
jQuery插件FusionCharts实现的3D柱状图效果实例【附demo源码下载】
Mar 03 Javascript
jquery实现用户登陆界面(示例讲解)
Sep 06 jQuery
基于vue 实现token验证的实例代码
Dec 14 Javascript
jQuery插件实现弹性运动完整示例
Jul 07 jQuery
如何为你的JS项目添加智能提示与类型检查详解
Mar 12 Javascript
基于JS实现计算24点算法代码实例解析
Jul 23 Javascript
JavaScript 如何在浏览器中使用摄像头
Dec 02 Javascript
ui-router中使用ocLazyLoad和resolve的具体方法
Oct 18 #Javascript
VUE长按事件需求详解
Oct 18 #Javascript
vue router仿天猫底部导航栏功能
Oct 18 #Javascript
Node做中转服务器转发接口
Oct 18 #Javascript
Vue组件之Tooltip的示例代码
Oct 18 #Javascript
JS正则表达式完美实现身份证校验功能
Oct 18 #Javascript
详解vue项目首页加载速度优化
Oct 18 #Javascript
You might like
一些常用的php函数
2006/12/06 PHP
非常实用的PHP常用函数汇总
2014/12/17 PHP
Laravel构建即时应用的一种实现方法详解
2017/08/31 PHP
PHP实现的折半查询算法示例
2017/10/09 PHP
关于javascript中的parseInt使用技巧
2009/09/03 Javascript
document.documentElement和document.body区别介绍
2013/09/16 Javascript
Javascript函数的参数
2015/07/16 Javascript
基于JS实现简单的样式切换效果代码
2015/09/04 Javascript
JavaScript省市区三级联动菜单效果
2016/09/21 Javascript
快速处理vue渲染前的显示问题
2018/03/05 Javascript
JS引用传递与值传递的区别与用法分析
2018/06/01 Javascript
vue项目中,main.js,App.vue,index.html的调用方法
2018/09/20 Javascript
js实现详情页放大镜效果
2020/10/28 Javascript
[04:32]DOTA2著名解说配音敌法师 现场专访海涛怒切假腿
2013/12/20 DOTA
对pandas中iloc,loc取数据差别及按条件取值的方法详解
2018/11/06 Python
python 含子图的gif生成时内存溢出的方法
2019/07/07 Python
python实现日志按天分割
2019/07/22 Python
Pytorch修改ResNet模型全连接层进行直接训练实例
2019/09/10 Python
使用Python打造一款间谍程序的流程分析
2020/02/21 Python
浅谈在django中使用filter()(即对QuerySet操作)时踩的坑
2020/03/31 Python
一篇文章带你搞定Ubuntu中打开Pycharm总是卡顿崩溃
2020/11/02 Python
Python爬虫Scrapy框架CrawlSpider原理及使用案例
2020/11/20 Python
Bose法国官网:购买耳机、扬声器、家庭影院、专业音响
2017/12/21 全球购物
MYSQL相比于其他数据库有哪些特点
2013/07/19 面试题
医大实习自我鉴定
2013/12/07 职场文书
教育专业自荐书范文
2013/12/17 职场文书
四年大学生活的自我评价范文
2014/02/07 职场文书
《鱼游到了纸上》教学反思
2014/02/20 职场文书
优秀少先队辅导员先进事迹材料
2014/05/18 职场文书
网络文明传播志愿者活动方案
2014/08/20 职场文书
高中美术教师事迹材料
2014/08/22 职场文书
党支部书记四风问题整改措施
2014/09/24 职场文书
幼儿园六一儿童节主持词
2015/06/30 职场文书
Python读取文件夹下的所有文件实例代码
2021/04/02 Python
MySQL数据库如何给表设置约束详解
2022/03/13 MySQL
通过T-SQL语句创建游标与实现数据库加解密功能
2022/03/16 SQL Server