Angular前端调用旧ASMX Web Service：跨域与部署问题及解决

问题背景 #

我们的Angular前端项目需要调用旧版ASMX Web Service，当前遇到两个核心问题：

• 服务与前端分属不同域名，存在CORS跨域限制
• 无法获取该Web Service的源代码

关于部署到我方域名的可行性 #

如果能获取到该ASMX服务的部署包（编译后的dll、Web.config等文件），可以直接将其部署到我方域名下的IIS服务器中，从根本上解决跨域问题。但如果没有部署权限或无法获取部署包，该方案无法实施。

可行解决方案 #

方案一：IIS URL Rewrite反向代理 #

这是无需修改原服务的可行方案，具体步骤如下：

1. 在我方域名的IIS默认网站下创建子站点（例如命名为SportsPortalAPI）
2. 确保IIS已安装URL Rewrite和**Application Request Routing (ARR)**模块
3. 为该子站点创建入站重写规则
4. 配置Web.Config，示例如下：

<rewrite>
<rules>
    <rule name="ReverseProxyInboundRule1" stopProcessing="true">
        <match url="(.*)" /> 
        <action type="Rewrite" url="http://domain1.com/sp/WebServices/json.asmx/GetPersonDetails" />
        <conditions>
            <add input="{QUERY_STRING}" pattern="GetPersonDetails" />
        </conditions>
    </rule>
    <rule name="ReverseProxyInboundRule2" stopProcessing="true">
        <match url="(.*)" /> 
        <action type="Rewrite" url="http://domain1.com/sp/WebServices/json.asmx/DropDownList" />
        <conditions>
            <add input="{QUERY_STRING}" pattern="DropDownList" />
        </conditions>
    </rule>
</rules>
</rewrite>

配置完成后，前端可通过我方域名的URL调用对应接口：

• 调用DropDownList方法：https://domain2.com/SportsPortalAPI/?q=DropDownList
• 调用GetPersonDetails方法：https://domain2.com/SportsPortalAPI/?q=GetPersonDetails

方案二：搭建自定义后端代理 #

在我方域名下搭建轻量级后端服务（如.NET Core、Node.js等），作为前端与ASMX服务的中间层：

• 前端请求我方后端代理接口
• 后端代理转发请求到目标ASMX服务，获取响应后再返回给前端
• 该方式更灵活，可按需添加请求/响应处理逻辑，比如参数转换、数据过滤等

方案三：浏览器扩展临时绕过（仅开发调试用） #

开发阶段可使用浏览器CORS扩展（如CORS Unblock）临时绕过跨域限制，但此方案仅适用于本地开发测试，不能用于生产环境。

内容的提问来源于stack exchange，提问作者Taha Zubair