title: Permission Denied 401 when sending axios request between localhosts (React and Django)
body: <p>I set up a Django backend and a React frontend. The Django app renders the index.html where the production ready JS created with react is found.</p>
  <p>But when developing locally, I develop the react frontend on my <code>localserver:3000</code>. Now I am trying to fetch data from my Django  backend, but I keep on getting a 401 Permission error. I know the problem is because the request comes from different hosts, but I don't know how to solve it.</p>
  <p>My backend API's use token authentication, but even if I send the bearer token in the headers, I still get the same error:</p>
  <p><a href="https://i.stack.imgur.com/cI8Ig.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/cI8Ig.png" alt="chrome dev tools response" /></a></p>
  <p>My code for the request is simple:</p>
  <pre><code>axios
      .get(`http://localhost:8000/path/to/data/`, {
          headers: {
              'Content-type': 'application/json',
              Accept: 'application/json',
              Authorization: `Bearer ${'here is my token'}`,
          },
      })
      .then((response) =&gt; {
          console.log(response);
      })
      .catch((error) =&gt; {
          console.log(error);
      });
  </code></pre>
  <p>When my react app makes this a production ready bundle and executes this on localhost:8000 there is no permission error, but I need to make it work from localhost:3000 because this is where I develop my app.</p>
  <p>Help is very much appreciated. Thanks in advance</p>
  <p>EDIT:</p>
  <p>My CORS:</p>
  <pre><code>CORS_ALLOWED_ORIGINS = [
      &quot;http://localhost:3000&quot;,
      &quot;http://localhost:8000&quot;,
      &quot;http://127.0.0.1:8000&quot;,
      &quot;http://127.0.0.1:3000&quot;,
  ]
  
  CORS_ALLOW_HEADERS = [
      'accept',
      'accept-encoding',
      'authorization',
      'content-type',
      'dnt',
      'origin',
      'user-agent',
      'x-csrftoken',
      'x-requested-with',
  ]
  
  </code></pre>