[update] - add token exprire

README.md

@@ -25,3 +25,4 @@ Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To u
 ## Further help
 
 To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
+git push --mirror https://gitea.71dev.com/Phet/mirror-cathay.git

package-lock.json

@@ -18,6 +18,7 @@
         "@angular/platform-browser": "^15.2.0",
         "@angular/platform-browser-dynamic": "^15.2.0",
         "@angular/router": "^15.2.0",
+        "@auth0/angular-jwt": "^5.2.0",
         "@ng-select/ng-select": "^10.0.3",
         "bootstrap-icons": "^1.10.3",
         "date-fns": "^2.29.3",
@@ -729,6 +730,17 @@
       "integrity": "sha512-H71nDOOL8Y7kWRLqf6Sums+01Q5msqBW2KhDUTemh1tvY04eSkSXrK0uj/4mmY0Xr16/3zyZmsrxN7CKuRbNRg==",
       "dev": true
     },
+    "node_modules/@auth0/angular-jwt": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/@auth0/angular-jwt/-/angular-jwt-5.2.0.tgz",
+      "integrity": "sha512-9FS2L0QwGNlxA/zgeehCcsR9CZscouyXkoIj1fODM36A8BLfdzg9k9DWAXUQ2Drjk0AypGAFzeNZR4vsLMhdeQ==",
+      "dependencies": {
+        "tslib": "^2.0.0"
+      },
+      "peerDependencies": {
+        "@angular/common": ">=14.0.0"
+      }
+    },
     "node_modules/@babel/code-frame": {
       "version": "7.18.6",
       "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.18.6.tgz",
@@ -13155,6 +13167,14 @@
       "integrity": "sha512-H71nDOOL8Y7kWRLqf6Sums+01Q5msqBW2KhDUTemh1tvY04eSkSXrK0uj/4mmY0Xr16/3zyZmsrxN7CKuRbNRg==",
       "dev": true
     },
+    "@auth0/angular-jwt": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/@auth0/angular-jwt/-/angular-jwt-5.2.0.tgz",
+      "integrity": "sha512-9FS2L0QwGNlxA/zgeehCcsR9CZscouyXkoIj1fODM36A8BLfdzg9k9DWAXUQ2Drjk0AypGAFzeNZR4vsLMhdeQ==",
+      "requires": {
+        "tslib": "^2.0.0"
+      }
+    },
     "@babel/code-frame": {
       "version": "7.18.6",
       "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.18.6.tgz",

package.json

@@ -20,6 +20,7 @@
     "@angular/platform-browser": "^15.2.0",
     "@angular/platform-browser-dynamic": "^15.2.0",
     "@angular/router": "^15.2.0",
+    "@auth0/angular-jwt": "^5.2.0",
     "@ng-select/ng-select": "^10.0.3",
     "bootstrap-icons": "^1.10.3",
     "date-fns": "^2.29.3",

src/app/app.guard.ts

@@ -17,13 +17,13 @@ export class AppGuard implements CanActivate, CanActivateChild {
   }
 
   isLogin() {
+    const user = this.app.auth();
+    if (!user) {
+      this.router.navigate(['/auth/login'], { replaceUrl: true });
+      localStorage.clear()
+      return false;
+    }
     return true;
-        // const user = this.app.auth();
-        // if (!user) {
-        //     this.router.navigate(['/auth/login']);
-        //     return false;
-        // }
-        // return true;
   }
 }
 

src/app/app.module.ts

@@ -1,14 +1,15 @@
-import {NgModule} from '@angular/core';
+import { NgModule } from '@angular/core';
-import {BrowserModule} from '@angular/platform-browser';
+import { BrowserModule } from '@angular/platform-browser';
-import {AppRoutingComponents, AppRoutingModule} from './app-routing.module';
+import { AppRoutingComponents, AppRoutingModule } from './app-routing.module';
-import {AppComponent} from './app.component';
+import { AppComponent } from './app.component';
 import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
