502 Bad Gateway for Proxy Pass to HTTPS API server sitting behind Cloudflare Proxy

Question

My current configuration is as shown below. I have frontend delivered from EC2 instance on VM1. The HTTPS API server is on VM2 proxied by Cloudfare. If I call the API on VM2 directly from the web browser everything works fine. But if I use proxy_pass to communicate with API on VM2, it is throwing 502 bad gateway error.

HTTPS API server is sitting behind Cloudflare Proxy. My NGINX configuration is as follows.

location /mainPageApi {
        proxy_pass https://apiserver.com/mainPageApi;
        proxy_set_header Host $host;
        proxy_ssl_name $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto https;
        }

Inspecting the logs, I'm getting the following error:

[error] 7109#7109: *3 SSL_do_handshake() failed (SSL: error:14094410:SSL routines:ssl3_read_bytes:sslv3 alert handshake failure:SSL alert number 40) while SSL handshaking to upstream, client: <Client IP>, server: <VM1_Host_Name>, request: "POST /mainPageApi/v1/testAPI/ HTTP/1.1", upstream: "https://104.27.162.190:443/mainPageApi/v1/testAPI/", host: "<VM1_Host_Name>", referrer: "<VM1_Host_Name>"

7109#7109: *3 connect() to [IPV6_Address]:443 failed (101: Network is unreachable) while connecting to upstream, client: <Client IP>, server: <VM1_Host_Name>, request: "POST /mainPageApi/v1/testAPI/ HTTP/1.1", upstream: "https://[IPV6_Address]:443/mainPageApi/v1/testAPI/", host: <VM1_Host_Name>, referrer: <VM1_Host_Name>

What is the proper config to send and receive data to HTTPS API server that's on a different server?

Update 1:

location /mainPageApi/ {
        proxy_pass https://apiserver.com/mainPageApi/;
        proxy_ssl_protocols TLSv1.2;
        proxy_ssl_server_name on;
        proxy_ssl_name apiserver.com;

        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_pass_header Authorization;

        }

With the above configuration, I am getting 403 Forbidden error from Cloduflare.

Answer 1

This is what I ended up with:

proxy_set_header X-Forwarded-Proto $scheme; #<-- Putting this outside location


location ^~ /mainPageApi/ {
    proxy_ssl_server_name on;
    proxy_set_header X-Real-IP  $remote_addr;
    proxy_set_header Host-Real-IP  $http_host;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Real-Pcol HTTP;
    proxy_intercept_errors on;
    proxy_set_header Host https://myapiserver.com;
    proxy_pass https://myapiserver.com:443;
}

Answer 2

Try this:

proxy_ssl_server_name on;

location /mainPageApi/ {
    proxy_set_header Host "apiserver.com";
    proxy_set_header X-Real-IP $remote_addr;
    proxy_pass https://apiserver.com/mainPageApi/;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}

Answer 3

Thank you very much for the answer. I had the same issue with Angular app in Docker and this nginx.conf worked for me:

location /api/ {
proxy_set_header X-Forwarded-Proto $scheme;
proxy_ssl_server_name on;
proxy_set_header X-Real-IP  $remote_addr;
proxy_set_header Host-Real-IP  $http_host;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Real-Pcol HTTP;
proxy_intercept_errors on;
proxy_pass https://myapiserver.com/;}