Receiving 401 status with Safari not Chrome in Rea

Question

The problem we are facing is the following: When using Safari as a browser, rather than Chrome, we receive a 401 status on a get api call. The technologies we are using are React and Django Rest Framework. In React we are also using axios. Again, all is fine when we use Chrome as our browser (no 401 error is given and authentication seems to be fine), but when we switch to Safari, it does not work. We should also note that when testing with Postman, if we store a token in our authentication header no 401 status is given (it works).

To try and solve this, we have tried different types of authentication classes in our Django backend, and ensured CORS was in our settings. We also ensured that we followed the react component lifecycle for proper mounting, and included the appropriate info necessary for each api call. We believe this to be a client side issue.

Please see the image below for a brief description of network requests / responses we see, and our api call.

Network Responses and api call

Answer 1

So it turns out the root of our problem was that we did not end one of our api urls with a forward slash, resulting in a 301 then a 304. Chrome was able to autocorrect without an issue, but Safari, IE, and firefox cannot.