If our built-in providers don't meet your needs, you can create your own OAuth 2 provider.
Add your config (client id, client secret, etc.) in config.seed.ts:
Add your config (client id, client secret, etc.) in config.seed.ts:
const configVariables: ConfigVariables = {
// ...
oauth: {
// ...
"YOUR_PROVIDER_NAME-enabled": {
type: "boolean",
defaultValue: "false",
},
"YOUR_PROVIDER_NAME-clientId": {
type: "string",
defaultValue: "",
},
"YOUR_PROVIDER_NAME-clientSecret": {
type: "string",
defaultValue: "",
obscured: true,
},
},
};
If your provider supports OpenID connect, it's extremely easy to extend GenericOidcProvider to add a new OpenID Connect provider.
The Google provider and Microsoft provider are good examples.
+If your provider supports OpenID connect, it's extremely easy to extend GenericOidcProvider to add a new OpenID Connect provider.
The Google provider and Microsoft provider are good examples.
Here are some discovery URIs for popular providers:
https://login.microsoftonline.com/{tenant}/v2.0/.well-known/openid-configurationhttps://api.login.yahoo.com/.well-known/openid-configurationIf your provider only supports OAuth 2, you can implement OAuthProvider interface to add a new OAuth 2 provider.
The GitHub provider and Discord provider are good examples.
+If your provider only supports OAuth 2, you can implement OAuthProvider interface to add a new OAuth 2 provider.
The GitHub provider and Discord provider are good examples.
Register your provider in OAuthModule and OAuthSignInDto:
Register your provider in OAuthModule and OAuthSignInDto:
@Module({
providers: [
GitHubProvider,
// your provider
{
provide: "OAUTH_PROVIDERS",
useFactory(
github: GitHubProvider /* your provider */
): Record<string, OAuthProvider<unknown>> {
return {
github,
/* your provider */
};
},
inject: [GitHubProvider /* your provider */],
},
],
})
export class OAuthModule {}
export interface OAuthSignInDto {
provider:
| "github"
| "google"
| "microsoft"
| "discord"
| "oidc" /* your provider*/;
providerId: string;
providerUsername: string;
email: string;
}
Add an icon in oauth.util.tsx.
Add an icon in oauth.util.tsx.
const getOAuthIcon = (provider: string) => {
return {
github: <SiGithub />,
/* your provider */
}[provider];
};
Add keys below to your i18n text in locale file.
+Add keys below to your i18n text in locale file.
signIn.oauth.YOUR_PROVIDER_NAMEaccount.card.oauth.YOUR_PROVIDER_NAME