部署Web API与Angular：能否将两个Azure部署地址合并为单一URL？

完全可以实现，以下是Azure生态下三种常用的适配方案，你可以根据自己的项目规模、成本要求、部署场景选择：

方案1：Azure Front Door（生产环境首选） #

• 核心逻辑：通过反向代理的路径路由规则，将同一个域名下不同路径的请求分发到不同的后端应用
  • 例如配置https://你的自定义域名/路径下的所有请求转发到Angular静态应用
  • https://你的自定义域名/api/开头的所有请求转发到Web API后端
• 优势：自带WAF安全防护、全球CDN加速、流量灰度、故障转移能力，不需要修改现有两个应用的原有部署配置，适配绝大多数生产场景
• 配置要点：
  • 先将自定义域名绑定到创建的Front Door实例
  • 新增两个后端池，分别关联Angular应用和Web API的原有访问地址
  • 添加两条路由规则，匹配不同的路径前缀后指向对应后端池，按需开启路径重写功能即可

方案2：Azure Application Gateway #

• 适用场景：如果你的两个应用都部署在Azure虚拟网络内部，不需要直接对公网暴露，选择该方案网络安全性更高
• 配置逻辑和Azure Front Door一致，同样基于路径路由规则转发不同请求到对应后端服务

方案3：Angular部署环境内置反向代理（成本最低） #

• 如果你使用Azure App Service部署Angular应用，不需要额外增配服务，可以直接在App Service中配置web.config（Windows宿主）或者nginx.conf（Linux宿主）的反向代理规则，把/api前缀的请求直接转发到Web API的访问地址
• 优势：不需要额外采购云服务，实现成本最低，适合小型个人项目使用
• 注意事项：需要提前配置Web API的CORS规则避免跨域问题，同时调整代理规则不要影响Angular自身的静态资源路由

• 不管选哪种方案，都需要先将Web API的接口前缀统一（比如所有接口都带/api前缀），避免和Angular的前端路由产生冲突
• 路由规则配置要注意优先级，API前缀的匹配规则要放在Angular根路径规则之前，避免请求被根规则拦截
• 如果使用自定义域名，需要提前做好域名的DNS解析配置，同时配置SSL证书保证HTTPS访问正常
• 配置完成后建议依次测试静态资源加载、API接口请求、前端路由直接刷新三类场景，确认没有异常

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