refactor: update Dropbox authentication handling with BroadcastChannel for improved token management (#1367)

Azgaar · web-flow · commit b7af737525a1 · 2026-03-26T23:28:09.000+01:00
diff --git a/package-lock.json b/package-lock.json
diff --git a/public/dropbox.html b/public/dropbox.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en" dir="ltr">
   <head>
     <meta charset="utf-8" />
@@ -17,7 +17,7 @@
       const error = params.get("error");
 
       if (code) getToken();
-      else if (error) window.opener.Cloud.providers.dropbox.returnError(params.get("error_description"));
+      else if (error) returnError(params.get("error_description"));
       else startAuth();
 
       function startAuth() {
@@ -31,13 +31,23 @@
           .catch(error => console.error(error));
       }
 
+      function returnError(description) {
+        const channel = new BroadcastChannel("dropbox-auth");
+        channel.postMessage({type: "error", description});
+        channel.close();
+        window.close();
+      }
+
       function getToken() {
         auth.setCodeVerifier(window.sessionStorage.getItem("codeVerifier"));
         auth
           .getAccessTokenFromCode(REDIRECT_URI, code)
           .then(resp => {
             const token = resp.result.access_token;
-            window.opener.Cloud.providers.dropbox.setDropBoxToken(token);
+            const channel = new BroadcastChannel("dropbox-auth");
+            channel.postMessage({type: "token", token});
+            channel.close();
+            window.close();
           })
           .catch(error => {
             console.error(error);
diff --git a/public/modules/io/cloud.js b/public/modules/io/cloud.js
@@ -95,26 +95,30 @@ window.Cloud = (function () {
           reject(new Error("Timeout. No auth for Dropbox"));
         }, 120 * 1000);
 
-        window.addEventListener("dropboxauth", e => {
+        const channel = new BroadcastChannel("dropbox-auth");
+        channel.onmessage = async ({data}) => {
+          channel.close();
           clearTimeout(watchDog);
-          resolve();
-        });
+          if (data.type === "token") {
+            await this.setDropBoxToken(data.token);
+            resolve();
+          } else {
+            this.returnError(data.description);
+            reject(new Error(data.description));
+          }
+        };
       });
     },
 
-    // Callback function for auth window
     async setDropBoxToken(token) {
       DEBUG.cloud && console.info("Access token:", token);
       setToken(this.name, token);
       await this.connect(token);
-      this.authWindow.close();
-      window.dispatchEvent(new Event("dropboxauth"));
     },
 
     returnError(errorDescription) {
       console.error(errorDescription);
       tip(errorDescription.replaceAll("+", " "), true, "error", 4000);
-      this.authWindow.close();
     },
 
     async getLink(path) {
