How To Create a Callback Page for Atproto's Browser OAuth Client and How to Create a Session Using a Popup? #3385

hammouda101010 · 2025-01-17T18:34:55Z

hammouda101010
Jan 17, 2025

Hi there! I'm in need of a little help with setting up an OAuth session in a browser (Firefox, Chrome, Edge) using a popup (specifically, BrowserOAuthClient.signInPopup(handle)) and creating a callback page to go along with it.

I tried asking to ChatGPT about a concise answer and it didn't gave me any good answers.

Would anyone be able to lend a hand with this process?

Here is my atempt of making one:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8"/>
    <title>OAuth Callback</title>
  </head>
  <body>
    <p id="auth_result">Processing authentication...</p>
  </body>
  <script>
    // Extract the authorization code from the URL
    window.location.hash.replace("#","?")
    const urlParams = new URLSearchParams(window.location.search);

    console.log("Url Params:")
    console.log(urlParams)

    const authCode = urlParams.get('code');

    // Send the authorization code to the main application
    try{
      if (window.opener) {
        window.opener.postMessage({ authCode }, window.location.origin);
        window.close();

      } else {
        throw new Error('No opener window found.');
      }
    }catch(e){
      const auth_result = document.getElementById("auth_result")
      auth_result.innerHTML = `Something Went Wrong: ${e.message.includes("Error: No opener window found.") ? e : "Not a Popup Window (Reason: Couldn't Find an Opener Window.)"}.\n\n Resetting in 3 Seconds`
      auth_result.style.color = "red"
      setTimeout(() => {
        window.close()
      }, 3000)
  }
  </script>
</html>

Also sorry for the long question.

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

How To Create a Callback Page for Atproto's Browser OAuth Client and How to Create a Session Using a Popup? #3385

{{title}}

{{editor}}'s edit

{{editor}}'s edit

Replies: 0 comments

Select a reply

How To Create a Callback Page for Atproto's Browser OAuth Client and How to Create a Session Using a Popup? #3385

hammouda101010 Jan 17, 2025

Here is my atempt of making one:

Replies: 0 comments

hammouda101010
Jan 17, 2025