GitHub OAuth

[intfract]

Bug

The application is unable to retrieve user data after GitHub OAuth redirect. No errors are thrown in the console. No request parameters are visible.

Code

• Location: src/stores/state.ts
• Language: TypeScript
• Libraries: Appwrite

Snippet

oAuth: async (provider: string, redirectURL: string) => {
  sdk.account.createOAuth2Session(provider, redirectURL, redirectURL)
  const user = await sdk.account.get() // doesn't work
  state.init(user) // nothing happens
}

[bitlogist]

Recommendation

It might be possible to fix the issue by checking for URL query parameters.

Code

• Target: src/stores/state.ts
• Independent

Snippet

const createState = () => {
  const { subscribe, set } = writable<State>({
    account: null,
  })

  return {
    subscribe,
    signUp: async (email: string, password: string, name: string) => {
      return await sdk.account.create('unique()', email, password, name)
    },
    signIn: async (email: string, password: string) => {
      await sdk.account.createEmailSession(email, password)
      const user = await sdk.account.get()
      state.init(user)
    },
    signOut: async () => {
      state.init(null)
      await sdk.account.deleteSession('current')
    },
    init: async (account: Models.User<Models.Preferences> | null = null) => {
      set({ account })
    },
    oAuth: async (provider: string, redirectURL: string) => {
      sdk.account.createOAuth2Session(provider, redirectURL)

      const urlParams = new URLSearchParams(window.location.search)
      const code = urlParams.get('code')

      const response = await fetch('/api/github-oauth', {
        method: 'POST',
        body: JSON.stringify({ code }), 

        headers: {
          'Content-Type': 'application/json',
        },
      })

      if (response.ok) {
        const user = await response.json()
        state.init(user)
      }
    },
  }
}

[bitlogist]

Solution

The above code does not work due to the way Appwrite redirects work. However, the Account API has an accountGetSession method available. The providerAccessToken should be accessible by a cookie or by the cookieFallback in local storage.

Code

• Example
• Independent

const session = await account.getSession(SESSION_ID)