From 2d0a885d65ba3512894618cc6feb81edc5d81bb4 Mon Sep 17 00:00:00 2001
From: Sivan Duijn <sivanduijn@gmail.com>
Date: Fri, 11 Feb 2022 13:10:00 +0100
Subject: [PATCH] fix(authorization): fixing eventlistenere error messages
---
apps/web-graphpolaris/src/app/app.tsx | 15 ++++++++++-----
.../src/components/login/loginScreen.tsx | 15 ++++++++++-----
.../src/components/login/popup.tsx | 6 +++++-
.../authorization/src/lib/authorizationHandler.ts | 10 +---------
4 files changed, 26 insertions(+), 20 deletions(-)
diff --git a/apps/web-graphpolaris/src/app/app.tsx b/apps/web-graphpolaris/src/app/app.tsx
index 9528eddb4..e94971f9d 100644
--- a/apps/web-graphpolaris/src/app/app.tsx
+++ b/apps/web-graphpolaris/src/app/app.tsx
@@ -12,10 +12,8 @@ import SemanticSubstrates from '../components/visualisations/semanticsubstrates/
import LoginScreen from '../components/login/loginScreen';
import { OurThemeProvider } from '@graphpolaris/shared/data-access/theme';
-export function App() {
- const dispatch = useAppDispatch();
-
- const [userAuthorized, setUserAuthorized] = useState<boolean>(false);
+function useIsAuthorized() {
+ const [userAuthorized, setUserAuthorized] = useState(false);
const authCallback = () => {
setUserAuthorized(true);
@@ -33,9 +31,16 @@ export function App() {
authorize();
}, []);
+ return userAuthorized;
+}
+
+export function App() {
+ const dispatch = useAppDispatch();
+ const userIsAuthorized = useIsAuthorized();
+
return (
<OurThemeProvider>
- {!userAuthorized && <LoginScreen />}
+ {!userIsAuthorized && <LoginScreen />}
<GridLayout
className="layout"
cols={10}
diff --git a/apps/web-graphpolaris/src/components/login/loginScreen.tsx b/apps/web-graphpolaris/src/components/login/loginScreen.tsx
index e5d4f467b..93339edaa 100644
--- a/apps/web-graphpolaris/src/components/login/loginScreen.tsx
+++ b/apps/web-graphpolaris/src/components/login/loginScreen.tsx
@@ -66,7 +66,7 @@ const Content = styled.div`
const LoginScreen = () => {
const openSignInWindow = (url: string) => {
// remove any existing event listeners
- window.removeEventListener('message', receiveMessage);
+ window.removeEventListener('auth_message', receiveMessage);
// window features
const strWindowFeatures =
@@ -75,18 +75,23 @@ const LoginScreen = () => {
window.open(url, 'Google Oauth', strWindowFeatures);
// add the listener for receiving a message from the popup
- window.addEventListener('message', (event) => receiveMessage(event), false);
+ window.addEventListener(
+ 'auth_message',
+ (event) => receiveMessage(event),
+ false
+ );
};
- const receiveMessage = (event: MessageEvent) => {
+ const receiveMessage = (event: any) => {
// Do we trust the sender of this message? (might be
// different from what we originally opened)
- if (!event.isTrusted) {
+ if (window.location.hostname !== event.detail.origin) {
return;
}
+ console.log(window.location.hostname, event.detail.origin);
// Set access token
- AuthorizationHandler.instance().SetAccessToken(event.data);
+ AuthorizationHandler.instance().SetAccessToken(event.detail.token);
};
return (
diff --git a/apps/web-graphpolaris/src/components/login/popup.tsx b/apps/web-graphpolaris/src/components/login/popup.tsx
index d895b7cfd..3218e6bad 100644
--- a/apps/web-graphpolaris/src/components/login/popup.tsx
+++ b/apps/web-graphpolaris/src/components/login/popup.tsx
@@ -5,7 +5,11 @@ const LoginPopupComponent = () => {
const accessToken = urlParams.get('access_token');
// Send the access token to the parent window
- window.opener.postMessage(accessToken, '*');
+ let c_event = new CustomEvent('auth_message', {
+ detail: { token: accessToken, origin: window.location.hostname },
+ });
+ window.opener.dispatchEvent(c_event);
+ // window.opener.postMessage(accessToken, '*');
// Close this window
window.close();
diff --git a/libs/shared/data-access/authorization/src/lib/authorizationHandler.ts b/libs/shared/data-access/authorization/src/lib/authorizationHandler.ts
index 32adafab7..f3e4319a9 100644
--- a/libs/shared/data-access/authorization/src/lib/authorizationHandler.ts
+++ b/libs/shared/data-access/authorization/src/lib/authorizationHandler.ts
@@ -36,17 +36,9 @@ export class AuthorizationHandler {
// If the request was a success, we have an accessToken, userID and sessionID
if (authResponse.success) {
// Store them
- this.accessToken = authResponse.accessToken ?? '';
this.userID = authResponse.userID ?? '';
this.sessionID = authResponse.sessionID ?? '';
-
- // Init refresh token
- this.initialiseRefreshToken();
-
- // Start the automatic refreshing every 10 minutes
- setInterval(() => {
- this.refreshTokens();
- }, 10 * 60 * 1000);
+ this.SetAccessToken(authResponse.accessToken ?? '');
}
return new Promise((resolve) => {
--
GitLab