Accepted answer

Django uses X-CSRFTOKEN as the csrf header by default, see here. The option CSRF_COOKIE_NAME you use in your Django settings only changes the cookie name, which by default is csrftoken, see here.

To solve your issue, use this header in your axios call: headers: { 'X-CSRFTOKEN': csrfCookie }.

Use the following:'',
        next: '/',
        username: '',
        password: 'Cancun10!',
        headers: {
             'X-CSRFTOKEN': csrfCookie,

Also, remove XSRF-TOKEN from CORS_ALLOW_HEADERS in your Django settings, and add X-CSRFTOKEN to it instead. If you don't feel like removing XSRF-TOKEN, you can safely add X-CSRFTOKEN to CORS_ALLOW_HEADERS with the following, documentation here


from corsheaders.defaults import default_headers

CORS_ALLOW_HEADERS = list(default_headers) + [


Also, it's will be easier if you create an Axios instance

const instance = axios.create({
  baseURL: API_URL,
  withCredentials: true,
  xsrfHeaderName: 'X-CSRFToken',
  xsrfCookieName: 'csrftoken',

And make sure xsrfCookieName and CSRF_COOKIE_NAME have the same name. Note that if CSRF_COOKIE_HTTPONLY set to True, client-side JavaScript will not be able to access the CSRF cookie:


CSRF_COOKIE_NAME = "csrftoken"

CORS_EXPOSE_HEADERS = ["Content-Type", "X-CSRFToken"]

Related Query

More Query from same tag