diff --git a/SAS/TMSS/frontend/tmss_webapp/src/authenticate/auth.js b/SAS/TMSS/frontend/tmss_webapp/src/authenticate/auth.js
index 8648fb81067b770f0820edf02495faee8de1e96e..6d7706e030733c43244f69d33669d7a4f312afd7 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/authenticate/auth.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/authenticate/auth.js
@@ -12,18 +12,32 @@ const Auth = {
let user = localStorage.getItem("user");
if (user) {
user = JSON.parse(user);
- if (user.token) {
- axios.defaults.headers.common['Authorization'] = `Token ${user.token}`;
- const permissions = await AuthStore.getState();
- if(!permissions.userRolePermission.project) {
- await PermissionStackUtil.getPermissions(true);
+ return Auth.getUserPermission(user);
+ }else {
+ user = sessionStorage.getItem("user");
+ console.log('Keycloak:',user);
+ if (user) {
+ user = JSON.parse(user);
+ const res = await AuthService.keycloakAuthenticate();
+ if(res && res.is_authenticated){
+ localStorage.setItem("loginType", 'Keycloak');
+ return Auth.getUserPermission(user);
}
- return true;
- }
+ }
}
await PermissionStackUtil.getPermissions(false);
return false;
},
+ getUserPermission: async (user) => {
+ if (user.token) {
+ axios.defaults.headers.common['Authorization'] = `Token ${user.token}`;
+ const permissions = await AuthStore.getState();
+ if(!permissions.userRolePermission.project) {
+ await PermissionStackUtil.getPermissions(true);
+ }
+ return true;
+ }
+ },
/** Gets user details from browser local storage */
getUser: () => {
return JSON.parse(localStorage.getItem("user"));
@@ -32,7 +46,8 @@ const Auth = {
login: async(user, pass) => {
const authData = await AuthService.authenticate(user, pass);
if (authData) {
- localStorage.setItem("user", JSON.stringify({name:user, token: authData.token}));
+ localStorage.setItem("user", JSON.stringify({name:user, token: authData.token},));
+ localStorage.setItem("loginType", 'Application');
await PermissionStackUtil.getPermissions(true);
return true;
} else {
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/authenticate/login.js b/SAS/TMSS/frontend/tmss_webapp/src/authenticate/login.js
index 383fe9b68d1840a2badde6b390f5e1b2dc7bc3f5..9dfa5bb18aa4c0b00f72166cc578db4d1b4324bc 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/authenticate/login.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/authenticate/login.js
@@ -3,6 +3,7 @@ import React, {Component} from 'react';
import { Redirect } from 'react-router-dom';
import Auth from '../authenticate/auth';
import { CustomPageSpinner } from '../components/CustomPageSpinner';
+import UIConstants from '../utils/ui.constants';
/**
* Component to authenticate users in the application.
@@ -21,6 +22,7 @@ export class Login extends Component {
this.login = this.login.bind(this);
this.setCredentials = this.setCredentials.bind(this);
this.formSubmit = this.formSubmit.bind(this);
+ this.doKeyCloakLogin = this.doKeyCloakLogin.bind(this);
}
/**
@@ -71,6 +73,14 @@ export class Login extends Component {
}
}
+ async doKeyCloakLogin(e) {
+ /** For testing */
+ //sessionStorage.setItem("user", JSON.stringify({name:'test',"token":"eaa9a75f31339955cfaca1f7c94b01b1dd327d04"},));
+ /** End */
+
+ this.setState({redirect: UIConstants.KEYCLOAK_AUTH_URL});
+ }
+
render() {
if (this.state.redirect) {
return (<Redirect to={{pathname: this.state.redirect}} />);
@@ -120,10 +130,13 @@ export class Login extends Component {
</div>
<div className="row form-footer">
<div className="col-md-6 forget-paswd">
-
+ <button className="btn btn-primary"
+ onClick={this.doKeyCloakLogin}>Forget Password?</button>
</div>
<div className="col-md-6 button-div">
- <button className="btn btn-primary"
+ <button className="btn btn-primary"
+ onClick={this.doKeyCloakLogin}>Keycloak</button>
+ <button className="btn btn-primary" style={{marginLeft: '1em'}}
disabled={Object.keys(this.state.validFields).length<2}
onClick={this.login}>Login</button>
</div>
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/services/auth.service.js b/SAS/TMSS/frontend/tmss_webapp/src/services/auth.service.js
index 43c7afbbbb80fc29997a1158465e8dbe4d5d1e5a..1f8c1a34bf34995d643fe0b3ecab83460079b4a3 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/services/auth.service.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/services/auth.service.js
@@ -1,3 +1,5 @@
+import UIConstants from '../utils/ui.constants';
+
const axios = require('axios');
const AuthService = {
@@ -12,9 +14,29 @@ const AuthService = {
return null;
}
},
+ keycloakAuthenticate: async() => {
+ try {
+ delete axios.defaults.headers.common['Authorization'];
+ const response = await axios.post(UIConstants.KEYCLOAK_AUTHENTICATE_URL);
+ console.log('keycloakAuthenticate =>',response)
+ //axios.defaults.headers.common['Authorization'] = `Token ${response.data.token}`;
+ return response.data;
+ } catch(error) {
+ console.error('Error [keycloakAuthenticate]',error);
+ return null;
+ }
+ },
deAuthenticate: async(token) => {
try {
- await axios.delete("/api/token-deauth/");
+ const loginType = localStorage.getItem("loginType");
+ if (loginType && loginType === 'Application') {
+ await axios.delete("/api/token-deauth/");
+ } else {
+ console.log('deAuthenticate url:', UIConstants.KEYCLOAK_LOGOUT_URL);
+ await axios.post(UIConstants.KEYCLOAK_LOGOUT_URL);
+ sessionStorage.removeItem("user");
+ }
+ localStorage.removeItem("loginType");
} catch(error) {
console.error(error);
}
diff --git a/SAS/TMSS/frontend/tmss_webapp/src/utils/ui.constants.js b/SAS/TMSS/frontend/tmss_webapp/src/utils/ui.constants.js
index d89aadf99a448db85546f15d0ffec2b6ec8272b0..bda56702a072017cfd336c986562893ccd42ad75 100644
--- a/SAS/TMSS/frontend/tmss_webapp/src/utils/ui.constants.js
+++ b/SAS/TMSS/frontend/tmss_webapp/src/utils/ui.constants.js
@@ -1,4 +1,7 @@
const UIConstants = {
+ KEYCLOAK_AUTH_URL: '/oidc/authenticate',
+ KEYCLOAK_LOGOUT_URL: '/oidc/logout/',
+ KEYCLOAK_AUTHENTICATE_URL: '/api/authentication_state/',
tooltipOptions: {position: 'left', event: 'hover', className:"p-tooltip-custom"},
timeline: {
types: { NORMAL: "NORMAL", WEEKVIEW:"WEEKVIEW"}