[SOLVED] Django Rest + Vuejs axion CSRF not working

Django Rest + Vuejs axion CSRF not working

I try using Django Rest Framework together with VueJS and axion.
But always I get the MSG:
CSRF Failed: CSRF token missing.

But my Header in the frontend looks correct. And in the developer tools the cockie is correct loading into the header.

{"Accept": "application/json, text/plain, /","Content-Type": "application/json","X-CSRFToken": "*******"}

my csrf settings in django settings.py

CSRF_COOKIE_NAME = "csrftoken"
CSRF_HEADER_NAME = 'X-CSRFTOKEN'
CSRF_TRUSTED_ORIGIN = ['http://.127.0.0.1', 'http://.localhost']
CSRF_COOKIE_HTTPONLY = False
CSRF_COOKIE_SECURE= False

I have no problems with the get requests. Only than it come to POST, PUT, DELETE.

Thank you for your advice.

With regards
Philipp Homberger

I try:

CSRF_TRUSTED_ORIGIN = ['http://*.127.0.0.1', 'http://localhost']

as well.

My Dev deployment build with 3 docker images. 1 Nginx as reversproxy to get both on the same port. 1 Container with Bakcend (Django) 1 Container with VueJs Frontend.

What were you expecting?

I expecting that I can do Post Requests as well without disable CSRF.

Than I use the swagger frontend of my restapi all work fine as well.

Solution

there was a cache problem in my Browser or so. So the HTTP Only Attribute was still set to true. Because of this my Java Script client could not use the Csrf toke.