vue-ptc/src/utils/third-login.ts

import AsyncTask from './asyncTask'

const gTask = new AsyncTask()

/* window.fbAsyncInit = () => {
  FB.init({
    appId: '683963442752208',
    cookie: true, // Enable cookies to allow the server to access the session.
    version: 'v13.0',
  })
} */

function fbStatusChangeCallback(response: any) {
  // Called with the results from FB.getLoginStatus().
  console.log('statusChangeCallback')
  console.log(response) // The current login status of the person.
  if (response.status === 'connected') {
    // Logged into your webpage and Facebook.
    fbConnect()
  }
}

function fbConnect() {
  // Testing Graph API after login.  See statusChangeCallback() for when this call is made.
  FB.api('/me?fields=id,name,email', function (response: any) {
    console.log(response)
    location.href =
      '/api/user/facebook/callback?name=' +
      response.name +
      '&email=' +
      response.email
  })
}

export function FBLogin() {
  FB.login(fbStatusChangeCallback, { scope: 'public_profile,email' })
}

export function AppleLogin() {
  location.href = '/api/user/apple/login'
}

export async function renderGoogleLoginButton(parent: HTMLElement) {
  await gTask.promise
  google.accounts.id.renderButton(parent, {
    type: 'icon',
    shape: 'circle',
    theme: 'filled_black',
    width: 40,
  })
}

window.addEventListener('load', () => {
  google.accounts.id.initialize({
    client_id:
      '393349837160-3opoqoo9l0gk9uimu212gp9uvm72406m.apps.googleusercontent.com',
    login_uri: import.meta.env.VITE_ORIGIN + '/api/user/google/callback',
    ux_mode: 'redirect',
  })
  gTask.done()
})