title: How to send CSRF Cookie from React to Django Rest Framework with Axios
body: <p>I want to make a <strong>POST</strong> request from a <strong>React</strong> app using <strong>Axios</strong> to a <strong>Django Rest Framework</strong> backend. I have managed to get a <strong>CSRF Token</strong> from the backend but I can't manage to send it with my request, so I always get a <code>Forbidden (CSRF cookie not set.)</code> error:</p>
  
  <p>This is the code of my <strong>React</strong> app:</p>
  
  <pre><code>handleClick() {
      const axios = require('axios');
      var csrfCookie = Cookies.get('XSRF-TOKEN');
      console.log(csrfCookie)
      axios.post('http://127.0.0.1:8000/es/api-auth/login/',
        {
          next: '/',
          username: 'admin@admin.com',
          password: 'Cancun10!',
        },
        {
          headers: {
            'x-xsrf-token': csrfCookie,  // &lt;------- Is this the right way to send the cookie?
          },
          withCredentials = true,
        }
      )
      .then(function (response) {
        console.log(response);
      })
      .catch(function (error) {
        console.log(error);
      })
    }
  </code></pre>
  
  <p>And this is my <code>settings.py</code> CSRF configuration:</p>
  
  <pre><code>CORS_ALLOW_CREDENTIALS = True
  CORS_ALLOW_HEADERS = (
      'xsrfheadername',
      'xsrfcookiename',
      'content-type',
      'XSRF-TOKEN',
  )
  
  CORS_ORIGIN_WHITELIST = serverconfig.CORS_ORIGIN_WHITELIST
  CSRF_TRUSTED_ORIGINS = serverconfig.CSRF_TRUSTED_ORIGINS
  CSRF_COOKIE_NAME = "XSRF-TOKEN"
  </code></pre>