Angular7/8/9 执行ng build --prod后API失效（普通构建正常）

常见原因与解决方法 #

结合“开发构建正常、生产构建请求无触发、接口地址格式校验正确”的场景，按出现概率从高到低排查即可定位问题：

• 混合内容静默拦截
  当前你配置的接口地址为http://roo2.in，若生产环境的前端页面部署在HTTPS域名下，浏览器会默认拦截所有从HTTPS页面发起的非加密HTTP请求。这类拦截无明显弹窗，仅在控制台提示混合内容限制，网络面板中看不到实际发出的请求记录，和你描述的现象完全匹配。
  解决：将接口地址协议调整为HTTPS，保证前端页面和API接口的传输协议一致，不出现跨协议请求。
• 生产环境配置未正确加载
  Angular 7-9版本的--prod构建默认会通过angular.json的文件替换规则，将根目录环境配置替换为environment.prod.ts的内容。如果你仅修改了根目录的environment.ts配置，实际生产构建时加载的依然是默认的prod环境配置，会导致实际请求地址和预期不符。
  解决：检查angular.json中production构建项的fileReplacements配置，确认生产构建确实加载了自定义的接口配置；同时确认this.apiRoutes.signup的取值逻辑，是基于environment.apiUrl拼接的完整绝对地址，而非硬编码的相对路径，避免生产部署时相对路径匹配错误。
• AOT编译下的拦截器逻辑异常
  开发构建默认使用JIT编译模式，类型校验宽松，即使拦截器存在逻辑问题，也可能不会阻断请求；但生产构建默认开启严格AOT编译、代码优化，拦截器中的异常逻辑会直接导致请求被拦截，无法正常发起。
  解决：临时将生产构建配置里的aot、optimization属性设为false，重新执行prod构建测试。如果请求恢复正常，逐行排查请求拦截器逻辑：
  • 确认拦截器内没有基于production: true的判断分支，直接跳过了请求发送流程
  • 确认POST请求的Content-Type等必要请求头，没有被AOT的严格类型校验剥离
• 前端安全规则拦截
  生产构建默认开启更严格的DomSanitizer校验，如果POST请求的参数包含未经过安全消毒的内容，会被Angular直接拦截，不会触发实际网络请求。
  解决：临时关闭生产构建的安全消毒逻辑做测试，若请求恢复正常，对请求参数中的特殊字符做安全转义处理。

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