Angular应用所有请求均被CORS拦截无法正常发送如何解决

CORS是浏览器同源策略强制的安全限制，和Angular框架本身无关。Postman/Insomnia属于桌面客户端，不受浏览器同源策略约束，所以能正常请求是正常现象。你调用Google等外部公共API出现跨域错误也符合预期：这类公共服务默认不会开放跨域权限给未知前端域名。

分不同场景选择对应方案即可：

1. 本地开发阶段：使用Angular内置代理（无需修改后端配置） #

这是Angular开发阶段处理跨域的标准方案：

• 在项目根目录新建proxy.conf.json文件，写入如下配置：

{
  "/api": {
    "target": "http://localhost:9080",
    "secure": false,
    "changeOrigin": true,
    "pathRewrite": {
      "^/api": ""
    }
  }
}

• 修改你的服务代码中的API_URL为/api，不要写完整的本地服务地址：

const API_URL = '/api'

• 修改package.json中的启动命令，添加代理参数：

"scripts": {
  "start": "ng serve --proxy-config proxy.conf.json",
  // 其余原有配置保持不变
}

• 之后用npm start启动项目，所有发往/api前缀的请求都会被代理转发到http://localhost:9080，本地开发不会再触发跨域问题。

2. 生产部署/需要直接调用后端的场景：确保后端CORS配置正确 #

你提到在server.xml配置CORS无效大概率是配置位置不对，Java后端正确配置CORS参考：

• 如果是SpringBoot项目，直接在启动类或对应Controller上添加@CrossOrigin(origins = "*")注解即可（生产环境建议替换为你的前端部署域名，不要用通配符）
• 如果是传统Tomcat项目，需要在web.xml中配置CORS过滤器而不是server.xml，示例配置：

<filter>
  <filter-name>CorsFilter</filter-name>
  <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
  <init-param>
    <param-name>cors.allowed.origins</param-name>
    <param-value>*</param-value>
  </init-param>
  <init-param>
    <param-name>cors.allowed.methods</param-name>
    <param-value>GET,POST,HEAD,OPTIONS,PUT,DELETE</param-value>
  </init-param>
  <init-param>
    <param-name>cors.allowed.headers</param-name>
    <param-value>Content-Type,X-Requested-With,accept,Origin,Access-Control-Request-Method,Access-Control-Request-Headers</param-value>
  </init-param>
</filter>
<filter-mapping>
  <filter-name>CorsFilter</filter-name>
  <url-pattern>/*</url-pattern>
</filter-mapping>

3. 外部API调用处理 #

所有未开放跨域权限的外部API，都不能直接在前端调用，无论使用什么前端框架都会触发CORS错误。正确做法是把外部API请求转发到你的Java后端，由后端发起请求再返回给前端，绕开浏览器跨域限制。

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