cors: strict-origin-when-cross-origin: react + nginx + elasticsearch

Question

今天下午我对我的 React 应用程序做了一些小改动。但是，当尝试从我的 elasticsearch 服务器获取信息时，我收到了 strict-origin-when-cross-origin 错误。我过去收到过 CORS 错误，并且总是能够以某种方式处理它们，但这次我被卡住了。

我的设置：

我有 React 应用程序，使用 axios，发出以下获取请求：

const authorization = process.env.REACT_APP_ELASTICSEARCH_AUTHORIZATION;

const header = {
'Authorization': authorization,


}

axios.get(`${path}/${searchIndex}/_search`,
            {headers: header}

然后请求被发送到我的代理服务器运行 nginx。

设置有以下几种：

location /somelocation/ {
         proxy_pass https://someip:someport/;
         proxy_redirect off;
         proxy_set_header  X-Real-IP  $remote_addr;
         proxy_set_header  X-Forwarded-For $proxy_add_x_forwarded_for;
         proxy_set_header  Host $http_host;
         proxy_pass_header Access-Control-Allow-Origin;
         proxy_pass_header Access-Control-Allow-Methods;
         proxy_hide_header Access-Control-Allow-Headers;
         add_header Access-Control-Allow-Headers 'X-Requested-With, Content-Type';
         add_header Access-Control-Allow-Credentials true;
         proxy_pass_header Authorization; 
}

在 elasticsearch 服务器上，我有以下 CORS 设置：

http.cors.enabled: true
http.cors.allow-credentials: true
http.cors.allow-origin: '*'
http.cors.allow-headers: X-Requested-With, X-Auth-Token, Content-Type, Content-Length, Authorization, Access-Control-Allow-Headers, Accept
http.cors.allow-methods: OPTIONS, HEAD, GET, POST, PUT, DELETE

使用 React 应用程序正在使用的路径从邮递员发出请求，效果非常好。在传递必要的用户名+密码后，我还可以从我的浏览器执行请求。只有 React 应用程序（在本地主机上开发运行）似乎不起作用。

来自https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS/Errors 我的理解：

strict-origin-when-cross-origin (default)

Send the origin, path, and querystring when performing a same-origin request. For cross-origin requests send the origin (only) when the protocol security level stays same (HTTPS→HTTPS). Don't send the Referer header to less secure destinations (HTTPS→HTTP).

我认为问题可能出在应用程序运行在 HTTP 而不是 HTTPS 上，但是运行通过 'HTTPS=true npm start' 应用程序并没有解决问题。我尝试了不同的调整，无论是在请求端（axios）还是在 nginx 或 es yml 文件中，但似乎没有任何效果。感谢您的帮助，并向您致以诚挚的问候。

编辑：

现在还包括屏幕截图：

Answer 1

好的，我在今天下午的课程中解决了这个错误。首先，并非所有错误消息都显示在我的控制台中，这当然使检测错误变得更加困难。正如上面正确指出的那样，我看到的错误消息只是一条通用消息。在我的控制台中，我需要将设置更新为以下内容：

之后可以看到完整的 CORS 错误，这需要我对 NGINX 代理服务器和 elasticsearch 服务器进行一些更改。

第一个错误是：“header 预检响应中 Access-Control-Allow-Headers 不允许字段授权”

尽管 elasticsearch 服务器允许授权 header，但这是 - 如果我错了请纠正我 - NGINX 代理服务器未正确传递，因为那里的设置是：“proxy_hide_header Access-Control-Allow-Headers;"

我将 NGINX 设置更改为：

         proxy_pass https://******:9200/;
         proxy_redirect off;
         proxy_set_header  X-Real-IP  $remote_addr;
         proxy_set_header  X-Forwarded-For $proxy_add_x_forwarded_for;
         proxy_set_header  Host $http_host;
         proxy_pass_header Access-Control-Allow-Origin;
         proxy_pass_header Access-Control-Allow-Methods;
#         proxy_hide_header Access-Control-Allow-Headers;
        proxy_pass_header Access-Control-Allow-Headers;
        # add_header Access-Control-Allow-Headers 'X-Requested-With, Content-Type';
        # add_header Access-Control-Allow-Credentials true;
         proxy_pass_header Authorization;

被注释掉的行是旧的配置。

尝试几个新请求时，显示了其他 CORS 策略，例如 access-control-allow-methods 不被 Access-control-Allow-Headers 允许，access-control-allow-origin 不被 Access-Control-Allow-Headers 允许。 .. 那时错误清楚地表明要做什么，即将这些字段添加到 elasticsearch 配置文件中的 Access-Control-Allow-Headers 部分。

完成所有内容后，elasticsearch 配置 yml 文件如下所示：

http.cors.enabled: true
http.cors.allow-credentials: true
http.cors.allow-origin: '*'
http.cors.allow-headers: X-Requested-With, X-Auth-Token, Content-Type, Content-Length, Authorization, Access-Control-Allow-Headers, Accept, Access-Control-Allow-Methods, Access-Control-Allow-Origin, Access-Control-Allow-Credentials
http.cors.allow-methods: OPTIONS, HEAD, GET, POST, PUT, DELETE

所以我补充说：Access-Control-Allow-Methods, Access-Control-Allow-Origin, Access-Control-Allow-Credentials.

感谢大家帮助我，我 post 这个答案可能会用于将来的目的。欢迎进一步指正。

cors: strict-origin-when-cross-origin: react + nginx + elasticsearch

cors: strict-origin-when-cross-origin: react + nginx + elasticsearch

nginx

elasticsearch

reactjs

referrer-policy