nuxt.js express模板项目IIS部署
继续上一篇的nuxt/express项目部署,还是windows上要把nuxt的服务端渲染项目跑起来,这次的目的是用已经有的域名windows服务器上一个虚拟目录反向代理部署在其他端口nuxt项目。
情况说明:
1.现有的服务器只有windows server的服务器
2.服务器IIS已经部署了多个站点,80端口毫无疑问被占用
尝试的方案:
1.nginx使用虚拟目录监听80端口,反向代理本地其他端口,例如需要的3000端口,nginx的服务无法启动,80端口已经被占用
2.iis有个iisnode可以直接运行node.js的环境,这个尝试过写个express的demo,确实可以运行,但是nuxt的项目编译后也找不到怎么去在这种环境下部署,官方文档暂时也没有提到过,先放弃
3.iis有自己的反向代理配置,Application Request Routing简称ARR,这个是已经运行通过的方案,下面就主要记录一下这个,希望对有相同问题的朋友有帮助。
环境准备:
1. 能运行nuxt的项目的相关环境,确保本地localhost能运行起来
2.ARR(Application Request Routing)下载地址:https://www.iis.net/downloads/microsoft/application-request-routing
配置详细说明:
1. 安装ARR,安装后IIS根配置页会多出来两个配置项,那么就安装成功了。

2.确保host在其他端口的nuxt项目能正常反问
不管你是在cmd的node启动的服务还是pm2挂载的服务,首先确保http://127.0.0.1:3000/本地访问正常,然后再开始配置iis的反向代理

3.站点下创建应用程序
ARR的配置实际上会在站点的web.config文件里面写入一些配置内容,如果是独立应用程序的话,会在相应的目录下创建一个新的文件,不影响已有的主站点web.config的配置内容,保证互补影响。

4.配置ARR反向代理
双击ARR打开配置

打开代理设置

启用代理的勾上,应用设置

选择上面站点下创建的应用程序,打开主页设置,打开URL重写设置

添加规则,选择反向代理

填写本地需要代理的地址

然后使用http://localhost/app访问主页

这里其实是有问题的,因为我们用的是虚拟目录代理的是一个站点的根目录,所以引用的js,css和图片等资源的地址是相对路径的话就无法访问了,网上有一些解决办法是配置出站规则,但是对于nuxt编译后的项目来说,代理访问的内容gzip压缩,无法应用出站规则,而且微软的这项配置复杂,需要配置每个标签的出站规则。
这里其实就是一个路径引用问题,既然用到了vue-ruter,路由的根配置修改为虚拟目录名字一样就可以了


配置好编译,继续发布运行后,保证http://127.0.0.1:3000/app正常访问,然后修改iis代理配置


