React-Django csrf token Authentication

I'm really stuck here, and I've tried everything I've seen online. I followed this guide to perform react-Django csrf token Authentication.

when I send a request to csrf cookie it looks like everything works in the backend (django) side:

[05/Oct/2022 22:21:59] "GET /accounts/csrf_cookie HTTP/1.1" 200 29

@method_decorator(ensure_csrf_cookie, name='dispatch')
class GetCSRFToken(APIView):
    permission_classes = (permissions.AllowAny, )
    def get(self, request, format=None):
        return Response({'success': 'CSRF cookie set'})

And same from the frontend (react) side:

1. {data: {…}, status: 200, statusText: 'OK', headers: {…}, config: {…}, …}

  1. config: {transitional: {…}, transformRequest: Array(1), transformResponse: Array(1), timeout: 0, adapter: ƒ, …}
  2. data: {success: 'CSRF cookie set'}
  3. headers: {content-length: '29', content-type: 'application/json'}
  4. request: XMLHttpRequest {onreadystatechange: null, readyState: 4, timeout: 0, withCredentials: false, upload: XMLHttpRequestUpload, …}
  5. status: 200
  6. statusText: "OK"
  7. [[Prototype]]: Object
  useEffect(() => {
    const fetchData = async () => {
      try {
        const res = await axios.get(
          `${process.env.REACT_APP_API_URL}/accounts/csrf_cookie`
        );
        console.log(res);
      } catch (err) {
        console.log(err);
      }
    };

    fetchData();
    setcsrftoken(getCookie("csrftoken"));
  }, []);

Again it seems as if the whole process was completed successfully, the problem is that in practice no cookie appears in my browser!

  • If I manually enter

http://127.0.0.1:8000//accounts/csrf_cookie

I do get the cookie for the browser...

I would appreciate any kind of help because I have already wasted too much time on this, thanks!

Back to Top