IIS部署前端项目请求返回404

于 2024-12-12 09:55:23 发布
阅读量921 收藏 21
点赞数 7
分类专栏： IIS IIS404 IIIS部署前端项目请求返回404 文章标签： 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/AIHBK/article/details/144407618
版权

问题描述

使用IIS部署的vue项目能正常访问静态页面，发送请求的时候一直提示404，如下图
在这里插入图片描述

一、安装 URL Rewrite、Application Request Routing
1、 安装URL Rewrite，下载地址
2.、安装 Application Request Routing，下载地址
下载后安装，安装完成抈IIS管理器会多出两个模块
在这里插入图片描述

二、IIS安装
1、打开控制面板 ->程序-> 打开程序和功能 -> 打开启用或关闭windows功能
在这里插入图片描述
三、部署用vue项目的web站点
1、将打包后的vue文件复制到服务器上（创建站点不会的可以自行百度）
2、部署成功后点击Application Request Routing
在这里插入图片描述
3、点击server proxy setting -> 勾选Enable proxy -> 应用在这里插入图片描述在这里插入图片描述
4、点击相应的站点 -> 点击url重写
在这里插入图片描述
5、添加规则
点击添加规则 -> 添加空白的入站规则
在这里插入图片描述
6、添加规则
名称：可以随便填
请求的url：选择与模式匹配
使用：通配符
模式：请求前缀（请求前缀是根据vite.config中配置的请求前缀来填）
后端实际访问地址：http://127.1.2.3:5173/document/00/test.jpg
vite代理后的访问地址：http://127.1.2.3:5173/serverApi/document/00/test.jpg
重写url：请求地址 + {R:2} 如：http://127.1.2.3:5173/{R:2}
在这里插入图片描述
注意：配置完成后会在站点目录下生成一个web.config文件，每次上传新的代码的时候不要把这个文件删除了，不然还得重新配置规则

