AllAuth Headless Not Recognizing CSRF

[krizh-p]

I'm using django-ninja with allauth and allauth headless installed, however the CSRF token is not recognized, when my frontend (NextJS) calls Django with the following headers:

// console.log(headers)
{
  'Content-Type': 'application/json',       
  'X-CSRFToken': 'tkazGbEEm9P6rrvux26f12XiqII5DbcAWf79LpWLDOEzezxysxMk02nkNE1vejRZ'     
}

// Django console
Forbidden (CSRF cookie not set.): /_allauth/browser/v1/auth/signup
[01/Nov/2024 17:40:43] "POST /_allauth/browser/v1/auth/signup HTTP/1.1" 403 285

This is my unprotected API endpoint which my front-end calls to get the CSRF token:

@api.get("/get-csrf-token")
def get_csrf_token(request):
    csrf_token = get_token(request)
    response = {"detail": "CSRF token generated successfully"}
    response["csrftoken"] = csrf_token
    return response

The response is saved to cookies as such:

I'm not sure what is needed to make allauth recognize the CSRF token. I can also attach any other files as needed.

[iamunadike]

Hello @cdcarter @tomdee @quique @krizh-p @jezdez @pennersr @pacesm @jplehmann @PabloCastellano @tomdee @oalamoudi @quique @fabiocerqueira @facugaich @fdobrovolny @fengsi

Hello all, I face one more issue witht the django all auth

from allauth.account.adapter import DefaultAccountAdapter
from allauth.socialaccount.adapter import DefaultSocialAccountAdapter
from django.conf import settings
from authx.views import role_based_redirect


class SocialAccountAdapter(DefaultSocialAccountAdapter):
    def post_login(self,  *args, **kwargs):
        # remember to
        resp = super().post_login(*args, **kwargs)
        next_url = kwargs.get('redirect_url', '')
        import pdb
        pdb.set_trace()
        sociallogin = kwargs.get('signal_kwargs', {}).get('sociallogin')
        if sociallogin:
            return role_based_redirect(sociallogin.user, next_url)
        return resp

    def get_login_redirect_url(self, request):
        import pdb
        pdb.set_trace()
        next_url = request.GET.get('next', "")
        return '/me/posts/'
        # return role_based_redirect(request.user, next_url)


class GAccountAdapter(DefaultAccountAdapter):

    def post_login(self,  *args, **kwargs):
        resp = super().post_login(*args, **kwargs)
        next_url = kwargs.get('redirect_url', '')
        import pdb
        pdb.set_trace()
        sociallogin = kwargs.get('signal_kwargs', {}).get('sociallogin')
        if sociallogin:
            return role_based_redirect(sociallogin.user, next_url)
        return resp

    def get_login_redirect_url(self, request):
        # account
        import pdb
        pdb.set_trace()
        next_url = request.GET.get('next', "")
        return '/me/posts/' 

i am using social allauth, and return is_safe_url to true to handle all domains used in rediect_url howbeit, i dont know which function can get the type value . the url is this http://localhost:8000/auth/signin/?next=//shop.apps.local:8000/store/checkout&type=customer. So my question is getting the value of parameter, ie &type=something obvious from . Please HELP TO ANSWER THIS AND SAVE ME TIME . I need to know how to track the type=customer with django-allauth during a redirect , your help is deeply appreciated

[krizh-p]

Hey you should probably open a new discussion as this looks unrelated.

[krizh-p]

Closing this thread as the issue is not with allauth. In case anyone looks at this in the future, the problem was that Next.js does not send cookies with fetch() even if you explicitly say credentials: "include" in your code. Instead, you have to manually send cookies via a Cookie header, as such:

const response = await fetch("http://localhost:8000/_allauth/browser/v1/auth/signup", {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
      'X-CSRFToken': csrftoken as string, // Django might not read the X-CSRFToken header
      Cookie: cookies().toString(), // Use this instead to send Cookies with Nextjs
    },
    body: JSON.stringify({ username, email, password }),
    credentials: "include" // Next.js will ignore this
  });