CODEWITHSUNDEEP
springspring-bootnginx
Thom
Thom

Reputation: 15042

How to fix my cross-origin request blocked for spring boot

I am running my angular app through nginx against several spring boot services in the back. I am using nginx proxy_pass to strip the encryption and redirect the port to the one used by the service. This is my test server, so all of these are calling each other through localhost.

When I attempt to login, I'm getting the following error in my firefox console.

OPTIONShttp://localhost/location-api/location/login?payload={%22username%22:%22toddhehl%22,%22password%22:%22nunyons%22}
[HTTP/1.1 502 Bad Gateway 1ms]

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost/location-api/location/login?payload={%22username%22:%22toddhehl%22,%22password%22:%22nunyons%22}. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

Here is the section of my nginx configuration that is relevant.

    location /location-api/ {
        access_log /dev/stdout upstream_logging;
        set $upstream http://localhost:8093/;
        proxy_pass $upstream;
    }

And 8093 is where my spring boot application is running. At the top of my controller, I have:

@CrossOrigin(origins = "*", allowCredentials = "true")
@RestController(value = "/location")
public class LocationController {

I don't really understand what allowCredentials does, but I tried it to see if it would fix my problem.

Here's the entire transaction.

{
  "log": {
    "version": "1.2",
    "creator": {
      "name": "Firefox",
      "version": "82.0.3"
    },
    "browser": {
      "name": "Firefox",
      "version": "82.0.3"
    },
    "pages": [
      {
        "startedDateTime": "2020-11-16T16:37:36.363-05:00",
        "id": "page_1",
        "title": "PizzaCloudAdmin",
        "pageTimings": {
          "onContentLoad": -5572,
          "onLoad": -5301
        }
      }
    ],
    "entries": [
      {
        "pageref": "page_1",
        "startedDateTime": "2020-11-16T16:37:36.363-05:00",
        "request": {
          "bodySize": 0,
          "method": "OPTIONS",
          "url": "http://localhost/location-api/location/login?payload={%22username%22:%22toddhehl%22,%22password%22:%22nunyons%22}",
          "httpVersion": "HTTP/1.1",
          "headers": [
            {
              "name": "Host",
              "value": "localhost"
            },
            {
              "name": "User-Agent",
              "value": "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:82.0) Gecko/20100101 Firefox/82.0"
            },
            {
              "name": "Accept",
              "value": "*/*"
            },
            {
              "name": "Accept-Language",
              "value": "en-US,en;q=0.5"
            },
            {
              "name": "Accept-Encoding",
              "value": "gzip, deflate"
            },
            {
              "name": "Access-Control-Request-Method",
              "value": "POST"
            },
            {
              "name": "Access-Control-Request-Headers",
              "value": "access-control-allow-origin"
            },
            {
              "name": "Origin",
              "value": "https://essos"
            },
            {
              "name": "Connection",
              "value": "keep-alive"
            }
          ],
          "cookies": [],
          "queryString": [
            {
              "name": "payload",
              "value": "{\"username\":\"toddhehl\",\"password\":\"nunyons\"}"
            }
          ],
          "headersSize": 451
        },
        "response": {
          "status": 502,
          "statusText": "Bad Gateway",
          "httpVersion": "HTTP/1.1",
          "headers": [
            {
              "name": "Server",
              "value": "nginx/1.18.0 (Ubuntu)"
            },
            {
              "name": "Date",
              "value": "Mon, 16 Nov 2020 21:37:36 GMT"
            },
            {
              "name": "Content-Type",
              "value": "text/html"
            },
            {
              "name": "Content-Length",
              "value": "166"
            },
            {
              "name": "Connection",
              "value": "keep-alive"
            }
          ],
          "cookies": [],
          "content": {
            "mimeType": "text/html",
            "size": 0,
            "text": ""
          },
          "redirectURL": "",
          "headersSize": 166,
          "bodySize": 166
        },
        "cache": {},
        "timings": {
          "blocked": 0,
          "dns": 0,
          "connect": 0,
          "ssl": 0,
          "send": 0,
          "wait": 0,
          "receive": 0
        },
        "time": 0,
        "_securityState": "insecure",
        "serverIPAddress": "127.0.0.1",
        "connection": "80"
      },
      {
        "pageref": "page_1",
        "startedDateTime": "2020-11-16T16:37:36.369-05:00",
        "request": {
          "bodySize": 0,
          "method": "POST",
          "url": "http://localhost/location-api/location/login?payload={%22username%22:%22toddhehl%22,%22password%22:%22nunyons%22}",
          "httpVersion": "",
          "headers": [
            {
              "name": "Host",
              "value": "localhost"
            },
            {
              "name": "User-Agent",
              "value": "Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:82.0) Gecko/20100101 Firefox/82.0"
            },
            {
              "name": "Accept",
              "value": "application/json, text/plain, */*"
            },
            {
              "name": "Accept-Language",
              "value": "en-US,en;q=0.5"
            },
            {
              "name": "Accept-Encoding",
              "value": "gzip, deflate"
            },
            {
              "name": "access-control-allow-origin",
              "value": "*"
            },
            {
              "name": "Content-Type",
              "value": "text/plain"
            },
            {
              "name": "Content-Length",
              "value": "0"
            },
            {
              "name": "Origin",
              "value": "https://essos"
            },
            {
              "name": "Connection",
              "value": "keep-alive"
            }
          ],
          "cookies": [],
          "queryString": [
            {
              "name": "payload",
              "value": "{\"username\":\"toddhehl\",\"password\":\"nunyons\"}"
            }
          ],
          "headersSize": 0
        },
        "response": {
          "status": 0,
          "statusText": "",
          "httpVersion": "",
          "headers": [],
          "cookies": [],
          "content": {},
          "redirectURL": "",
          "bodySize": -1
        },
        "cache": {},
        "timings": {},
        "time": 0
      }
    ]
  }
}

I've done bunches of searches and have tried everything I've found and now I'm simply good and stuck and am looking for counsel. The thing I want the most, the URL that comes out of nginx, doesn't seem to be accessible.

Thanks for any ideas.

Upvotes: 0

Views: 1783

Answers (1)

Ivan Shatsky
Ivan Shatsky

Reputation: 15468

Can you try the following nginx configuration change?

    location /location-api/ {
        if ($request_method = OPTIONS) {
            add_header Access-Control-Allow-Origin '*';
            add_header Access-Control-Allow-Methods 'OPTIONS, HEAD, GET';
            add_header Content-Type text/plain;
            add_header Content-Length 0;
            return 204;
        }
        set $upstream http://localhost:8093;
        rewrite ^/location-api(.*) $1 break;
        access_log /dev/stdout upstream_logging;
        proxy_pass $upstream;
        add_header Access-Control-Allow-Origin '*';
        add_header Access-Control-Allow-Methods 'OPTIONS, HEAD, GET';
    }

If you also need to support the POST method, add it to the allowed methods list.

Upvotes: 1

Related Questions