然后就可以访问80端口的虚拟目录了,资源无法加载的问题解决了。
nuxt.js express模板项目IIS部署的更多相关文章
- nuxt.js express模板项目服务器部署
nuxt版本:0.10.6 技术栈:nuxt.js, express, pm2 部署环境:windows server 之前用nuxt.js 的express的模板项目在windows下用nginx进 ...
- nuxt.js express模板项目虚拟目录部署问题汇总
声明环境 反向代理:nginx或者iis的ARR 模板项目:nuxt-express 部署环境:windows 经过了一段时间在windows环境部署项目来看,关于虚拟目录的问题汇总如下, 发布场景假 ...
- Node.js Express+Mongodb 项目实战
Node.js Express+Mongodb 项目实战 这是一个简单的商品管理系统的小项目,包含的功能还算挺全的,项目涵盖了登录.注册,图片上传以及对商品进行增.删.查.改等操作,对于新手来说是个很 ...
- 从壹开始 [ Nuxt.js ] 之二 || 项目搭建 与 接口API
前言 哈喽大家周一好,今天的内容比较多,主要就是包括:把前端页面的展示页给搭出来,然后调通接口API,可以添加数据,这两天我也一直在开发,本来想一篇一篇的写,发现可能会比较简单,就索性把项目搭建的过程 ...
- [转] node.js express的安装与部署,以及pm2下的运行启动。
node.js 下的express 安装可以参考官方网站的 http://www.expressjs.com.cn/ 这里主要讲一下一些不同的地方,将我们生成的dist文件夹里的文件放在public里 ...
- 总结在Visual Studio Code创建Node.js+Express+handlebars项目
一.安装node.js环境. Node.js安装包及源码下载地址为:https://nodejs.org/en/download/ 32 位安装包下载地址 : https://nodejs.org/d ...
- next.js、nuxt.js等服务端渲染框架构建的项目部署到服务器,并用PM2守护程序
前端渲染:vue.react等单页面项目应该这样子部署到服务器 貌似从前几年,前后端分离逐渐就开始流行起来,把一些渲染计算的工作抛向前端以便减轻服务端的压力,但为啥现在又开始流行在服务端渲染了呢?如v ...
- 【前端vue进阶实战】:从零打造一个流程图、拓扑图项目【Nuxt.js + Element + Vuex】 (一)
本系列教程是用Vue.js + Nuxt.js + Element + Vuex + 开源js绘图库,打造一个属于自己的在线绘图软件,最终效果:topology.le5le.com .如果你觉得好,欢 ...
- Nuxt.js的踩坑指南(常见问题汇总)
本文会不定期更新在nuxt.js中遇到的问题进行汇总.转发请注明出处,尊重作者,谢谢! 强烈推荐作者文档版踩坑指南,点击跳转踩坑指南 在Nuxt的官方文档中,中文文档和英文文档都存在着不小的差异. 1 ...
随机推荐
- 如何在同一台机器上安装多个MySQL的实例 转
https://www.cnblogs.com/shangzekai/p/4375271.html 最近由于工作的需要,需要在同一台机器上搭建两个MySQL的实例,(注:已经存在了一个3306的MyS ...
- SpringMVC08AnnotationException 注解异常
1.配置web.xml文件 <!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3// ...
- 用命令行的方式将本地项目上传到git
1.(先进入项目文件夹)通过命令 git init 把这个目录变成git可以管理的仓库 git init 2.把文件添加到版本库中,使用命令 git add .添加到暂存区里面去,不要忘记后面的小数点 ...
- 一、 Spring IOC 简介
一 . 什么是IOC(Inversion of Control) IOC :控制反转,也称为依赖注入(DI).听起来有点云里雾里,他到底是个啥,为什么Spirng中最基础的就是它? 我们的项目其实都是 ...
- 解决WinSCP连接虚拟机
其实虚拟机你也可以将它形象化,认为它就是一台电脑,只是这个电脑在你的内存中,所以,一般电脑所具有的的功能虚拟机一样拥有,它也可以当成一台独立的个体哦. 针对很多使用WinSCP连接不上虚拟机的问题,这 ...
- bootstrap Table的 一些小操作
function HQCreatTable(ob) { var option = { cache: false,//是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*) scroll ...
- mysql5.6.31安装及配置
1,下载安装包解压到安装位置.下载地址https://dev.mysql.com/downloads/mysql/5.6.html#downloads 2,修改默认配置文件 在根目录下面有my-def ...
- 【extjs6学习笔记】1.9 初始: Mixins
Mixin允许我们使用一个类的函数作为另一个类的函数而不继承. Mixins可以使用mixins关键字定义,并将值指定为JSON对象,其中属性的名称应该是要使用的方法的名称,属性的值将是定义方法的类的 ...
- 截取网卡IP地址
方法一: ifconfig eth1|awk 'NR==2 {print $2}' 方法二"" ifconfig eth1|grep -Po "(?<=inet ) ...
- logname,who -m,who -q,id,su,su -l 用户名,su -,date,cal,cal 12 2009,cal -y 2008,du -s 目录,
logname,who -m,who -q,id,su,su -l 用户名,su -,date,cal,cal 12 2009,cal -y 2008,du -s 目录,