Angular 和播放框架从源访问 XMLHttpRequest 已被 CORS 策略阻止

Posted 2023-03-04

【中文标题】Angular 和播放框架从源访问 XMLHttpRequest 已被 CORS 策略阻止

【英文标题】：Angular and play framework Access to XMLHttpRequest from origin has been blocked by CORS policy

【发布时间】：2021-11-12 11:02:43

【问题描述】：

在我的示例应用程序中，我有一个通过前端（角度 js）执行的获取请求，以从我的 java 后端（播放框架）检索信息。

我的角度要求是：

 function getGeneralInfo() 
        $http(method: 'GET', url: 'sample' + 'generalInfo').
            success(function(response) 
                loadInfo(response);
            ).then(function(response)
                check();
            ).catch(function(e)
                console.log("failure getting info");
            );
    

在我的后端配置文件中添加以下选项：

application.ACCESS_CONTROL_ALLOW_ORIGIN="*"

所以当我执行邮递员的 GET 请求时，我得到了预期的结果，并且一切正常。 但是如果我通过 Chrome 浏览器执行请求，我可以在控制台中看到这个错误：

Access to XMLHttpRequest at 'http://192.168.10.45:9000/sample/generalInfo' from origin 'http://localhost:3001' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

在我的后端日志中，我可以看到这个堆栈跟踪：

 - Internal server error, for (OPTIONS) [/sample/generalInfo

为什么我在后端看到一个选项请求，而在前端我发送一个获取请求？ 我该如何解决这个错误？谢谢

【参考方案1】：

这不是一个错误，它被称为preflight request 浏览器使其获取 CORS 标头，如果没有，则根本不会完成 GET 请求。 因此，您还需要处理所有选项请求并将正确的 CORS 标头放在那里

【讨论】：

感谢您的回答，但这并不能解释为什么即使我以这种方式设置 cors：application.ACCESS_CONTROL_ALLOW_ORIGIN = "*" 错误仍然存​​在