2-4 concluded

Author: Toruitas

djsr/authentication/urls.py

@@ -1,10 +1,11 @@
 from django.urls import path
 from rest_framework_simplejwt import views as jwt_views
-from .views import ObtainTokenPairWithColorView, CustomUserCreate, HelloWorldView
+from .views import ObtainTokenPairWithColorView, CustomUserCreate, HelloWorldView, LogoutAndBlacklistRefreshTokenForUserView
 
 urlpatterns = [
     path('user/create/', CustomUserCreate.as_view(), name="create_user"),
     path('token/obtain/', ObtainTokenPairWithColorView.as_view(), name='token_create'),
     path('token/refresh/', jwt_views.TokenRefreshView.as_view(), name='token_refresh'),
-    path('hello/', HelloWorldView.as_view(), name='hello_world')
+    path('hello/', HelloWorldView.as_view(), name='hello_world'),
+    path('blacklist/', LogoutAndBlacklistRefreshTokenForUserView.as_view(), name='blacklist')
 ]

djsr/authentication/views.py

@@ -2,6 +2,7 @@
 from rest_framework.response import Response
 from rest_framework_simplejwt.views import TokenObtainPairView
 from rest_framework.views import APIView
+from rest_framework_simplejwt.tokens import RefreshToken
 
 from .serializers import MyTokenObtainPairSerializer, CustomUserSerializer
 
@@ -28,3 +29,15 @@ class HelloWorldView(APIView):
 
     def get(self, request):
         return Response(data={"hello":"world"}, status=status.HTTP_200_OK)
+
+
+class LogoutAndBlacklistRefreshTokenForUserView(APIView):
+
+    def post(self, request):
+        try:
+            refresh_token = request.data["refresh_token"]
+            token = RefreshToken(refresh_token)
+            token.blacklist()
+            return Response(status=status.HTTP_205_RESET_CONTENT)
+        except Exception as e:
+            return Response(status=status.HTTP_400_BAD_REQUEST)

djsr/djsr/settings.py

@@ -39,6 +39,7 @@
     'django.contrib.sessions',
     'django.contrib.messages',
     'django.contrib.staticfiles',
+    'rest_framework_simplejwt.token_blacklist',
     'authentication',
     'rest_framework',
     'frontend'
@@ -141,7 +142,7 @@
     'ACCESS_TOKEN_LIFETIME': timedelta(minutes=5),
     'REFRESH_TOKEN_LIFETIME': timedelta(days=14),
     'ROTATE_REFRESH_TOKENS': True,
-    'BLACKLIST_AFTER_ROTATION': False,
+    'BLACKLIST_AFTER_ROTATION': True,
     'ALGORITHM': 'HS256',
     'SIGNING_KEY': SECRET_KEY,
     'VERIFYING_KEY': None,

djsr/frontend/src/axiosApi.js

@@ -6,7 +6,7 @@ const axiosInstance = axios.create({
     baseURL: 'http://127.0.0.1:8000/api/',
     timeout: 5000,
     headers: {
-        'Authorization': "JWT " + localStorage.getItem('access_token'),
+        'Authorization': localStorage.getItem('access_token') ? "JWT " + localStorage.getItem('access_token') : null,
         'Content-Type': 'application/json',
         'accept': 'application/json'
     }
@@ -17,7 +17,8 @@ axiosInstance.interceptors.response.use(
     error => {
       const originalRequest = error.config;
 
-      if (error.response.status === 401 && error.response.statusText === "Unauthorized") {
+      // test for token presence, no point in sending a request if token isn't present
+      if (localStorage.getItem('refresh_token') && error.response.status === 401 && error.response.statusText === "Unauthorized") {
           const refresh_token = localStorage.getItem('refresh_token');
 
           return axiosInstance

djsr/frontend/src/components/App.js

@@ -4,7 +4,31 @@ import Login from "./login";
 import Signup from "./signup";
 import Hello from "./hello";
 
+import axiosInstance from "../axiosApi";
+
+
 class App extends Component {
+
+    constructor() {
+        super();
+        this.handleLogout = this.handleLogout.bind(this);
+    }
+
+    async handleLogout() {
+        try {
+            const response = await axiosInstance.post('/blacklist/', {
+                "refresh_token": localStorage.getItem("refresh_token")
+            });
+            localStorage.removeItem('access_token');
+            localStorage.removeItem('refresh_token');
+            axiosInstance.defaults.headers['Authorization'] = null;
+            return response;
+        }
+        catch (e) {
+            console.log(e);
+        }
+    };
+
     render() {
         return (
             <div className="site">
@@ -13,6 +37,7 @@ class App extends Component {
                     <Link className={"nav-link"} to={"/login/"}>Login</Link>
                     <Link className={"nav-link"} to={"/signup/"}>Signup</Link>
                     <Link className={"nav-link"} to={"/hello/"}>Hello</Link>
+                    <button onClick={this.handleLogout}>Logout</button>
                 </nav>
                 <main>
                     <h1>Ahhh after 10,000 years I'm free. Time to conquer the Earth!</h1>

djsr/frontend/src/components/hello.js

@@ -20,8 +20,8 @@ class Hello extends Component {
             });
             return message;
         }catch(error){
-            console.log("Error: ", JSON.stringify(error, null, 4));
-            throw error;
+            console.log("Hello error: ", JSON.stringify(error, null, 4));
+            // throw error; todo
         }
     }