JWT Token Authentication with Django Rest Framework - django

Question

I am having some issues with token authentication on my Django-Rest application with a react native frontend. I have always used Session Authentication, and this is my first time setting up a project with these requirements.
I pip installed -
djangorestframework_simplejwt
I know the tokens are being generated when I hit the endpoint api/token
I am able to retrieve them on the front end. My problem occurs when I try to hit a list route in the backend and the error I get back is as follows.
{
"detail": "Authentication credentials were not provided."
}
I thought this could be a cors issue, or an issue with my axios request, but I am fairly certain they are setup correctly. The other issue is the authentication and permissions classes in my viewset which is where my intuition is telling me this problem is coming from.
Relevant settings.py info --
MIDDLEWARE = [
'corsheaders.middleware.CorsMiddleware',
'django.middleware.security.SecurityMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'django.middleware.common.CommonMiddleware',
'django.middleware.csrf.CsrfViewMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
'django.middleware.clickjacking.XFrameOptionsMiddleware',
'social_django.middleware.SocialAuthExceptionMiddleware',
]
CORS_ORIGIN_ALLOW_ALL = True
CORS_ALLOW_METHODS = (
'DELETE',
'GET',
'OPTIONS',
'PATCH',
'POST',
'PUT',
)
CORS_ALLOW_HEADERS = (
'accept',
'accept-encoding',
'authorization',
'content-type',
'dnt',
'origin',
'user-agent',
'x-csrftoken',
'x-requested-with',
)
REST_FRAMEWORK = {
'DEFAULT_PERMISSION_CLASSES': (
'rest_framework.authentication.TokenAuthentication',
'rest_framework.permissions.IsAuthenticated',
),
'DEFAULT_AUTHENTICATION_CLASSES': (
'rest_framework_simplejwt.authentication.JWTAuthentication',
'rest_framework.authentication.SessionAuthentication',
)
}
Viewset/Serializer/Url
class WorkoutViewSet(ModelViewSet):
model = apps.get_model('backend', 'Workout')
queryset = model.objects.all()
serializer_class = serializers.WorkoutSerializer
authentication_classes = (authentication.TokenAuthentication,)
permission_classes = (permissions.IsAuthenticated,)
class WorkoutSerializer(serializers.ModelSerializer):
class Meta:
model = apps.get_model('backend', 'Workout')
fields = ('name', 'is_complete', 'allow_copy', 'workout_goal', 'user')
router.register(r'workouts', views.WorkoutViewSet, base_name='workouts')
Axios Request
export const workouts = (token) => {
return axios({
method: 'get',
url: 'http://localhost:8000/workouts',
headers: { 'authorization': `Bearer ${token}`}
})
}
Thanks for any help/direction.

Answer 1

in your viewset, you have specified authentication_classes where you set TokenAuthentication.
That means, for your WorkoutViewSet you specified to use only TokenAuthentication - which uses Token prefix in the header, hence you get 'Credentials not provided'
If you want to use the JWT token authentication - you should either set it explicitly here or remove it and let the default chosen classes handle the authentication