RESTAPI直接与nginx代理

RESTAPI直接与nginx代理,nginx,cors,Nginx,Cors,我是nginx和CORS的新手,发现要做到这一点很有挑战性 我的rest服务托管在一个服务器上,该服务器阻止CORS,因此安装了nginx来代理rest调用。工作原理: 启用CORS后对后端服务器的rest api调用(从角度代码) RESTAPI调用(从chrome)到前端nginx服务器,该服务器启用cors 什么不起作用:RESTAPI调用(从angular代码)到前端nginx 我认为CORS部分可以工作,因为我不再看到那个错误了,但是angular得到了一个空响应 对于上述场景,我尝试

我是nginx和CORS的新手,发现要做到这一点很有挑战性

我的rest服务托管在一个服务器上,该服务器阻止CORS,因此安装了nginx来代理rest调用。工作原理:

  • 启用CORS后对后端服务器的rest api调用(从角度代码)
  • RESTAPI调用(从chrome)到前端nginx服务器,该服务器启用cors
  • 什么不起作用:RESTAPI调用(从angular代码)到前端nginx

    我认为CORS部分可以工作,因为我不再看到那个错误了,但是angular得到了一个空响应

    对于上述场景,我尝试使用GET和POST方法。即使对于失败的场景,响应代码也为200 OK

    以下是nginx配置:

    upstream myserver {
        server      myserver.com:8443;
    }
    
    server {
        listen       443 ssl;
        listen       [::]:443 ssl;
        server_name  myserver.com;
        ssl_certificate     /some.crt;
        ssl_certificate_key /some.key;
    
        location /rest-service/ {
            # Simple requests
            if ($request_method ~* "(GET|POST)") {
                add_header "Access-Control-Allow-Origin"  *;
            }
    
        # Preflighted requests
        if ($request_method = OPTIONS ) {
          add_header "Access-Control-Allow-Origin"  *;
          add_header "Access-Control-Allow-Methods" "GET, POST, OPTIONS, HEAD";
          add_header "Access-Control-Allow-Headers" "Authorization, Origin, X-Requested-With, Content-Type, Accept";
          return 200;
        }
    
            proxy_pass_header       Server;
            proxy_set_header        X-Real-IP $remote_addr;
            proxy_set_header        X-Scheme $scheme;
            proxy_set_header        X-NginX-Proxy true;
            proxy_connect_timeout   5;
            proxy_read_timeout      240;
            proxy_intercept_errors  on;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Host $http_host;
            proxy_redirect off;
            proxy_pass                      https://myserver/rest-service/;
            proxy_ssl_trusted_certificate   /some.pem;
            proxy_ssl_verify                off;
            proxy_ssl_session_reuse         on;
    
        }
    }
    
    以下是angular/typescript代码(从loaclhost运行):


    我想我找到了问题所在,并将其发布在这里;希望它能帮助别人

    以下工作:


    您尝试了哪个浏览器?您需要使用该浏览器编辑/更新问题并添加有关请求和响应的完整详细信息:您的前端代码向请求中添加了哪些标题?您收到的请求是否为选项请求的空响应?响应的HTTP状态代码是什么?浏览器在devtools控制台中记录的确切错误消息是什么?除了@sideshowbarker的评论外,请包括编写请求的javascript。感谢您的回复,我已经添加了所有这些详细信息。
      ngOnInit() {
        let url='https://myserver.com/rest-service/login?login=admin&password=password';
        this.http.get(this.url).subscribe((response) => {console.log(response); });
      }
    
        if ($request_method = 'OPTIONS') {
            add_header 'Access-Control-Allow-Origin' 'http://localhost:4200' always;
            add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS' always;
            add_header 'Access-Control-Allow-Headers' 'Origin,Keep-Alive,User-Agent,Cache-Control,Content-Type,Accept' always;
            add_header 'Access-Control-Max-Age' 1728000;
            add_header 'Content-Type' 'text/plain charset=UTF-8';
            add_header 'Content-Length' 0;
            return 204;
        }
        if ( $request_method = 'GET' ) {
            add_header 'Access-Control-Allow-Origin' 'http://localhost:4200' always;
            add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS' always;
            add_header 'Access-Control-Allow-Headers' 'Origin,Keep-Alive,User-Agent,Cache-Control,Content-Type,Accept' always;
            add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';
        }
        if ( $request_method = 'POST' ) {
            add_header 'Access-Control-Allow-Origin' 'http://localhost:4200' always;
            add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS' always;
            add_header 'Access-Control-Allow-Headers' 'Origin,Keep-Alive,User-Agent,Cache-Control,Content-Type,Accept' always;
            add_header 'Access-Control-Expose-Headers' 'Content-Length,Content-Range';
        }