Django + vuejs + Django rest framework and jwt - Part 2

Posted by Adarshreddy Adelli

Tuesday, August 4, 2020

In our previous post, we have successfully built our basic API using Django and DRF.  In this post, we will add authentication and make our API Production ready. Django-allauth saves our time in writing user models entirely from scratch. Many of you won't be liking this part because most of the apps use social or phone authentication, But my intention is to do things from the start. Django rest auth turns our allauth models into JSON serializable.

Let's Install these

pip install django-allauth==0.42.0 django-rest-auth==0.9.5

Create an app for Users

django-admin startapp users

Don't forget to add these apps to Installed Apps in api/Settings.py
Django-allauth uses the username as a mandatory and unique field, I would like to overwrite that with email by Extending BaseUserManager to our CustomUserManager. We also need some extra fields to the superuser.
Add this to the Managers.py file


Let's make email as a unique identifier by subclassing AbstractUser. Here go our models file for the user.

Now its time to serialize our models using rest framework.

Update api/urls.py file. You can also extend users urls to the api urls.

from django.conf.urls import url
from django.conf import settings
from allauth.account.views import confirm_email
 url(r'^rest-auth/', include('rest_auth.urls')),
 url(r'^rest-auth/registration/', include('rest_auth.registration.urls')),
 url(r'^account/', include('allauth.urls')),
 url(r'^accounts-rest/registration/account-confirm-email/(?P<key>.+)/$', confirm_email, name='account_confirm_email'),

If everything goes fine you can register an account and login.
navigate to http://127.0.0.1:8000/rest-auth/register/ to register
http://127.0.0.1:8000/rest-auth/login/ to login

http://127.0.0.1:8000/rest-auth/user/ to display user details

Well! Its time for jwt.  Django allauth provides session key for each user, you may ask why JWT then ?. Because the structure of jwt helps us to verify who is the sender by signing it. Jwt has two tokens access and refresh token. Their name itself says what they do. The access token is short-lived (5 min or so can be customised though). The refresh token is long-lived usually expires in 24 hrs can also be customized. You need to use login credentials to refresh token to refresh. 
Let's install jwt

pip install djangorestframework-jwt==1.11.0

after installing navigate to API and edit settings.py and add this

Now add these to api/urls.py

url(r'^api/v1/auth/obtain_token/', obtain_jwt_token),
url(r'^api/v1/auth/refresh_token/', refresh_jwt_token),

Navigate to http://127.0.0.1:8000/api/v1/auth/obtain_token/ to obtain the token.
Now uncomment the line permission_classes = (permissions.IsAuthenticated,)   in music views as we have discussed in the previous post, this allows only authenticated users to
access the music files.
Finally! we have successfully built our backend using Django, DRF, JWT.  In the next post, we will parse the api and play music files for authenticated users using vuejs. PART 3
You can access the entire backend which can be hosted on Heroku. Ronix-backend

Have a good day!

Adarshreddy Adelli Tuesday, August 4, 2020 Nodejs python web development