这正是标题所说的,但针对上下文:
我确实可以访问上游资源,并且我允许那里的所有来源。
当我的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-server
和nginx
日志后,向上游服务器成功发出了请求???
我所有的挖掘都给我带来了解决上述任何一个问题的解决方案,但不是当两者都发生时该怎么办。我被难住了。
如有必要,进一步说明:我正在使用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
}
}