Angular 应用程序中浏览器中的 CORS 错误答案

【问题标题】：CORS error in Browser in Angular ApplicationAngular 应用程序中浏览器中的 CORS 错误
【发布时间】：2019-09-11 02:31:57
【问题描述】：

您好开发者社区，我正在从 Angular 6 客户端访问 RESTful API（用 Spring Hibernate 编写）。当我从本地运行 Angular 层时，我不断收到 CORS 这个错误：

“从源 'http://localhost:4200' 访问 XMLHttpRequest 在 'http:///SpringDemoSecurity/login' 已被 CORS 策略阻止：对预检请求的响应未通过访问控制检查：它没有 HTTP ok状态。” 我在来自 Java 层的响应中添加了 Allow-Access-* 标头，但没有帮助。我可以在邮递员应用程序的响应中看到这些标题。我无法从我的浏览器中消除这些错误。

跟踪堆栈溢出和其他地方的许多线程以在请求和响应对象中添加所有标头，并使用 Postman REST 客户端应用程序检查它们的存在，但没有用。 Java 层是 AWS EC2 实例，而 Angular 在本地运行。

下面是我的 Filter 类中的 Java 代码 sn-p：

response.addHeader("Access-Control-Allow-Origin", "*");
response.addHeader("Access-Control-Max-Age", "864000");
response.addHeader("Access-Control-Allow-Methods", "GET, OPTIONS, HEAD, PUT, POST, PATCH, DELETE");
response.addHeader("Access-Control-Allow-Headers", "X-Requested-With,content-type,authorization,token");
response.addHeader("Access-Control-Allow-Credentials", "true");
// For HTTP OPTIONS verb/method reply with ACCEPTED status code -- per CORS handshake
        if (request.getMethod().equals("OPTIONS")) {
            response.setStatus(HttpServletResponse.SC_ACCEPTED);
            return;
        }

我想不通。在堆栈溢出上尝试了很多东西。对此的任何帮助都将受到高度赞赏。 - 斯瓦蒂

【问题讨论】：

请跟随本教程howtodoinjava.com/spring5/webmvc/spring-mvc-cors-configuration

标签： javascript angular spring jakarta-ee cors

【解决方案1】：

收到 OPTIONS 方法后，您当前正在回复一个 HttpServletResponse.SC_ACCEPTED，它代表 202 响应代码。您需要发送一个 200 代码 (HttpServletResponse.SC_OK)。看看这个。

【讨论】：

【解决方案2】：

在 Angular 6 中为此使用代理技术。您必须在 Angular 应用程序的根目录中创建一个 proxyconfig.json 文件。你可以关注这个视频-CORS in Angular 6

或者它也可以在 API 创建期间在后端解决。

【讨论】：

【解决方案3】：

CORS 源是一个被阻止的浏览器，后端没有任何事情可以允许这样做。有两种方法可以避免：

1) 如果您使用的是 json，请尝试使用 JSONP

2) （我在这里所做的）将您的后端转换为接受 Websocket 连接。 websocket 允许访问另一个来源。您的后端地址为 ws://localhost:4200。

希望能帮到你:)

【讨论】：