-import {FormsModule, ReactiveFormsModule} from "@angular/forms";
+import { FormsModule, ReactiveFormsModule } from "@angular/forms";
-import {HTTP_INTERCEPTORS, HttpClientModule} from "@angular/common/http";
+import { HTTP_INTERCEPTORS, HttpClientModule } from "@angular/common/http";
-import {AppService} from "./app.service";
+import { AppService } from "./app.service";
-import {AppGuard} from "./app.guard";
+import { AppGuard } from "./app.guard";
-import {AppRequestInterceptor} from "./app.request.interceptor";
+import { AppRequestInterceptor } from "./app.request.interceptor";
-import {AppSharedModule} from "./app.shared";
+import { AppSharedModule } from "./app.shared";
+import { JwtModule } from '@auth0/angular-jwt';
 
 
 @NgModule({
@@ -24,7 +25,8 @@ import {AppSharedModule} from "./app.shared";
     FormsModule,
     ReactiveFormsModule,
     HttpClientModule,
-    AppSharedModule
+    AppSharedModule,
+    JwtModule
   ],
   providers: [
     AppService,

src/app/app.request.interceptor.ts

@@ -1,23 +1,40 @@
 import { Injectable } from '@angular/core';
-import { HttpErrorResponse, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
+import { HttpContextToken, HttpErrorResponse, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
 import { Router } from '@angular/router';
 import { AppService } from './app.service';
 import { catchError, Observable, throwError } from 'rxjs';
 import { environment } from 'src/environments/environment';
 import { SathonCathayPayService } from './sathon-cathay-pay.service';
-
+import { JwtHelperService } from '@auth0/angular-jwt';
+export const SKIP_INTERCEP = new HttpContextToken<boolean>(() => false);
 
 @Injectable()
 export class AppRequestInterceptor implements HttpInterceptor {
   constructor(
     private router: Router,
     private appService: AppService,
-    private sathonSV: SathonCathayPayService
+    // private sathonSV: SathonCathayPayService
-  ) {
+  ) { }
 
-  }
   intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
+
+    if (request.context.get(SKIP_INTERCEP)) {
+      return next.handle(request)
+    }
+
     const token = this.appService.token();
+    const appsathonAPpToken = this.appService.getsathonToken()
+
+
+    const helper = new JwtHelperService();
+    const isAppTokenExpired = helper.isTokenExpired(token);
+    const isSathonAppTokenExpired = helper.isTokenExpired(appsathonAPpToken)
+
+    if (isAppTokenExpired || isSathonAppTokenExpired) {
+      this.router.navigate(['/auth'], { replaceUrl: true });
+      localStorage.clear()
+      return
+    }
 
     if (token) {
       request = request.clone({
@@ -29,7 +46,7 @@ export class AppRequestInterceptor implements HttpInterceptor {
       catchError((err) => {
         if (err instanceof HttpErrorResponse) {
           if (err.status === 401) {
-            this.router.navigate(['/auth']);
+            this.router.navigate(['/auth'], { replaceUrl: true });
           }
         }
         return throwError(err);

src/app/app.service.ts

@@ -4,8 +4,6 @@ import { DOCUMENT, Location } from '@angular/common';
 import { from, Observable } from 'rxjs';
 import Swal, { SweetAlertResult } from 'sweetalert2'
 import { EAction } from "./@config/app";
-
-
 @Injectable()
 export class AppService {
 

src/app/auth/login/login.component.ts

@@ -55,7 +55,7 @@ export class LoginComponent implements OnInit {
         isAdmin: isAdmin
       }
 
-      this.appService.setToken(cathayResult.token.token)
+      this.appService.setToken(cathayResult.token)
       this.appService.setSathonToken(sathonToken.token)
       this.appService.setAuth(cathayResult);
 

src/app/core/intercepter/token-intercepter.interceptor.ts

@@ -12,10 +12,7 @@ import { Router } from '@angular/router';
 @Injectable()
 export class TokenIntercepterInterceptor implements HttpInterceptor {
 
-    constructor(
+  constructor() { }
-        private router: Router,
-    ) {
-    }
 
   intercept(request: HttpRequest<unknown>, next: HttpHandler): Observable<HttpEvent<unknown>> {
     const customReq = request.clone({

src/app/core/service/auth/auth.service.ts

@@ -1,11 +1,12 @@
-import { HttpClient } from '@angular/common/http';
+import { HttpClient, HttpContext } from '@angular/common/http';
 import { Injectable } from '@angular/core';
+import { SKIP_INTERCEP } from 'src/app/app.request.interceptor';
 import { BaseService } from 'src/app/core/base/base-service';
 
 @Injectable({
   providedIn: 'root'
 })
-export class AuthService extends BaseService{
+export class AuthService extends BaseService {
 
   constructor(
     public http: HttpClient
@@ -13,7 +14,7 @@ export class AuthService extends BaseService{
     super('/common/user_login', http)
   }
 
-    login(payload : {'loginname': string , 'password' : string}){
+  login(payload: { 'loginname': string, 'password': string }) {
     return this.http.get(`${this.prefix}/common/user_login/login/${payload.loginname}/${payload.password}`)
   }
 

src/app/core/service/auth/cathay-auth.service.ts

@@ -1,5 +1,6 @@
-import { HttpClient } from '@angular/common/http';
+import { HttpClient, HttpContext, HttpContextToken } from '@angular/common/http';
 import { Injectable } from '@angular/core';
+import { SKIP_INTERCEP } from 'src/app/app.request.interceptor';
 import { BaseService } from 'src/app/core/base/base-service';
 import { environment } from 'src/environments/environment';
 
@@ -16,11 +17,11 @@ export class CathayAuthService extends BaseService {
   }
 
   login(payload: { 'mobileDeviceId': string, 'userName': string, 'password': string }) {
-    return this.http.post(`${this.fullUrl}/login`, payload)
+    return this.http.post(`${this.fullUrl}/login`, payload, { context: new HttpContext().set(SKIP_INTERCEP, true) })
   }
   // https://sathorn.cathay-pay.com/api/v3/User/login
 
   genToken() {
-    return this.http.get(`${environment.APIURL}/api/common/user_login/token`)
+    return this.http.get(`${environment.APIURL}/api/common/user_login/token`, { context: new HttpContext().set(SKIP_INTERCEP, true) })
   }
 }

src/app/pages/@layouts/layouts.component.ts

@@ -38,7 +38,7 @@ export class PagesLayoutsComponent implements OnInit {
     // console.log(this.auth)
     // console.log(this.auth.isAdmin)
     this.menus = this.menus.map(r => {
-      if (this.auth.isAdmin) {
+      if (this.auth?.isAdmin) {
         if (r.roles.includes(ROLE_ADMIN)) return {
           ...r,
           children: r.children.length ? r.children.filter(c => r.roles.includes(ROLE_ADMIN)) : []

src/environments/environment.development.ts

@@ -1,6 +1,7 @@
 export const environment = {
   production: false,
   hideForm: false,
+  // test mirror
   APIURL: 'https://cathaypay.71dev.com/cathaypay-api',
   CATHAYAPIURL: 'https://sathorn.cathay-pay.com/api'
 };

src/index.html

@@ -1,5 +1,6 @@
 <!doctype html>
 <html lang="en">
+
 <head>
   <meta charset="utf-8">
   <title>Cathaypay</title>
@@ -8,10 +9,13 @@
   <link rel="icon" type="image/x-icon" href="favicon.ico">
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-  <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@100;200;300;400;500&display=swap" rel="stylesheet">
+  <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@100;200;300;400;500&display=swap"
+    rel="stylesheet">
   <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
 </head>
+
 <body class="mat-typography">
   <app-root></app-root>
 </body>
+
 </html>

yarn.lock

@@ -280,6 +280,13 @@
   resolved "https://registry.npmjs.org/@assemblyscript/loader/-/loader-0.10.1.tgz"
   integrity sha512-H71nDOOL8Y7kWRLqf6Sums+01Q5msqBW2KhDUTemh1tvY04eSkSXrK0uj/4mmY0Xr16/3zyZmsrxN7CKuRbNRg==
 
+"@auth0/angular-jwt@^5.2.0":
+  version "5.2.0"
+  resolved "https://registry.npmjs.org/@auth0/angular-jwt/-/angular-jwt-5.2.0.tgz"
+  integrity sha512-9FS2L0QwGNlxA/zgeehCcsR9CZscouyXkoIj1fODM36A8BLfdzg9k9DWAXUQ2Drjk0AypGAFzeNZR4vsLMhdeQ==
+  dependencies:
+    tslib "^2.0.0"
+
 "@babel/code-frame@^7.0.0", "@babel/code-frame@^7.18.6":
   version "7.18.6"
   resolved "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.18.6.tgz"
@@ -6622,7 +6629,7 @@ tslib@^1.9.0:
   resolved "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz"
   integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
 
-tslib@^2.1.0, tslib@^2.3.0, tslib@^2.3.1, tslib@2.5.0:
+tslib@^2.0.0, tslib@^2.1.0, tslib@^2.3.0, tslib@^2.3.1, tslib@2.5.0:
   version "2.5.0"
   resolved "https://registry.npmjs.org/tslib/-/tslib-2.5.0.tgz"
   integrity sha512-336iVw3rtn2BUK7ORdIAHTyxHGRIHVReokCR3XjbckJMK7ms8FysBfhLR8IXnAgy7T0PTPNBWKiH514FOW/WSg==