Error popup on connecting failure

kam193 · Apr 28, 2021 · 331cdb1 · 331cdb1
1 parent 9675e58
commit 331cdb1
Show file tree

Hide file tree

Showing 6 changed files with 55 additions and 14 deletions.
diff --git a/signature-extension/api.js b/signature-extension/api.js
@@ -81,12 +81,9 @@ function getUserData(accessToken, expectedEmail) {
       }
       response.json().then((json) => {
         if (json.aud && json.aud === getOauthClientId()) {
-          if (expectedEmail && json.email !== expectedEmail) {
-            console.log(json)
-            reject(ERROR);
-          }
           resolve({ ...json });
         } else {
+          console.log(json);
           reject("Token validation error");
         }
       });
@@ -97,14 +94,16 @@ function getUserData(accessToken, expectedEmail) {
 }
 
 function connectWithGoogle() {
+  const token = randomToken();
   const handleResponse = (redirectUrl) => {
     const code = extractCode(redirectUrl);
     if (!code) {
       console.log(redirectUrl);
+      openError("connect-error.html");
       throw ERROR;
     }
 
-    const data = addCredentialQuery(`${TOKEN_BASE}&code=${code}`);
+    const data = addCredentialQuery(`${TOKEN_BASE}&code=${code}&code_verifier=${token}`);
     const dataRequest = new Request(TOKEN_URL, {
       method: "POST",
       body: data,
@@ -120,7 +119,12 @@ function connectWithGoogle() {
           reject(ERROR);
         }
         response.json().then((json) => {
-          getUserData(json.access_token).then((userData) => resolve({ ...json, ...userData }));
+          getUserData(json.access_token)
+            .then((userData) => resolve({ ...json, ...userData }))
+            .catch((err) => {
+              console.error(err);
+              openError("connect-error.html");
+            });
         });
       });
     });
@@ -129,7 +133,7 @@ function connectWithGoogle() {
   return browser.identity
     .launchWebAuthFlow({
       interactive: true,
-      url: addClientId(CONNECT_URL),
+      url: addClientId(`${CONNECT_URL}&code_challenge=${token}&code_challenge_method=plain`),
     })
     .then(handleResponse);
 }

diff --git a/signature-extension/background.html b/signature-extension/background.html
@@ -4,6 +4,7 @@
     <title>Thb signature sync</title>
     <script src="_lib/preferences.js"></script>
     <script src="_lib/authorize.js"></script>
+    <script src="utils.js"></script>
     <script src="api.js"></script>
     <script src="background.js"></script>
   </head>

diff --git a/signature-extension/background.js b/signature-extension/background.js
@@ -48,13 +48,7 @@ async function syncAccounts() {
     console.log(`Sync failed. It's ${countedFails} failed sync.`);
 
     if (countedFails % 3 === 0) {
-      browser.windows.create({
-        type: "popup",
-        height: 300,
-        width: 500,
-        url: "sync-error.html",
-        allowScriptsToClose: true,
-      });
+      openError("sync-error.html");
     }
   }
   console.log("Sync finished");

diff --git a/signature-extension/connect-error.html b/signature-extension/connect-error.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<head>
+  <link rel="stylesheet" href="styles.css" />
+  <title>Failed connecting with Google account</title>
+  <meta charset="utf-8" />
+</head>
+<body class="margined">
+  <h1 class="bold">Connecting with your Google account <span class="error">failed</span></h1>
+
+  <p>
+    A problem occured during try to connect with your Google account. Please verify permissions and
+    OAuth client credentials. More information you can find in the debug console.
+  </p>
+
+  <p class="notice">This message is generated by the Signature Sync for Gmail.</p>
+
+  <div class="centered">
+    <button class="big close">close window</button>
+  </div>
+
+  <script src="utils.js"></script>
+</body>
diff --git a/signature-extension/options.html b/signature-extension/options.html
@@ -73,6 +73,7 @@ <h2>About</h2>
 
   <script src="_lib/preferences.js"></script>
   <script src="_lib/authorize.js"></script>
+  <script src="utils.js"></script>
   <script src="background.js"></script>
   <script src="api.js"></script>
   <script src="options.js"></script>

diff --git a/signature-extension/utils.js b/signature-extension/utils.js
@@ -3,4 +3,23 @@ function registerUtils() {
   closeButtons.addEventListener("click", () => window.close());
 }
 
+function randomToken() {
+  let chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+  let token = "";
+  for (let i = 0; i < 50; i++) {
+    token += chars.charAt(Math.floor(Math.random() * chars.length));
+  }
+  return token;
+}
+
+function openError(page) {
+  browser.windows.create({
+    type: "popup",
+    height: 300,
+    width: 500,
+    url: page,
+    allowScriptsToClose: true,
+  });
+}
+
 document.addEventListener("DOMContentLoaded", registerUtils);