title: Axios requests using authentication token sometimes fail in Safari
body: <p>I'm developing a react (16.9.0) single page app that uses axios (0.19.0). The axios requests use token authentication to access a server running django-rest-framework (3.6.4) and django-cors-headers (3.1.1). The authentication tokens are generated by django-rest-auth (0.9.5) during login.</p>
  
  <p>The app works reliably in Chrome and Firefox. In Safari, some of requests fail due to 401 errors.</p>
  
  <p>This requests succeeds in all three browsers:</p>
  
  <pre><code>INFO basehttp: "GET /apis/games/?slug=pop HTTP/1.1" 200 60932```
  </code></pre>
  
  <p>the code that generates it looks like:</p>
  
  <pre><code>    axios
        .get(`${simplUrl}/apis/games/?slug=${gameSlug}`, {
          headers: { Authorization: simplToken },
        })
        .then(res =&gt; {
          this.setState({
            game: res.data[0],
          });
        ...
  </code></pre>
  
  <p>This request failed with Safari:</p>
  
  <pre><code>INFO basehttp: "OPTIONS /apis/runs/43 HTTP/1.1" 200 0
  INFO basehttp: "DELETE /apis/runs/43 HTTP/1.1" 301 0
  INFO basehttp: "OPTIONS /apis/runs/43/ HTTP/1.1" 200 0
  WARNING basehttp: "DELETE /apis/runs/43/ HTTP/1.1" 401 58
  </code></pre>
  
  <p>but succeeded with Chrome:</p>
  
  <pre><code>INFO basehttp: "OPTIONS /apis/runs/43 HTTP/1.1" 200 0
  INFO basehttp: "DELETE /apis/runs/43 HTTP/1.1" 301 0
  INFO basehttp: "OPTIONS /apis/runs/43/ HTTP/1.1" 200 0
  INFO basehttp: "DELETE /apis/runs/43/ HTTP/1.1" 204 0
  </code></pre>
  
  <p>the code that generates it looks like:</p>
  
  <pre><code>      const url = `${simplUrl}/apis/runs/${run.id}`;
        // console.log('url:', url);
        axios
          .delete(url, {
            headers: { Authorization: simplToken },
          })
          .then(res =&gt; {
            // console.log(res);
            afterDelete();
          });
  </code></pre>
  
  <p>The Safari 401 response was:</p>
  
  <pre><code>"detail": "Authentication credentials were not provided."
  </code></pre>
  
  <p>This is the information Safari logged for the failed DELETE request:
  <a href="https://i.stack.imgur.com/FVf3K.png" rel="noreferrer"><img src="https://i.stack.imgur.com/FVf3K.png" alt="enter image description here"></a></p>
  
  <p>The DRF apis views use are based on this mixing:</p>
  
  <pre><code>class CommonViewSet(viewsets.ModelViewSet):
      authentication_classes = (TokenAuthentication, BasicAuthentication, SessionAuthentication)
      permission_classes = (IsAuthenticated,)
  </code></pre>
  
  <p>For local development, the DRF server's CORS settings are:</p>
  
  <pre><code>CORS_ORIGIN_ALLOW_ALL = True
  CORS_ALLOW_HEADERS = [
      'accept',
      'accept-encoding',
      'authorization',
      'content-type',
      'dnt',
      'origin',
      'user-agent',
      'x-csrftoken',
      'x-requested-with',
  ]
  </code></pre>
  
  <p>I don't understand why some requests fail in Safari while others do not. Mostly, I want to insure all requests work in all three browsers.</p>