Theo's Typesafe Cult•2y ago

Using GithubAPI + NextAuth Github Provider to access a User's repo information.

I am building an app where will allow users to login with Github and view their Github accounts data ( Repos and issues ). A good example would be vercel or netlify, which accesses a user's public repos. I currently have Github Auth Configured...

// auth.ts
 providers: [
    GithubProvider({
      clientId: env.GITHUB_CLIENT_ID,
      clientSecret: env.GITHUB_CLIENT_SECRET,
      // Notice the scope of user here
      authorization: {params: {scope: 'user'}}
    })

// auth.ts
 providers: [
    GithubProvider({
      clientId: env.GITHUB_CLIENT_ID,
      clientSecret: env.GITHUB_CLIENT_SECRET,
      // Notice the scope of user here
      authorization: {params: {scope: 'user'}}
    })

// user.ts

  getUserGithub: protectedProcedure.query(async ({ ctx }) => {
 
    const account = await ctx.prisma.account.findFirst({
      where: {
        userId: ctx.session.user.id,
      },
     include: {
      user: true
     },
    })

    const accessToken = account?.access_token;
    
    const response = await fetch(`https://api.github.com/user`, {
      headers: {Authentication: `Bearer ${accessToken}`}
    });

    const userData = response.json()

    return userData;

  }),

// user.ts

  getUserGithub: protectedProcedure.query(async ({ ctx }) => {
 
    const account = await ctx.prisma.account.findFirst({
      where: {
        userId: ctx.session.user.id,
      },
     include: {
      user: true
     },
    })

    const accessToken = account?.access_token;
    
    const response = await fetch(`https://api.github.com/user`, {
      headers: {Authentication: `Bearer ${accessToken}`}
    });

    const userData = response.json()

    return userData;

  }),

and when attempting to print out the result...

  {JSON.stringify(userAccount.data)}

  {JSON.stringify(userAccount.data)}

...I get the message

"message":"Requires authentication","documentation_url":"https://docs.github.com/rest/reference/users#get-the-authenticated-user"}

I am not sure where I am going wrong. I would attempt to hit the api.github.com/users/{username} endpoint, but I do not have access to the user's {username}. I would appreciate any help and direction others could provide. Thanks !

4 Replies

EthanOP•2y ago

Bumping

Sturlen•2y ago

have you tried logging the accessToken directly? if it's undefined, then that would point to an issue with Prisma

EthanOP•2y ago

Thanks for the reply ! Yeah so I was having issues with it being undefined, but I fixed that issue. My issue still persist, but now the error reads “bad credentials”. I’m not exactly sure what I’m doing wrong. I even tried appending ?token={access_token} to the request URL, but that didn’t help. Bumping

Huperniketes•2y ago

You're using NextAuth? Gotta be. Now I know why T used Clerk in the t3 tutorial. I've spent the whole day trying to get this to work with GitHub too. When you fixed the undefined issues, did you change the code you posted previously?

Gaming

Programming

Using GithubAPI + NextAuth Github Provider to access a User's repo information.