Token Authentication returning 403 (Axios + Django Rest Framework)

Question

I've been trying to fix this for a few hours now, please help me if you can.

When I try to make get requests w/ axios in my React app to my DRF Rest API it returns 403.

App.js:

      axios
        .get(API_POSTS, {
          headers: {
            Authorization: `Token 27dbb4dd8299792c8c52022f829da4ecec22f437`
          }
        })
        .then(res => {
          console.log("Success");
        })
        .catch(error => {
          console.log(error);
        });

settings.py:

INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
    'django.contrib.sites',
    # 3rd-party apps
    'rest_framework',
    'rest_framework.authtoken',
    'allauth',
    'allauth.account',
    'allauth.socialaccount',
    'rest_auth',
    'rest_auth.registration',
    'corsheaders',
    # Local
    'posts.apps.PostsConfig',
    'users.apps.UsersConfig',
]

CORS_ORIGIN_WHITELIST = [
    'http://localhost:3000',
]

# Rest Framework


REST_FRAMEWORK = {
    'DEFAULT_PERMISSION_CLASSES': [
        'rest_framework.permissions.IsAuthenticated',
    ],
    'DEFAULT_AUTHENTICATION_CLASSES': [
        'rest_framework.authentication.SessionAuthentication',
        'rest_framework.authentication.BasicAuthentication'
    ],
}

EMAIL_BACKEND = 'django.core.mail.backends.console.EmailBackend'
ACCOUNT_AUTHENTICATION_METHOD = 'email'
ACCOUNT_EMAIL_REQUIRED = True
ACCOUNT_USERNAME_REQUIRED = False

AUTHENTICATION_BACKENDS = (
    "django.contrib.auth.backends.ModelBackend",
    "allauth.account.auth_backends.AuthenticationBackend",
)

SITE_ID = 1

REST_AUTH_REGISTER_SERIALIZERS = {
    'REGISTER_SERIALIZER': 'users.serializers.CustomRegisterSerializer',
}

I have a posts endpoint that only authenticated users can see.

After logging in from within my React APP this token was generated. (using plain text for now because I'm testing)

So, when I try to make a get request with it, it returns the following error:

Error: Request failed with status code 403
    at createError (createError.js:17)
    at settle (settle.js:19)
    at XMLHttpRequest.handleLoad (xhr.js:60)

Why is this happening? Do I need to send any more information via the Header? I have read other questions and the documentation but can't find an answer.

Thank you.

Have you tried to check if your API works properly using something like postman ? — Muljayan
– Muljayan, Commented Sep 29, 2019 at 0:33
Hello. Yes I have, it works fine with both Postman and the built-in browsable API from the Django Rest Framework. Edit: It gives me 403 with Postman as well. — Diego Fortes
– Diego Fortes, Commented Sep 29, 2019 at 0:38
If the error comes on postman too its because the issue is with the API and not the react app. — Muljayan
– Muljayan, Commented Sep 29, 2019 at 0:43
Sorry I'm not familiar with Django hope you get an answer soon. — Muljayan
– Muljayan, Commented Sep 29, 2019 at 0:53

Diego Fortes · Accepted Answer · 2019-09-29 00:51:36Z

7

Ok, I managed to find out what was wrong. I had to allow TokenAuthentication in my app.

So what I did was:

settings.py

REST_FRAMEWORK = {
   'DEFAULT_AUTHENTICATION_CLASSES': (
   'rest_framework.authentication.TokenAuthentication',
   )
}

views.py

class PostList(generics.ListCreateAPIView):
    authentication_classes = (TokenAuthentication, )
    queryset = Post.objects.all()
    serializer_class = PostSerializer

After that it worked just fine.

Hope it helps everybody.

answered Sep 29, 2019 at 0:51

Diego Fortes

9,9514 gold badges36 silver badges48 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Token Authentication returning 403 (Axios + Django Rest Framework)

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related