oauth working, but cycling sometimes

packages/web/src/App.svelte

@@ -20,38 +20,11 @@
   import getElectron from './utility/getElectron';
   import AppStartInfo from './widgets/AppStartInfo.svelte';
   import SettingsListener from './utility/SettingsListener.svelte';
+  import { handleAuthOnStartup } from './clientAuth';
 
   let loadedApi = false;
   let loadedPlugins = false;
 
-  async function handleAuth(config) {
-    if (config.oauth) {
-      const params = new URLSearchParams(location.search);
-      const sentCode = params.get('code');
-      const sentState = params.get('state');
-      if (
-        sentCode &&
-        sentState &&
-        sentState.startsWith('dbg-oauth:') &&
-        sentState == sessionStorage.getItem('oauthState')
-      ) {
-        const accessToken = await apiCall('auth/oauth-token', {
-          code: sentCode,
-          redirectUri: location.origin,
-        });
-        console.log('TOKEN', accessToken);
-      } else {
-        const state = `dbg-oauth:${Math.random().toString().substr(2)}`;
-        sessionStorage.setItem('oauthState', state);
-        location.replace(
-          `${config.oauth}/auth?client_id=dbgate&response_type=code&redirect_uri=${encodeURIComponent(
-            location.origin
-          )}&state=${encodeURIComponent(state)}`
-        );
-      }
-    }
-  }
-
   async function loadApi() {
     // if (shouldWaitForElectronInitialize()) {
     //   setTimeout(loadApi, 100);
@@ -61,10 +34,11 @@
     try {
       // console.log('************** LOADING API');
 
+      const config = await getConfig();
+      await handleAuthOnStartup(config);
+
       const connections = await apiCall('connections/list');
       const settings = await getSettings();
-      const config = await getConfig();
-      handleAuth(config);
       const apps = await getUsedApps();
       loadedApi = settings && connections && config && apps;
 

packages/web/src/clientAuth.ts

@@ -0,0 +1,46 @@
+import { apiCall } from './utility/api';
+import { getConfig } from './utility/metadataLoaders';
+
+export async function handleAuthOnStartup(config) {
+  console.log('********************* handleAuthOnStartup');
+  if (config.oauth) {
+    const params = new URLSearchParams(location.search);
+    const sentCode = params.get('code');
+    const sentState = params.get('state');
+
+    if (
+      sentCode &&
+      sentState &&
+      sentState.startsWith('dbg-oauth:') &&
+      sentState == sessionStorage.getItem('oauthState')
+    ) {
+      const authResp = await apiCall('auth/oauth-token', {
+        code: sentCode,
+        redirectUri: location.origin,
+      });
+      const { accessToken } = authResp;
+      console.log('Got new access token:', accessToken);
+      localStorage.setItem('accessToken', accessToken);
+      location.replace('/');
+    } else {
+      if (localStorage.getItem('accessToken')) {
+        return;
+      }
+
+      redirectToLogin(config);
+    }
+  }
+}
+
+export async function redirectToLogin(config = null) {
+  if (!config) config = await getConfig();
+
+  const state = `dbg-oauth:${Math.random().toString().substr(2)}`;
+  sessionStorage.setItem('oauthState', state);
+  console.log('Redirecting to OAUTH provider');
+  location.replace(
+    `${config.oauth}?client_id=dbgate&response_type=code&redirect_uri=${encodeURIComponent(
+      location.origin
+    )}&state=${encodeURIComponent(state)}`
+  );
+}

packages/web/src/main.ts

@@ -4,22 +4,6 @@ import './utility/changeCurrentDbByTab';
 import './commands/stdCommands';
 import localStorageGarbageCollector from './utility/localStorageGarbageCollector';
 
-const params = new URLSearchParams(location.search);
-console.log('CODE', params.get('code'));
-// console.log(
-//   `http://auth.metrostav.vychozi.cz/auth/realms/metrostav/protocol/openid-connect/auth?client_id=dbgate&response_type=code&redirect_uri=${encodeURIComponent(
-//     'http://localhost:5001/oauth-redirect'
-//   )}&state=1234`
-// );
-
-console.log(location);
-
-// location.replace(
-//   `http://auth.metrostav.vychozi.cz/auth/realms/metrostav/protocol/openid-connect/auth?client_id=dbgate&response_type=code&redirect_uri=${encodeURIComponent(
-//     'http://localhost:5001/'
-//   )}&state=1234`
-// );
-
 localStorageGarbageCollector();
 
 const app = new App({

packages/web/src/utility/api.ts

@@ -4,10 +4,16 @@ import { writable } from 'svelte/store';
 import getElectron from './getElectron';
 // import socket from './socket';
 import { showSnackbarError } from '../utility/snackbar';
+import { redirectToLogin } from '../clientAuth';
 
 let eventSource;
 let apiLogging = false;
 // let cacheCleanerRegistered;
+// let apiDisabled = false;
+
+// export function disableApi() {
+//   apiDisabled = true;
+// }
 
 function wantEventSource() {
   if (!eventSource) {
@@ -17,9 +23,9 @@ function wantEventSource() {
 }
 
 function processApiResponse(route, args, resp) {
-  if (apiLogging) {
-    console.log('<<< API RESPONSE', route, args, resp);
-  }
+  // if (apiLogging) {
+  //   console.log('<<< API RESPONSE', route, args, resp);
+  // }
 
   if (resp?.apiErrorMessage) {
     showSnackbarError('API error:' + resp?.apiErrorMessage);
@@ -35,6 +41,10 @@ export async function apiCall(route: string, args: {} = undefined) {
   if (apiLogging) {
     console.log('>>> API CALL', route, args);
   }
+  if (apiDisabled) {
+    console.log('Error, API disabled!!');
+    return null;
+  }
 
   const electron = getElectron();
   if (electron) {
@@ -51,6 +61,11 @@ export async function apiCall(route: string, args: {} = undefined) {
       body: JSON.stringify(args),
     });
 
+    if (resp.status == 401) {
+      // unauthorized
+      redirectToLogin();
+    }
+
     const json = await resp.json();
     return processApiResponse(route, args, json);
   }

packages/web/src/utility/resolveApi.ts

@@ -15,5 +15,10 @@ export default function resolveApi() {
 export function resolveApiHeaders() {
   const electron = getElectron();
 
-  return {};
+  const res = {};
+  const accessToken = localStorage.getItem('accessToken');
+  if (accessToken) {
+    res['Authorization'] = `Bearer ${accessToken}`;
+  }
+  return res;
 }