How do I get the JWT tokens from user in Django RestFramework

Question

I have a DRF project using Simple-JWT for authentication. When a user logs in, they get a response containing the access and refresh tokens in the serializer.data. However:

When testing on the Apis I can manually copy and paste these tokens and add them to headers when making requests. However in production,

Where are these tokens stored on the user's side?
How will the user be able to add the access token to requests that are protected? (they can't copy-paste like me)
How will they use the refresh token to renew the access token.

Shahriar Rahman Zahin · Accepted Answer · 2022-09-20T09:03:40.470

2

So, if you're talking about the client side, where users will be using your application using the front-end:

The tokens can be stored on local storage of your browser
All the authenticated URL requests must contain a bearer token where you will add the access_token which your API will return after authentication and is currently saved in your local storage.

for getting refresh token, add a URL like below where you will send a post request:

 from rest_framework_simplejwt.views import (
     TokenObtainPairView,
     TokenRefreshView,
     TokenVerifyView,
 )
 urlpatterns = [
 ...

     path(
         'token/refresh/',
         TokenRefreshView.as_view(),
         name='token_refresh',
     ),
 ...
 ]

Finally someone can use this code on JS side for saving or retrieving tokens from localstorage:

var testObject = { 'one': 1, 'two': 2, 'three': 3 };

// Put the object into storage
localStorage.setItem('testObject', JSON.stringify(testObject));

// Retrieve the object from storage
var retrievedObject = localStorage.getItem('testObject');

console.log('retrievedObject: ', JSON.parse(retrievedObject));

edited Sep 20 '22 at 09:03

answered Sep 18 '22 at 10:02

Shahriar Rahman Zahin

624
1
11
23

Do I have to write code for storing and getting the tokens from the local storage? – sajeyks mwangi Sep 18 '22 at 18:27
of course, there's js code for saving and retrieving that data. You can search for that on stackoverflow – Shahriar Rahman Zahin Sep 18 '22 at 19:16
I think that's what I am looking for in this question (hence the question title).. I could not find it on stackoverflow – sajeyks mwangi Sep 19 '22 at 06:24
2

I believe I have answered your posted question to some extent. If possible please don't forget to upvote to let people know whether it was useful or not. And for your final question that you have mentioned, you can find the process here: https://stackoverflow.com/questions/2010892/how-to-store-objects-in-html5-localstorage-sessionstorage – Shahriar Rahman Zahin Sep 19 '22 at 10:39
1

Yeah ..Now I can say all my questions are answered. Would you consider moving the final answer in the comments to your answer? Thank you! – sajeyks mwangi Sep 19 '22 at 18:15
Sure, please let me know which part would be helpful! Should I add the local storage data saving related code there? – Shahriar Rahman Zahin Sep 20 '22 at 05:01
1

Yes. The saving and retrieving code would be helpful – sajeyks mwangi Sep 20 '22 at 08:46
Got you, I'm adding that :) – Shahriar Rahman Zahin Sep 20 '22 at 08:59

How do I get the JWT tokens from user in Django RestFramework

1 Answers1