当Access Control Allow Origin Header不存在时,NGINX CORS策略失败,但当Hea



这正是标题所说的,但针对上下文:

确实可以访问上游资源,并且我允许那里的所有来源。

当我的NGINX conf不包含指令add_header 'Access-Control-Allow-Origin' '*';时,我的浏览器告诉我:

访问'XMLHttpRequesthttp://localhost/{{upstream_path_redacted}}'来自原点'http://localhost:8080'已被CORS策略阻止:对飞行前的响应请求未通过访问控制检查:没有"access control Allow Origin"标头存在于请求的资源上。

当我包含上述指令时,我的浏览器告诉我

访问'XMLHttpRequesthttp://localhost/{{upstream_path_redacted}}"来自原点"http://localhost:8080"已被CORS策略阻止:"Access Control Allow Origin"标头包含多个值"http://localhost:8080,*',但只允许使用一个。

第二个问题是有道理的。正如我所说,我正在允许上游服务器上的所有来源。因此,我不明白为什么删除指令会导致第一个问题。

我的nginx.conf:

events {}
http {

upstream my-upstream-service {
server my-upstream-service:5000;
}
server {
listen 80 default_server;
location / {
# this works fine. just included as base case.
return 200 'ok';
add_header Content-Type text/plain;
add_header 'Access-Control-Allow-Origin' '*';
}
location /upstream {
# removing the next uncommented line results in 'missing header' issue.
# keeping it results in 'multiple header' issue.
add_header 'Access-Control-Allow-Origin' '*';
proxy_pass http://my-upstream-service;
}
}
}

更让我困惑的是:在查看my-upstream-servernginx日志后,向上游服务器成功发出了请求???

我所有的挖掘都给我带来了解决上述任何一个问题的解决方案,但不是当两者都发生时该怎么办。我被难住了。

如有必要,进一步说明:我正在使用docker-compose来部署这些服务(股份有限公司前端,这是一个Vue SPA(。

my-upstream-service是一个Flask网络服务器,使用Flask-Cors。

这是docker-compose.yml

---
version: '3.8'
networks:
gateway-service:
driver: bridge

services:
my-upstream-service:
build:
context: path/to/context/
dockerfile: path/to/dockerfile
ports:
- "5000:5000"
expose:
- "5000"
networks:
- gateway-service
frontend:
build:
context: /path/to/context
dockerfile: /path/to/dockerfile
ports:
- "8080:8080"
expose:
- "8080"
depends_on:
- gateway
networks:
- gateway-service
gateway:
image: nginx:1.19.8-alpine
volumes:
# this is where my nginx.conf lives.
- ./nginx/:/etc/nginx/
ports:
- "80:80"
environment:
- NGINX_PORT=80
depends_on:
- my-upstream-service
networks:
- gateway-service

我不知道为什么在没有任何关于我的问题的反馈的情况下被否决,也不知道为什么我被否决。

不管怎样,经过几个小时的键盘敲击,我有了一些工作要做。

从本质上讲,还为NGINX反向代理背后的Vue应用程序提供服务,虽然它产生了更多问题,但从长远来看解决了上述问题。

我不得不为我的Vue应用程序和NGINX conf添加额外的配置,以使Vue的所有开发功能都能完全工作。以下是最后一次NGINX会议的最低版本:

events {}
http {
upstream upstream-service {
server upstream-service:5000;
}
upstream front-end {
server front-end:8080;
}

server {
listen 80 default_server;
location / {
proxy_pass http://front-end;
proxy_set_header    Host                localhost;
proxy_set_header    X-Real-IP           $remote_addr;
proxy_set_header    X-Forwarded-Host    localhost;
proxy_set_header    X-Forwarded-Server  localhost;
proxy_set_header    X-Forwarded-Proto   $scheme;
proxy_set_header    X-Forwarded-For     $remote_addr;
proxy_redirect off;
proxy_connect_timeout 90s;
proxy_read_timeout 90s;
proxy_send_timeout 90s;
}
location /sockjs-node {
proxy_set_header X-Real-IP  $remote_addr;
proxy_set_header X-Forwarded-For $remote_addr;
proxy_set_header Host $host;
proxy_pass http://front-end; 
proxy_redirect off;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
}
location /upstream {
proxy_pass http://upstream-service;
}
}
}

我还必须添加到我的vue.config.js:

module.exports = {
devServer: {
disableHostCheck: true
}
}

相关内容

  • 没有找到相关文章