Google

WunderGraph relies on OpenID Connect (OIDC) Identity Providers to be able to authenticate users.

Open your project's wundergraph.config.ts and scroll down to the authentication object. Inside the nested cookieBased object is a nested array object called providers. Inside this array, add an google auth provider as shown below:

1
2
3
4
5
6
7
8
9
10
11
12
13
// wundergraph.config.ts
authentication: {
cookieBased: {
providers: [
authProviders.google({
id: 'google', // you have to choose this ID
clientId: '.apps.googleusercontent.com', // client ID from Google
clientSecret: 'XXX', // client secret from Google
}),
];
}
// ...
}

Now create a OAuth app through Google:

  1. Go to the Credentials page .
  2. Click Create credentials > OAuth client ID.
  3. Select the Web application application type.
  4. Name your OAuth 2.0 client and click Create.

For more help, see Google's developer docs .

You must supply an object inside the auth provider that contains three properties, two of which come from your new Google OAuth App:

  • id: your choice of unique id that identifies the provider (used to refer elsewhere to this specific provider)
  • clientId: the client ID from Google
  • clientSecret: the client secret from Google

Consider storing your IDs and secrets inside a .env file.

Previous
GitHub

Was this article helpful to you?
Provide feedback

Edit this page