VUE项目部署后无法请求接口（已解决）
fbqgdxw的博客
03-14 960
API接口和网站未发布在同一个端口号，一个:8801（API）,一个:8803(项目)。纯前端操作，绕过跨域问题
iis部署前后端分离项目（React前端，Node.js后端）
qsya的博客
07-03 2242
iis虽然已经有点过时，但不少用户还在用，故总结一下。
IIS错误解决方案（IIS部署后404错误解决方案）
06-16
IIS404错误完美解决方案 IIS404错误完美解决方案 IIS404错误完美解决方案 IIS404错误完美解决方案
Vue前端项目部署IIS的实现
10-15
主要介绍了Vue前端项目部署IIS的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
Vue部署后刷新页面出现404
Star_Inori的博客
06-28 1625
Vue部署后刷新页面出现404
IIS报错：HTTP 错误 404.0 - Not Found 您要找的资源已被删除、已更名或暂时不可用。最可能的原因: 指定的目录或文件在 Web 服务器上不存在。 URL 拼写错误。。。。
热门推荐
Amouzy的博客
05-20 2万+
IIS报错如下： 问题描述：在浏览器只能浏览到index.html页面，其他页面皆会出现以上报错。原因可能是因为项目文档将index.html设置为了默认文档。 解决步骤： 打开IIS管理器，找到该项目的以下界面： 双击“默认文档”，进入以下界面； 找到“index.html”,操作右边的“禁用”按钮 然后再在浏览器上刷新页面，即可正常浏览其他页面了。 ......
IIS部署VUE项目的路由相关问题（404）
weixin_47673008的博客
06-07 570
主要原因是因为在history模式下，Vue Router会尝试模仿传统的浏览器导航，使用HTML5的history.pushState API来改变URL，而不刷新页面。这意味着URL看起来会更像标准的URL，在这种模式下，当用户直接访问一个路由（如刷新页面或通过URL访问），服务器需要能够处理这个URL并返回index.html，然后由Vue Router根据URL渲染相应的视图。模式，正常部署完会发现刷新页面时会直接404，而且不是自己在路由中配置的404页面，是IIS自带的。
IIS部署前端项目刷新报错404
Ricale的博客
07-17 1445
react项目部署在windows服务器上时，使用IIS来部署，部署完成后打开响应ip+port没有报错，在相应页面点击刷新会出现这样的错误。解决办法：在项目根目录的web.config文件中使用下面一段代码即可(如果没有web.config可以手动创建一个)有的文章使用URL重写进行配置相关内容是一样的道理，使用URL重写配置之后也会自动生成相应的web.config。
IIS 部署问题 404
weixin_30917213的博客
05-19 347
　　在部署IIS环境中，偶尔会遇到 404 错误，就算以前遇到过，也因为时间久了导致大概知道是什么错了，具体解决方案觉忘了，所以留下一个记录，留给自己，也是给大家一点提醒。（注：错误信息也懒得截图了，希望大家谅解） 1.百度看到好多人说在web.config文件中添加modules runAllManagedModulesForAllRequests="true"配置项就能解...
在Windows服务器上使用IIS时，收到404错误（找不到文件或目录）
qq_56673429的博客
05-23 6133
按照以上步骤逐一检查，可以帮助你找出导致404错误的原因，并解决问题。确保文件存在、权限设置正确、IIS配置没有阻止访问、检查日志文件等都是排查问题的有效方法。如果问题仍然存在，请提供更多详细信息以便进一步分析。
在IIS上安装 thinkphp的方法
weixin_34162695的博客
12-21 893
1. 在iis安装 urlwrite 2. 安装php处理程序映射 3. 在项目中建立web.config, 键入以下内容： <?xml version="1.0" encoding="UTF-8"?> <configuration> <system.webServer> <rewrite> ...
Vue项目打包部署到iis服务器的配置方法
12-13
一 将Vue项目打包 切换到项目目录下，输入cnpm run build 打包 等待打包完成 二 URL 重写 访问我们的一个url 原因是vue不是根据项目目录的地址访问的，是根据vue-router转发路由访问url，在这里我们应该进行url rewrite url write的方式有两种，一种是在iis下载url rewrite工具配置规则 另一种是配置web.config文件，我用的是第二种 web.config内容 <?xml version="1.0" encoding="UTF-8"?> <system.webServer
windows server + iis 部署若伊前端vue项目
qq_16066907的博客
07-05 1316
打开windows server 自带的服务器管理器，打开添加角色和功能->下一步->下一步->选中web服务器（IIS）... 反正只需要选中iis服务，按着提示一直下一步安装就可以了。2，重复启动：最头疼的问题其实是这个，客户自己的运维人员，有的时候会自己操作，再启动一次或者多次nginx，导致后台实际上有多个nginx同时在运行，这种情况下只能通过任务管理器关闭nginx进程。点击确定，此时应该能够进入到若伊的登录也，上面的路径有#，此时获取不到验证码（我的已经调完了，所以有验证码）
前后端分离-IIS部署Vue前端项目
by0920的博客
03-07 1万+
背景： 项目采用前后端分离技术，后端主要用springBoot+springCloud等技术，前端采用Vue。部署中遇到了种种问题，尤其是前端部署中，以下是采用IIS部署的详细步骤，以及问题的解决方案，希望能帮助到大家。后端运行步骤在另一篇文章中有记载，查阅：https://blog.youkuaiyun.com/by0920/article/details/87911408 首先，编写前端代码，安装no...
关于iis 7.5 发布网页后404等相关问题整理合集
花落下的日子的博客
11-08 1913
iis发布之后404等问题解决方案整理
IIS部署vue项目刷新404问题
fankse的博客
07-13 866
注意： 新建文件后得重启下iis配置得web站点。在dist目录下新建web.config文件。
angular v8 保护署到IIS后刷新404问题解决
yuiku008的专栏
10-10 327
1.微软下载URL Rewrite 2.在部署目录添加web.config文件 <configuration> <system.webServer> <rewrite> <rules> <rule name="Angular Rule Root" stopProcessing="true"> <match url="(.*)" /> <cond.
.Net Core 8.0 IIS部署遇到奇怪的部分接口报404的问题解决
Leckun的专栏
06-07 1448
查看事件查看器，发现应该是数据过大时使用了临时文件夹，又没有权限导致的报错。把IIS_IUSER用户加入到C:\windows\TEMP目录中完全权限。经和群里讨论，大概意思是接口返回数据比较大的时候，就会出现这个问题。本地运行没问题，部署到IIS后，部分接口报404，其它接口都正常。
IIS发布网站 后台接口404
u012216568的博客
04-02 1402
接口404 今天同事部署一台电脑测试程序，IIS发布出来后网站可进登陆页面，但是调用后台接口404。纠结了好长时间，一头包。没办法只能排查问题点，查看IIS内ISAPI筛选器发现只有.NET2.0选项，但是C://Windows/Microsoft.NET 下面是有4.0的版本。那就重新注册下版本库： aspnet_regiis.exe -i 注册安装完成后，IIS内有了4.0配置，接口不再404，但是出现了新问题：CS0016错误，然后上网查找解决方案:更改C:\Windows\Temp权限 右键-
iis服务器怎么部署前端项目
最新发布
02-25
### 如何在IIS服务器上部署前端项目 #### 打开并配置 IIS 管理器 为了开始部署过程，需通过服务器管理器访问 Internet 信息服务 (IIS) 管理器。这可以通过点击“工具”下的“IIS 管理器”来实现[^1]。 #### 创建新网站或使用默认站点 对于已有默认站点的情况，可以在 IIS 管理器中的左侧窗格找到“网站”，接着右键单击“Default Web Site”。如果要创建新的独立站点，则应选择新建而非修改默认设置。此操作允许管理员根据需求自定义端口和其他参数。 #### 配置 URL 重写规则 针对 Nuxt.js 或其他 SPA（单页面应用程序），URL 重定向至关重要。可以利用正则表达式的灵活性来匹配所有请求路径，并将其转发到指定的服务地址；例如 `^(.*)` 可用于捕获任意 URI 路径片段，并将这些请求指向特定 IP 和端口号上的服务实例[^2]。 #### 编辑 web.config 文件以支持前端路由 为了让浏览器能够正确解析来自客户端应用内部链接而不返回404错误，需要适当调整 web.config 中的 rewrite rules 设置。具体来说，除了确保不存在实际文件对应于给定 URL 的情况下才执行重定向外，还需特别处理 API 请求以免误触该机制。下面是一个典型的例子： ```xml <configuration> <system.webServer> <rewrite> <rules> <!-- 将非API请求全部导向 index.html --> <rule name="index"> <match url="^((?!(api)).)*$" /> <conditions> <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" /> </conditions> <action type="Rewrite" url="/index.html" /> </rule> <!-- 特殊情况：如下载功能等 --> <rule name="dl" patternSyntax="Wildcard"> <match url="*dl/*" /> <action type="Rewrite" url="http://example.com/path/{R:2}" /> </rule> </rules> </rewrite> </system.webServer> </configuration> ``` 上述 XML 片段展示了如何为不同类型的请求设定不同的行为模式，从而提高用户体验的同时也保障了系统的正常运作[^3]。 #### 测试部署成果 完成以上步骤之后，记得测试已发布的网页是否能按预期工作。可通过直接访问所设域名或IP地址来进行初步验证，确认各项功能均无异常后再考虑进一步推广上线。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值