302 Response Error

Question

I am making a GET request to my local webservice which I am expecting a 302 response to be returned with a location in the header. However, I get an undefined response back and a network error even though I can see locally that the request is being served and response is being created without any errors in the webservice.

I have tried in Postman and Chrome, and it receives the redirect response and redirects accordingly.

I'm not sure if this is a CORS problem and if so, how can I solve this?

I've already added in the response header for CORS filter

Access-Control-Expose-Headers: Location, [own headers]
Access-Control-Allow-Origin: '*'
Access-Control-Allow-Methods: POST, PUT, GET, OPTIONS, DELETE
Access-Control-Max-Age: [some age]
Access-Control-Allow-Headers: [own headers]

And the location is present in the header when I use Postman

The request I am making using Axios and the config is

const config = {
  url: [someURL],
  method: 'GET',
  headers: {
    'customHeader':'token',
  },
  params: {
    [params]
  },
  maxRedirects: 0,
  validateStatus: status => (status >= 200 && status < 300) || status === 302,
};

Any help would really be appreciated as to why the response is undefined when it reaches my JS code, but works fine in Postman and Chrome.

A way I could resolve this is to use HTTP status code 200 and get the location header to redirect, but I want to avoid this because it is technically a redirect response.

Answer 1

The 'customHeader':'token' part of your request triggers your browser to first send a CORS preflight OPTIONS request. Any headers you add to a request other than headers defined as CORS-safelisted request-headers trigger browsers to send a CORS preflight OPTIONS request.

The reason you don’t get this from Postman is that unlike browser engines, Postman doesn’t implement CORS, so it doesn’t send the OPTIONS request. (Postman does not operate under the same-origin Web-security model that browsers enforce for Web applications.)

If the server doesn’t respond in the right way to CORS preflight OPTIONS requests, your request will fail and the only workaround is to not add that 'customHeader':'token' part to your request, or otherwise construct your request in any way that triggers your browser to do CORS preflight.