3

In my NextJS app I am using clerk for auth (Google SSO) and I want to be able to create a google meet event through the UI on behalf of the signed in user. I believe the way to do this is once a user has used signed in through google sso I should be able to retrieve their google access token that can be used to query the google calendar api and make the event. I have granted https://www.googleapis.com/auth/calendar.events https://www.googleapis.com/auth/calendar as additional scopes in clerk for Google SSO so now users can authorise these on sign up or later on through the clerk ui.

The issue is getting the google access token. It is not in the user object by default. I don't know how I can obtain it. Maybe there is some way to obtain it at sign in and save it to the users metadata with a webhook? I think it should be easy or at least possible as otherwise I don't know why you can grant additional scopes for identity providers in clerk.

Would really appreciate any assistance. Cheers

I've searched the docs https://clerk.com/docs/authentication/social-connections-oauth#configure-additional-o-auth-scopes introduced additional o-auth scopes for google calendar api. Can't find anything on getting the google access token. GPT-4 can't solve it, thinks it should be in the user object by default which it isn't.

James Aldridge
  • 49
  • 3

2 Answers2

0

Clerk Devs linked me appropriate docs.

In nextjs you can use clerkClient.users in the backend to retrieve it

https://clerk.com/docs/reference/backend-api/tag/Users#operation/GetOAuthAccessToken

https://api.clerk.dev/v1/users/{user_id}/oauth_access_tokens/{provider}

James Aldridge
  • 49
  • 3
  • As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Apr 17 '23 at 13:33
  • Note that if the user logs out or ends the session, you also lose the additional scopes. These do not provide tokens for offline access. – jrthib Jun 04 '23 at 22:49
  • 1
    Any chance you could update this answer with a better explanation? I'm also looking to access the calendar API with clerk authentication and am having some difficulty. Thanks. – wsaxton Jun 11 '23 at 18:38
  • This answer needs a little more information. Would upvote but the answer is not very helpful. – yoshinator Aug 31 '23 at 02:39
0

So after some digging around I figured this out. You need three key packages to make this work.

Also you need to have the scopes added that you will be using. In my example below, I use the gmail scope, so add it from your clerk dashboard. You will need your own Google Credentials with ClientID and secret set on the clerk dashboard aswell.

import { auth } from '@clerk/nextjs'
import clerk from '@clerk/clerk-sdk-node'
import { google } from 'googleapis'

You're going to need to auth to get your userId. You're going to need clerk from the sdk to get the access Token. You're going to need google to access the gmail api for my example.

after that the rest is pretty trivial.

Here is a route.ts file I created that has this working.

// src/app/api/gmail/route.ts
import { auth } from '@clerk/nextjs'
import { NextResponse } from 'next/server'
import { google } from 'googleapis'
import clerk from '@clerk/clerk-sdk-node'

export async function GET(req: Request) {
  try {
    const { userId } = auth()

    // this returns an array of OauthAccessToken objects I'm just getting the first one
    const [OauthAccessToken] = await clerk.users.getUserOauthAccessToken(
      userId || '',
      'oauth_google'
    )

    // this is the token I need to use to make requests to the gmail api
    // destructuring it here for clarity you can also just use OauthAccessToken.token below
    const { token } = OauthAccessToken
R
    if (!token) {
      return new NextResponse('Unauthorized NO TOKEN', { status: 401 })
    }

    // this is the gmail api client, you can use this to make 
    // any request to the gmail api you can use any other 
    // google.whatever api you need. Here is we make use of 
    // the token we got from clerk passed in the headers
    const gmail = google.gmail({
      version: 'v1',
      headers: { Authorization: `Bearer ${token}` },
    })
    const res = await gmail.users.labels.list({
      userId: 'me',
    })

    return NextResponse.json(res.data.labels)
  } catch (error) {
    console.log('[GMAIL ERROR]', error)
    return new NextResponse('Internal error', { status: 500 })
  }
}

I hope this answers the question with a little more clarity.

yoshinator
  • 436
  • 6
  • 13