windows server + iis 部署若伊前端vue项目

简介: 5,配置url重写规则(重写后端请求)注:如果没有Application Request Routing Cachefourcloudbdueclaim和URL重写,则是第二部的那两个插件没装上打开iis,点击计算机->点击Application Request Routing Cache -> 打开功能

Blackey

windows server + iis 部署若伊前端vue项目

一、背景说明

工作原因,一直使用若伊前后端分离版框架进行二次开发。客户的服务器多数为windows server系统,少部分为linux系统。过去一直是使用nginx进行前端的部署,nginx的代理功能确实强大,但是在windows系统上发现一些小问题。前阵子机缘巧合之下发现了Windows server操作系统自带的iis服务,便尝试使用iis发布web服务。简单测试暂未发现问题。网上找了找,没有发现完整的指引,只在csdn看到一个说明,但是要订阅专栏才能看全文,恶心!

二、windows下使用nginx代理发现的问题

很多客户都是要求将系统部署到他们自己的内网服务器上,偶尔会手动关闭服务器。为了减少现场支持、远程支持的次数,降低成本,就要求前端服务具备服务器开机自启的功能。

1,开机自启:一直没有找到直接将nginx注册为windows服务的方法,只能通过第三方软件实现(名字忘了叫啥了);

2,重复启动:最头疼的问题其实是这个,客户自己的运维人员,有的时候会自己操作,再启动一次或者多次nginx,导致后台实际上有多个nginx同时在运行,这种情况下只能通过任务管理器关闭nginx进程。

三、部署环境

服务器操作系统版本:Windows Server 2022 Standard 21H2

若伊版本:3.8.8

四、部署步骤概要

1,安装iis服务(无需外网)

2,下载路由插件和重写插件(需要外网)

3,安装路由插件和重写插件

4,若伊vue项目调整并打包

5,配置网站

6,配置url重写规则

五、部署

1,安装iis服务(无需外网)

打开windows server 自带的服务器管理器,打开添加角色和功能->下一步->下一步->选中web服务器(IIS)... 反正只需要选中iis服务,按着提示一直下一步安装就可以了。这个过程不需要连接互联网也不需要重启。

安装完成后,在windows管理工具下面会有Internet Information Services(IIS)

2,下载并安装路由插件和重写插件(需要外网)

把这俩玩意下载下来,双击安装就好(链接我回头找一下,会发出来)

3,若伊vue项目调整并打包

打包之前,需要先调整一下路由的模式,history改为hash

4,配置网站

打开iis,左边选中网站,右边点击“添加网站...”(“网站”展开后有一个默认的网站,可以先删了)

设置网站名称(随便写)、物理路径(前端打包后的dist文件夹,选到index.html所在文件夹)、ip地址、端口

点击确定,此时应该能够进入到若伊的登录也,上面的路径有#,此时获取不到验证码(我的已经调完了,所以有验证码)

 

5,配置url重写规则(重写后端请求)

注:如果没有Application Request Routing Cachefourcloudbdueclaim和URL重写,则是第二部的那两个插件没装上

打开iis,点击计算机->点击Application Request Routing Cache -> 打开功能

点击 网站下面刚刚创建的ruoyi-web,点击URL重写,点击打开功能

点击添加规则

选择空白规则,点确定

设置

名称:若伊后端(随便写)

请求的URL:与模式匹配

使用:通配符

模式:prod-api/*

操作类型:重写

重写URL:http://10.10.0.18:8080/{R:1}

设置完就大功告成了!

相关文章
|
27天前
|
监控 前端开发 数据可视化
3D架构图软件 iCraft Editor 正式发布 @icraft/player-react 前端组件, 轻松嵌入3D架构图到您的项目,实现数字孪生
@icraft/player-react 是 iCraft Editor 推出的 React 组件库,旨在简化3D数字孪生场景的前端集成。它支持零配置快速接入、自定义插件、丰富的事件和方法、动画控制及实时数据接入,帮助开发者轻松实现3D场景与React项目的无缝融合。
100 8
3D架构图软件 iCraft Editor 正式发布 @icraft/player-react 前端组件, 轻松嵌入3D架构图到您的项目,实现数字孪生
|
1月前
|
前端开发 测试技术
前端工程化的分支策略要如何与项目的具体情况相结合?
前端工程化的分支策略要紧密结合项目的实际情况,以实现高效的开发、稳定的版本控制和顺利的发布流程。
27 1
|
1月前
|
前端开发 Unix 测试技术
揭秘!前端大牛们如何高效管理项目,确保按时交付高质量作品!
【10月更文挑战第30天】前端开发项目涉及从需求分析到最终交付的多个环节。本文解答了如何制定合理项目计划、提高团队协作效率、确保代码质量和应对项目风险等问题,帮助你学习前端大牛们的项目管理技巧,确保按时交付高质量的作品。
37 2
|
1月前
|
前端开发 JavaScript 开发者
React与Vue:前端框架的巅峰对决与选择策略
【10月更文挑战第23天】React与Vue:前端框架的巅峰对决与选择策略
|
1月前
|
前端开发 JavaScript 数据管理
React与Vue:两大前端框架的较量与选择策略
【10月更文挑战第23天】React与Vue:两大前端框架的较量与选择策略
|
29天前
|
JavaScript 前端开发 搜索推荐
Vue的数据驱动视图与其他前端框架的数据驱动方式有何不同?
总的来说,Vue 的数据驱动视图在诸多方面展现出独特的优势,其与其他前端框架的数据驱动方式的不同之处主要体现在绑定方式、性能表现、触发机制、组件化结合、灵活性、语法表达以及与后端数据交互等方面。这些差异使得 Vue 在前端开发领域具有独特的地位和价值。
|
2月前
|
JavaScript 前端开发 算法
前端优化之超大数组更新:深入分析Vue/React/Svelte的更新渲染策略
本文对比了 Vue、React 和 Svelte 在数组渲染方面的实现方式和优缺点,探讨了它们与直接操作 DOM 的差异及 Web Components 的实现方式。Vue 通过响应式系统自动管理数据变化,React 利用虚拟 DOM 和 `diffing` 算法优化更新,Svelte 通过编译时优化提升性能。文章还介绍了数组更新的优化策略,如使用 `key`、分片渲染、虚拟滚动等,帮助开发者在处理大型数组时提升性能。总结指出,选择合适的框架应根据项目复杂度和性能需求来决定。
|
1月前
|
前端开发 JavaScript 开发者
React与Vue:前端框架的巅峰对决与选择策略
【10月更文挑战第23天】 React与Vue:前端框架的巅峰对决与选择策略
|
2月前
|
存储 人工智能 前端开发
前端大模型应用笔记(三):Vue3+Antdv+transformers+本地模型实现浏览器端侧增强搜索
本文介绍了一个纯前端实现的增强列表搜索应用,通过使用Transformer模型,实现了更智能的搜索功能,如使用“番茄”可以搜索到“西红柿”。项目基于Vue3和Ant Design Vue,使用了Xenova的bge-base-zh-v1.5模型。文章详细介绍了从环境搭建、数据准备到具体实现的全过程,并展示了实际效果和待改进点。
183 2
|
2月前
|
JavaScript 前端开发 程序员
前端学习笔记——node.js
前端学习笔记——node.js
49 0
下一篇
DataWorks