Vue IIS部署 api 访问当前站点 代理跳转真实API 问题

Vue IIS部署 api 访问当前站点 代理跳转真实API 问题

先确认 ARR 装没装

IIS 管理器 → 点最上面的服务器名 → 右边功能视图找 "Application Request Routing Cache" 没有找到就是没有装

装步骤

方法一:用 Web Platform Installer(推荐)

  1. 在前端服务器上打开 IIS 管理器
  2. 点最上面的服务器名 → 右边找 "Web Platform Installer"(如果没有,去微软官网下载安装)
  3. 搜索 Application Request Routing
  4. 安装 ARR 3.0(会自动带上依赖)

方法二:直接下载 MSI

  • 下载地址:https://www.iis.net/downloads/microsoft/application-request-routing
  • 选 WebPI 链接或直接下 ARRv3_setup.exe
  • 安装时一路下一步
    打开 IIS 管理器 → 服务器节点 → Application Request Routing Cache → 右边 Server Proxy Settings → 勾选 Enable proxy → 点应用。
    要重启IIS 重新打开IIS

vue web 站点web.config 调整

bash 复制代码
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <rewrite>
            <rules>
                <clear />
                <rule name="ReverseProxyInboundRule4" stopProcessing="true">
                    <match url="^blog/(.*)" />
                    <conditions logicalGrouping="MatchAll" trackAllCaptures="false" />
                    <action type="Rewrite" url="http://192.168.74.4:8088/{R:1}" />
                </rule>
                <rule name="ReverseProxyInboundRule5" stopProcessing="true">
                    <match url="^moodle/(.*)" />
                    <conditions logicalGrouping="MatchAll" trackAllCaptures="false" />
                    <action type="Rewrite" url="https://xxxx/{R:1}" />
                </rule>
              <rule name="ReverseProxyInboundRule3" stopProcessing="true">
    <match url="^api/(.*)" />
    <action type="Rewrite" url="http://192.168.74.92:7108/api/{R:1}" />
</rule>
                <rule name="API Rule" stopProcessing="true">
                    <match url="^(js|css)(.*)$" />
                    <conditions logicalGrouping="MatchAll" trackAllCaptures="false" />
                    <action type="None" />
                </rule>
                <rule name="Handle History Mode and custom 404/500" stopProcessing="true">
                    <match url="(.*)" />
                    <conditions logicalGrouping="MatchAll" trackAllCaptures="false">
                        <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                        <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                    </conditions>
                    <action type="Rewrite" url="/" />
                </rule>
                <rule name="SignalR" stopProcessing="true">
                    <match url="^teacherHub/(.*)" />
                    <conditions logicalGrouping="MatchAll" trackAllCaptures="false" />
                    <action type="Rewrite" url="http://localhost:7008/teacherHub" />
                </rule>
            </rules>
        </rewrite>
        <staticContent>
            <remove fileExtension=".pdf" />
            <mimeMap fileExtension=".pdf" mimeType="application/pdf" />
            <mimeMap fileExtension=".properties" mimeType="text/plain" />
            <mimeMap fileExtension=".bcmap" mimeType="octet-stream/bcmap" />
        </staticContent>
        <directoryBrowse enabled="true" />
        <httpProtocol>
            <customHeaders>
                <add name="Access-Control-Allow-Origin" value="*" />
                <add name="Access-Control-Allow-Methods" value="GET,PUT,POST,DELETE,OPTIONS" />
                <add name="Access-Control-Expose-Headers" value="Content-Type" />
                <add name="Access-Control-Allow-Credentials" value="true" />
            </customHeaders>
        </httpProtocol>
    </system.webServer>
</configuration>
相关推荐
weixin_449173651 小时前
react 的useEffect用法
前端·javascript·react.js
定栓1 小时前
Webpack迁到Vite第十节:vite.config.js 开发与构建流转全链路
vue.js·webpack·vite
涛涛ing1 小时前
2026年的前端:你引以为傲的框架,正在被浏览器原生能力“架空”
前端
计算机魔术师1 小时前
23项AI技术要管了:大模型API还出口得了吗?
前端
凤城老人1 小时前
ZhyCMS成长日记:一个企业 CMS 从 1.0 到 3.1.3 的折腾史
前端
定栓1 小时前
Webpack迁到Vite第二节:JSX 到 Render 函数
vue.js·webpack·vite
小羊没烦恼!2 小时前
T-SQL查询高级—SQL Server索引中的碎片和填充因子
开发语言·前端·javascript·数据库·后端·python·web安全