vue模式history下在iis中配置流程

1.npm run build生成代码加密

2.在iis添加网站定位到dist文件下

第三步第四步配置是www.baidu.com/home一直重新刷新会出现404问题

3.安装URL重写

https://www.iis.net/downloads...

4.在dist文件下配置web.config

<system.webServer>
  <rewrite>
   <rules>
    <rule name="Handle History Mode and custom 404/500" stopProcessing="true">
     <match url="(.*)" />
     <conditions logicalGrouping="MatchAll">
      <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
      <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
     </conditions>
     <action type="Rewrite" url="/" />
    </rule>
   </rules>
  </rewrite>

   </system.webServer>遇到一个问题：多访问几次页面或者端口应用程序池的状态会结束（事件ID5002，错误503），原因是后台占用内存太大，解决方法：要勾选预编译并发布版本。

总结

以上所述是小编给大家介绍的vue模式history下在iis中配置流程，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的！

赞 (0)

相关推荐

  • 详解如何将 Vue-cli 改造成支持多页面的 history 模式

    标题可能描述不准确, 大概就是这么个需求: 用 Vue-cli 搭建一个多入口, 多页面的站点, 也就是通过html-webpack-plugin插件会生成多个 .html 文件, 在默认下, 是只有 index.html 这个入口可以用 history 模式, 如: http://www.xxx.com/xxx/xxx, 而其他的入口只能用 hash 模式, 如: http://www.xxx.com/admin.html#/xxx/xxx, 因为webpack-dev-middleware会

  • 在nginx上部署vue项目(history模式)的方法

    vue-router 默认是hash模式,使用url的hash来模拟一个完整的url,当url改变的时候,页面不会重新加载.但是如果我们不想hash这种以#号结尾的路径时候的话,我们可以使用路由的history的模式.比如如下网址: 使用hash模式的话,那么访问变成 http://localhost:8080/bank/page/count/#/ 这样的访问,如果路由使用 history的话,那么访问的路径变成 如下: http://localhost:8080/bank/page/count

  • vue-router中的hash和history两种模式的区别

    众所周知,vue-router有两种模式,hash模式和history模式,这里来谈谈两者的区别. hash模式 hash模式背后的原理是onhashchange事件,可以在window对象上监听这个事件: window.onhashchange = function(event){ console.log(event.oldURL, event.newURL); let hash = location.hash.slice(1); document.body.style.color = has

  • Vue下路由History模式打包后页面空白的解决方法

    vue的路由在默认的hash模式下,默认打包一般不会有什么问题,不过hash模式由于url会带有一个#,不美观,而且在微信分享,授权登录等都会有一些坑.所以history模式也会有一些应用场景.新手往往会碰到history模式打包后页面一片空白的情况,而且没有资源加载错误的报错信息. 这个其实仔细研究下会发现,如果项目直接放的跟目录, 那么是没有问题的,如果是子目录,那么就会一片空白了.这个vue官方有解释,需要加一个base // base: '/history', // mode: 'his

  • vue router嵌套路由在history模式下刷新无法渲染页面问题的解决方法

    vue router嵌套路由在history模式下刷新无法渲染页面问题的解决方法

    解决vue-router嵌套路由(子路由)在history模式下刷新无法渲染页面的问题,具体内容如下 一. 异常描述 本来使用的是vue-router的hash模式,但是hash模式下url需要带"#"符号,不仅看起来不舒服,而且有些场景下是会破坏路由中的"#"(微信分享页面就会把"#"后边的内容处理掉),所以就需要使用history模式,然后就让后端改下nginx配置: location / { try_files $uri $uri/ /in

  • Vue-router 中hash模式和history模式的区别

    Vue-router 中hash模式和history模式的关系 在vue的路由配置中有mode选项 最直观的区别就是在url中 hash 带了一个很丑的 # 而history是没有#的 mode:"hash";   mode:"history"; hash模式和history模式的不同 对于vue这类渐进式前端开发框架,为了构建 SPA(单页面应用),需要引入前端路由系统,这也就是 Vue-Router 存在的意义.前端路由的核心,就在于 -- 改变视图的同时不会向

  • vue模式history下在iis中配置流程

    1.npm run build生成代码加密 2.在iis添加网站定位到dist文件下 第三步第四步配置是www.baidu.com/home一直重新刷新会出现404问题 3.安装URL重写 https://www.iis.net/downloads... 4.在dist文件下配置web.config <system.webServer> <rewrite> <rules> <rule name="Handle History Mode and custo

  • Windows 8 IIS中配置PHP运行环境的方法

    Windows 8 IIS中配置PHP运行环境的方法

    在Windows 8 的IIS(8.0)中搭建PHP运行环境: 一:安装IIS服务器 1.进入控制面板>>程序和功能>>打开或关闭Windows 功能,找到Internet信息服务,记得选中CGI这一项 2.安装完成后在浏览器中打开localhost,查看是否能显示IIS的欢迎页面: 二:下载安装配置PHP环境 1.下载PHP,官网地址:http://windows.php.net/download/, 2.将下载的zip压缩包解压到D盘下,解压后为E:\php; 3.进入控制面板

  • Win7下在IIS7中配置PHP的FastCGI支持_笔记

    Win7下在IIS7中配置PHP的FastCGI支持_笔记

    在Windows7的控制面板-程序中"打开/关闭Windows功能",在里面打开IIS,不要忘了打开IIS里的CGI(这个默认是不选的),如下图(不自己截了,直接用微软的图): 然后就是"确定",等着安装,接下来是PHP了,在"http://windows.php.net/download/"里下载,我下的是VC9 x86 Thread Safe的Zip包,5.3.1的(写文时最新的).下好后解压到随便哪个目录里,我放到C:\php目录下,做下面

  • 针对Vue路由history模式下Nginx后台配置操作

    前端将vue路由模式改为history模式后需要运维配置才能正常访问,配置信如下 location / { root html; index index.html index.htm; try_files $uri $uri/ @rewrites; } location @rewrites { rewrite ^(.+)$ /index.html last; } 经测试,可以正常访问 补充知识:Vue History 模式下 整合Nginx部署踩坑过程 在公司部署Vue项目期间,因Vue的Rou

  • 详解Vue路由History mode模式中页面无法渲染的原因及解决

    详解Vue路由History mode模式中页面无法渲染的原因及解决

    Vue下路由History mode导致页面无法渲染的原因 用 Vue.js + vue-router 创建单页应用,是非常简单的.使用 Vue.js ,我们已经可以通过组合组件来组成应用程序,当你要把 vue-router 添加进来,我们需要做的是,将组件(components)映射到路由(routes),然后告诉 vue-router 在哪里渲染它们. 一般开发的单页应用的URL都会带有#号的hash模式,因为整个应用本身而言就只有一个HTML,其他的都是通过router来渲染.如果因为业务

  • Vue Router history模式的配置方法及其原理

    vue-router分为 hash和 history模式,前者为其默认模式,url的表现形式为 http://yoursite.com#home,比较难看.后者的url表现形式为 http://yoursite.com/home,比较美观. 但如果要使用 history模式,我们需要在后端进行额外配置.本文将讨论如何配置以及为什么要这样配置. history模式的配置方法 我们来看看官方文档是教我们怎么配置的:HTML5 History 模式. 首先要将 mode设置为 history: con

  • Vue项目history模式下微信分享爬坑总结

    每回遇到微信分享都是一个坑,目前的商城项目使用Vue开发,采用history的路由模式,配置微信分享又遇到了很多问题,最后终于解决了,现将解决的过程分享一下. 技术要点 Vue,history 常见问题及说明 debug模式下报false 这个没得说,就是调用wx.config方法的参数错误造成的,请确认以下事项: 是否成功绑定了域名(域名校验文件要能被访问到) 使用最新的js-sdk文件,因为微信会改部分api config方法的参数是否传正确了(拼写错误.大小写...) 需要使用的方法是否写

  • 详解nginx配置vue h5 history去除#号

    vue的默认配置是使用hash模式,这样我们访问的时候都带有了一个#号,再支付回调的地址或者其他原因不支持#号或者不喜欢#号这种模式,优势就出现了需要去除#号,于是vue端就需要配置该模式,并且使用懒加载,vue端的配置如下: 首先先声明一下,这是使用vue+nginx实现前后端分离的项目,并且使用vue axios实现代理功能(允许跨域并且服务端已经开启跨域), 然后就是打包的配置: !!!注意,这里配置的assetsPublicPath一定要配置成  "/"  而不是  "

  • 详解IIS中的重写工具下关于操作重定向URL中的{R:N}与{C:N}使用介绍

    详解IIS中的重写工具下关于操作重定向URL中的{R:N}与{C:N}使用介绍

    URL Rewrite(URL重写工具)作为IIS下较为常用的模块组件, 提供了重写.重定向.自定义响应.中止请求等功能.但是其相关的中文资料比较缺少,官方倒是有完整和详细的英文文档,之前我在项目中遇到需要设置重写/重定向URL操作规则时,对于范例中的{R:N}和{C:N}规则就理解的十分辛苦,因此写下本文分享下经验. 这里先附上官网的文档,其实文档链接在IIS的URL重写模块的右边菜单就有:URL Rewrite Module Configuration Reference(URL重写模块配置

随机推荐