Handle errors

https://gist.github.com/simonw/85debbdf3d981ff7e54f8cdb6be47578
simonw · Nov 29, 2024 · 587a766 · 587a766
1 parent b4a4f14
commit 587a766
Showing 1 changed file with 87 additions and 36 deletions.
diff --git a/cloudflare-workers/github-auth.js b/cloudflare-workers/github-auth.js
@@ -1,15 +1,57 @@
 export default {
   async fetch(request, env) {
-    const url = new URL(request.url);
-    const clientId = env.GITHUB_CLIENT_ID;
-    const clientSecret = env.GITHUB_CLIENT_SECRET;
-    const redirectUri = env.GITHUB_REDIRECT_URI;
-
-    // If we have a code, exchange it for an access token
-    if (url.searchParams.has('code')) {
-      const code = url.searchParams.get('code');
+    const generateHTML = ({ title, content, isError = false }) => {
+      return new Response(`
+        <!DOCTYPE html>
+        <html>
+          <head>
+            <title>${title}</title>
+            <style>
+              body {
+                font-family: -apple-system, system-ui, sans-serif;
+                padding: 2rem;
+                max-width: 600px;
+                margin: 0 auto;
+                text-align: center;
+              }
+              .message {
+                padding: 1rem;
+                margin: 1rem 0;
+                border-radius: 4px;
+                background-color: ${isError ? '#ffebee' : '#e8f5e9'};
+                border: 1px solid ${isError ? '#ffcdd2' : '#c8e6c9'};
+                color: ${isError ? '#b71c1c' : '#2e7d32'};
+              }
+            </style>
+          </head>
+          <body>
+            <div class="message">
+              ${content}
+            </div>
+            ${isError ? '<p>Please close this window and try again. If the problem persists, contact support.</p>' : ''}
+          </body>
+        </html>
+      `, {
+        headers: { 'Content-Type': 'text/html' },
+        status: isError ? 400 : 200
+      });
+    };
+
+    try {
+      const url = new URL(request.url);
+      const clientId = env.GITHUB_CLIENT_ID;
+      const clientSecret = env.GITHUB_CLIENT_SECRET;
+      const redirectUri = env.GITHUB_REDIRECT_URI;
 
-      // Exchange the code for an access token
+      if (!url.searchParams.has('code')) {
+        const githubAuthUrl = new URL('https://github.com/login/oauth/authorize');
+        githubAuthUrl.searchParams.set('client_id', clientId);
+        githubAuthUrl.searchParams.set('redirect_uri', redirectUri);
+        githubAuthUrl.searchParams.set('scope', 'gist');
+        githubAuthUrl.searchParams.set('state', crypto.randomUUID());
+        return Response.redirect(githubAuthUrl.toString(), 302);
+      }
+
       const tokenResponse = await fetch('https://github.com/login/oauth/access_token', {
         method: 'POST',
         headers: {
@@ -19,41 +61,50 @@ export default {
         body: JSON.stringify({
           client_id: clientId,
           client_secret: clientSecret,
-          code: code,
+          code: url.searchParams.get('code'),
           redirect_uri: redirectUri
         })
       });
 
       const tokenData = await tokenResponse.json();
 
-      // Return HTML that stores the token and closes the window
-      return new Response(`
-        <!DOCTYPE html>
-        <html>
-          <head>
-            <title>GitHub OAuth Success</title>
-          </head>
-          <body>
-            <script>
+      if (tokenData.error) {
+        return generateHTML({
+          title: 'GitHub OAuth Error',
+          content: `
+            <h3>Authentication Error</h3>
+            <p>Error: ${tokenData.error}</p>
+            ${tokenData.error_description ? `<p>Description: ${tokenData.error_description}</p>` : ''}
+          `,
+          isError: true
+        });
+      }
+
+      return generateHTML({
+        title: 'GitHub OAuth Success',
+        content: `
+          <h2>Authentication successful!</h2>
+          <p>You can close this window.</p>
+          <script>
+            try {
               localStorage.setItem('github_token', '${tokenData.access_token}');
-              document.body.innerHTML = 'Authentication successful! You can close this window.';
-            </script>
-          </body>
-        </html>
-      `, {
-        headers: {
-          'Content-Type': 'text/html'
-        }
+            } catch (err) {
+              document.body.innerHTML += '<p style="color: #c62828;">Warning: Unable to store token in localStorage</p>';
+            }
+          </script>
+        `
+      });
+
+    } catch (error) {
+      return generateHTML({
+        title: 'Unexpected Error',
+        content: `
+          <h3>Unexpected Error</h3>
+          <p>An unexpected error occurred during authentication.</p>
+          <p>Details: ${error.message}</p>
+        `,
+        isError: true
       });
     }
-
-    // If no code, redirect to GitHub OAuth
-    const githubAuthUrl = new URL('https://github.com/login/oauth/authorize');
-    githubAuthUrl.searchParams.set('client_id', clientId);
-    githubAuthUrl.searchParams.set('redirect_uri', redirectUri);
-    githubAuthUrl.searchParams.set('scope', 'gist');
-    githubAuthUrl.searchParams.set('state', crypto.randomUUID());
-
-    return Response.redirect(githubAuthUrl.toString(), 302);
   }
 };