// app.module.ts
// ---------------------------
import { AuthModule, AuthClientConfig } from '@auth0/auth0-angular';
// Provide an initializer function that returns a Promise
function configInitializer(
http: HttpClient,
config: AuthClientConfig
) {
return () =>
http
.get('/config')
.toPromise()
.then((loadedConfig: any) => config.set(loadedConfig)); // Set the config that was loaded asynchronously here
}
// Provide APP_INITIALIZER with this function. Note that there is no config passed to AuthModule.forRoot
imports: [
// other imports..
HttpClientModule,
AuthModule.forRoot(), //<- don't pass any config here
],
providers: [
{
provide: APP_INITIALIZER,
useFactory: configInitializer, // <- pass your initializer function here
deps: [HttpClient, AuthClientConfig],
multi: true,
},
],
+ // app.module.ts
// ---------------------------
import { AuthModule, AuthClientConfig } from '@auth0/auth0-angular';
// Provide an initializer function that returns a Promise
function configInitializer(
http: HttpClient,
config: AuthClientConfig
) {
return () =>
http
.get('/config')
.toPromise()
.then((loadedConfig: any) => config.set(loadedConfig)); // Set the config that was loaded asynchronously here
}
// Provide APP_INITIALIZER with this function. Note that there is no config passed to AuthModule.forRoot
imports: [
// other imports..
HttpClientModule,
AuthModule.forRoot(), //<- don't pass any config here
],
providers: [
{
provide: APP_INITIALIZER,
useFactory: configInitializer, // <- pass your initializer function here
deps: [HttpClient, AuthClientConfig],
multi: true,
},
],
@@ -118,7 +118,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:213
@@ -265,7 +265,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:216
@@ -337,7 +337,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:234
@@ -410,7 +410,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:227
diff --git a/docs/classes/AuthGuard.html b/docs/classes/AuthGuard.html
index 7c45ec87..9a219a2d 100644
--- a/docs/classes/AuthGuard.html
+++ b/docs/classes/AuthGuard.html
@@ -93,7 +93,7 @@ Class AuthGuard
Defined in
projects/auth0-angular/src/lib/auth.guard.ts:15
@@ -247,7 +247,7 @@
Defined in
projects/auth0-angular/src/lib/auth.guard.ts:16
@@ -348,7 +348,7 @@
Defined in
projects/auth0-angular/src/lib/auth.guard.ts:22
@@ -436,7 +436,7 @@
Defined in
projects/auth0-angular/src/lib/auth.guard.ts:29
@@ -514,7 +514,7 @@
Defined in
projects/auth0-angular/src/lib/auth.guard.ts:18
diff --git a/docs/classes/AuthHttpInterceptor.html b/docs/classes/AuthHttpInterceptor.html
index 51d6c900..611b3fa3 100644
--- a/docs/classes/AuthHttpInterceptor.html
+++ b/docs/classes/AuthHttpInterceptor.html
@@ -99,8 +99,8 @@ Implements
Defined in
projects/auth0-angular/src/lib/auth.interceptor.ts:40projects/auth0-angular/src/lib/auth.interceptor.ts:45
@@ -292,8 +292,8 @@
Defined in
projects/auth0-angular/src/lib/auth.interceptor.ts:41projects/auth0-angular/src/lib/auth.interceptor.ts:46
@@ -414,8 +414,8 @@
Defined in
projects/auth0-angular/src/lib/auth.interceptor.ts:48projects/auth0-angular/src/lib/auth.interceptor.ts:53
diff --git a/docs/classes/AuthModule.html b/docs/classes/AuthModule.html
index dad740ef..93555902 100644
--- a/docs/classes/AuthModule.html
+++ b/docs/classes/AuthModule.html
@@ -93,7 +93,7 @@ Class AuthModule
Defined in
projects/auth0-angular/src/lib/auth.module.ts:8
@@ -301,7 +301,7 @@
Defined in
projects/auth0-angular/src/lib/auth.module.ts:15
diff --git a/docs/classes/AuthService.html b/docs/classes/AuthService.html
index dd683d47..a21e84ca 100644
--- a/docs/classes/AuthService.html
+++ b/docs/classes/AuthService.html
@@ -121,7 +121,7 @@ Implements
Defined in
projects/auth0-angular/src/lib/auth.service.ts:47
@@ -519,7 +519,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:86
@@ -582,7 +582,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:84
@@ -617,7 +617,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:78
@@ -664,7 +664,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:73
@@ -706,7 +706,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:63
@@ -744,7 +744,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:57
@@ -785,7 +785,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:68
@@ -879,7 +879,7 @@
-
- generateDpopProof(params).subscribe(proof => ...)
+ generateDpopProof(params).subscribe(proof => ...)
@@ -1129,7 +1129,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:382
@@ -1234,7 +1234,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:203
@@ -1304,7 +1304,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:212
@@ -1361,7 +1361,7 @@
- getTokenWithPopup(options).subscribe(token => ...)
+ getTokenWithPopup(options).subscribe(token => ...)
Get an access token interactively.
@@ -1403,7 +1403,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:277
@@ -1453,7 +1453,7 @@
- getDpopNonce(id).subscribe(nonce => ...)
+ getDpopNonce(id).subscribe(nonce => ...)
@@ -1497,7 +1497,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:346
@@ -1567,7 +1567,7 @@
- handleRedirectCallback(url).subscribe(result => ...)
+ handleRedirectCallback(url).subscribe(result => ...)
@@ -1632,7 +1632,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:309
@@ -1756,7 +1756,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:162
@@ -1861,7 +1861,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:139
@@ -1958,7 +1958,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:188
@@ -2007,7 +2007,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:122
@@ -2059,7 +2059,7 @@
- setDpopNonce(nonce, id).subscribe(() => ...)
+ setDpopNonce(nonce, id).subscribe(() => ...)
@@ -2107,7 +2107,7 @@
Defined in
projects/auth0-angular/src/lib/auth.service.ts:362
diff --git a/docs/classes/AuthState.html b/docs/classes/AuthState.html
index f2d103d0..592f6df2 100644
--- a/docs/classes/AuthState.html
+++ b/docs/classes/AuthState.html
@@ -98,7 +98,7 @@ Class AuthState
Defined in
projects/auth0-angular/src/lib/auth.state.ts:26
@@ -307,7 +307,7 @@
Defined in
projects/auth0-angular/src/lib/auth.state.ts:112
@@ -361,7 +361,7 @@
Defined in
projects/auth0-angular/src/lib/auth.state.ts:110
@@ -408,7 +408,7 @@
Defined in
projects/auth0-angular/src/lib/auth.state.ts:101
@@ -450,7 +450,7 @@
Defined in
projects/auth0-angular/src/lib/auth.state.ts:83
@@ -488,7 +488,7 @@
Defined in
projects/auth0-angular/src/lib/auth.state.ts:35
@@ -529,7 +529,7 @@
Defined in
projects/auth0-angular/src/lib/auth.state.ts:91
@@ -595,7 +595,7 @@
Defined in
projects/auth0-angular/src/lib/auth.state.ts:127
@@ -668,7 +668,7 @@
Defined in
projects/auth0-angular/src/lib/auth.state.ts:136
@@ -736,7 +736,7 @@
Defined in
projects/auth0-angular/src/lib/auth.state.ts:145
@@ -807,7 +807,7 @@
Defined in
projects/auth0-angular/src/lib/auth.state.ts:119
diff --git a/docs/classes/AuthenticationError.html b/docs/classes/AuthenticationError.html
index f4c8357e..4aba40c9 100644
--- a/docs/classes/AuthenticationError.html
+++ b/docs/classes/AuthenticationError.html
@@ -750,7 +750,7 @@
string representing the location in the code at which
Error.captureStackTrace() was called.
- const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
+ const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
@@ -769,7 +769,7 @@
hiding implementation details of error generation from
the user. For instance:
- function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
+ function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
diff --git a/docs/classes/GenericError.html b/docs/classes/GenericError.html
index 95db2aa8..92954cb7 100644
--- a/docs/classes/GenericError.html
+++ b/docs/classes/GenericError.html
@@ -646,7 +646,7 @@
string representing the location in the code at which
Error.captureStackTrace() was called.
- const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
+ const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
@@ -665,7 +665,7 @@
hiding implementation details of error generation from
the user. For instance:
- function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
+ function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
diff --git a/docs/classes/MfaRequiredError.html b/docs/classes/MfaRequiredError.html
index 26c73a2d..90e12e7d 100644
--- a/docs/classes/MfaRequiredError.html
+++ b/docs/classes/MfaRequiredError.html
@@ -703,7 +703,7 @@
string representing the location in the code at which
Error.captureStackTrace() was called.
- const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
+ const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
@@ -722,7 +722,7 @@
hiding implementation details of error generation from
the user. For instance:
- function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
+ function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
diff --git a/docs/classes/MissingRefreshTokenError.html b/docs/classes/MissingRefreshTokenError.html
index cc7b2d25..927640f9 100644
--- a/docs/classes/MissingRefreshTokenError.html
+++ b/docs/classes/MissingRefreshTokenError.html
@@ -720,7 +720,7 @@
string representing the location in the code at which
Error.captureStackTrace() was called.
- const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
+ const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
@@ -739,7 +739,7 @@
hiding implementation details of error generation from
the user. For instance:
- function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
+ function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
diff --git a/docs/classes/PopupCancelledError.html b/docs/classes/PopupCancelledError.html
index f1ee887a..2b484b3c 100644
--- a/docs/classes/PopupCancelledError.html
+++ b/docs/classes/PopupCancelledError.html
@@ -670,7 +670,7 @@
string representing the location in the code at which
Error.captureStackTrace() was called.
- const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
+ const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
@@ -689,7 +689,7 @@
hiding implementation details of error generation from
the user. For instance:
- function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
+ function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
diff --git a/docs/classes/PopupTimeoutError.html b/docs/classes/PopupTimeoutError.html
index 0d04c6d6..88ab192f 100644
--- a/docs/classes/PopupTimeoutError.html
+++ b/docs/classes/PopupTimeoutError.html
@@ -673,7 +673,7 @@
string representing the location in the code at which
Error.captureStackTrace() was called.
- const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
+ const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
@@ -692,7 +692,7 @@
hiding implementation details of error generation from
the user. For instance:
- function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
+ function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
diff --git a/docs/classes/TimeoutError.html b/docs/classes/TimeoutError.html
index ce880b35..26de411f 100644
--- a/docs/classes/TimeoutError.html
+++ b/docs/classes/TimeoutError.html
@@ -635,7 +635,7 @@
string representing the location in the code at which
Error.captureStackTrace() was called.
- const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
+ const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
@@ -654,7 +654,7 @@
hiding implementation details of error generation from
the user. For instance:
- function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
+ function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
diff --git a/docs/classes/UseDpopNonceError.html b/docs/classes/UseDpopNonceError.html
index 431d1cae..cff4924a 100644
--- a/docs/classes/UseDpopNonceError.html
+++ b/docs/classes/UseDpopNonceError.html
@@ -686,7 +686,7 @@
string representing the location in the code at which
Error.captureStackTrace() was called.
- const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
+ const myObject = {};
Error.captureStackTrace(myObject);
myObject.stack; // Similar to `new Error().stack`
@@ -705,7 +705,7 @@
hiding implementation details of error generation from
the user. For instance:
- function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
+ function a() {
b();
}
function b() {
c();
}
function c() {
// Create an error without stack trace to avoid calculating the stack trace twice.
const { stackTraceLimit } = Error;
Error.stackTraceLimit = 0;
const error = new Error();
Error.stackTraceLimit = stackTraceLimit;
// Capture the stack trace above function b
Error.captureStackTrace(error, b); // Neither function c, nor b is included in the stack trace
throw error;
}
a();
diff --git a/docs/enums/HttpMethod.html b/docs/enums/HttpMethod.html
index 162187b8..a58744a2 100644
--- a/docs/enums/HttpMethod.html
+++ b/docs/enums/HttpMethod.html
@@ -98,7 +98,7 @@ Enumeration HttpMethodConst
Defined in
projects/auth0-angular/src/lib/auth.config.ts:13
@@ -221,7 +221,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:18
@@ -246,7 +246,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:14
@@ -271,7 +271,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:19
@@ -296,7 +296,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:17
@@ -321,7 +321,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:15
@@ -346,7 +346,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:16
diff --git a/docs/functions/authGuardFn.html b/docs/functions/authGuardFn.html
index e8c6860e..447fa046 100644
--- a/docs/functions/authGuardFn.html
+++ b/docs/functions/authGuardFn.html
@@ -175,7 +175,7 @@
Defined in
projects/auth0-angular/src/lib/functional.ts:17
diff --git a/docs/functions/authHttpInterceptorFn.html b/docs/functions/authHttpInterceptorFn.html
index 9b04428a..7947c204 100644
--- a/docs/functions/authHttpInterceptorFn.html
+++ b/docs/functions/authHttpInterceptorFn.html
@@ -214,7 +214,7 @@
Defined in
projects/auth0-angular/src/lib/functional.ts:32
diff --git a/docs/functions/isHttpInterceptorRouteConfig.html b/docs/functions/isHttpInterceptorRouteConfig.html
index ddbf0a38..ab5a2d10 100644
--- a/docs/functions/isHttpInterceptorRouteConfig.html
+++ b/docs/functions/isHttpInterceptorRouteConfig.html
@@ -164,7 +164,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:35
diff --git a/docs/functions/provideAuth0.html b/docs/functions/provideAuth0.html
index 5f7c773f..9ff9f737 100644
--- a/docs/functions/provideAuth0.html
+++ b/docs/functions/provideAuth0.html
@@ -169,7 +169,7 @@
Defined in
projects/auth0-angular/src/lib/provide.ts:23
diff --git a/docs/index.html b/docs/index.html
index cce83823..815a225d 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -304,14 +304,21 @@
>
- Install the SDK into your application by importing
- AuthModule.forRoot() and configuring with your Auth0
- domain and client id, as well as the URL to which Auth0 should
- redirect back after succesful authentication:
+ The recommended approach is to use the functional
+ provideAuth0() in your application configuration:
- import { NgModule } from '@angular/core';
import { AuthModule } from '@auth0/auth0-angular';
@NgModule({
// ...
imports: [
AuthModule.forRoot({
domain: 'YOUR_AUTH0_DOMAIN',
clientId: 'YOUR_AUTH0_CLIENT_ID',
authorizationParams: {
redirect_uri: window.location.origin,
},
}),
],
// ...
})
export class AppModule {}
+ import { ApplicationConfig } from '@angular/core';
import { provideAuth0 } from '@auth0/auth0-angular';
export const appConfig: ApplicationConfig = {
providers: [
provideAuth0({
domain: 'YOUR_AUTH0_DOMAIN',
clientId: 'YOUR_AUTH0_CLIENT_ID',
authorizationParams: {
redirect_uri: window.location.origin,
},
}),
],
};
+
+ Using NgModules
+
+ If you're using NgModules, you can configure the SDK using
+ AuthModule.forRoot():
+
+ import { NgModule } from '@angular/core';
import { AuthModule } from '@auth0/auth0-angular';
@NgModule({
imports: [
AuthModule.forRoot({
domain: 'YOUR_AUTH0_DOMAIN',
clientId: 'YOUR_AUTH0_CLIENT_ID',
authorizationParams: {
redirect_uri: window.location.origin,
},
}),
],
})
export class AppModule {}
+
+
Dynamic configuration
>
- Instead of using AuthModule.forRoot to specify auth
- configuration, you can provide a factory function using
- APP_INITIALIZER to load your config from an external
- source before the auth module is loaded, and provide your
- configuration using AuthClientConfig.set.
-
-
- The configuration will only be used initially when the SDK is
- instantiated. Any changes made to the configuration at a later
- moment in time will have no effect on the default options used when
- calling the SDK's methods. This is also the reason why the dynamic
- configuration should be set using an APP_INITIALIZER,
- because doing so ensures the configuration is available prior to
- instantiating the SDK.
+ Instead of providing static configuration, you can use
+ provideAppInitializer to load your config from an
+ external source before the SDK is instantiated, and configure it
+ using AuthClientConfig.set.
+ import { ApplicationConfig, inject, provideAppInitializer } from '@angular/core';
import { provideHttpClient, HttpBackend, HttpClient } from '@angular/common/http';
import { provideAuth0, AuthClientConfig } from '@auth0/auth0-angular';
export function configInitializer(handler: HttpBackend, config: AuthClientConfig) {
return () =>
new HttpClient(handler)
.get('/config')
.toPromise()
.then((loadedConfig: any) => config.set(loadedConfig));
}
export const appConfig: ApplicationConfig = {
providers: [
provideHttpClient(),
provideAuth0(),
provideAppInitializer(() => {
const handler = inject(HttpBackend);
const config = inject(AuthClientConfig);
return configInitializer(handler, config)();
}),
],
};
+
+
+
+
+ Important: The configuration will only be used
+ initially when the SDK is instantiated. Any changes made to the
+ configuration at a later moment in time will have no effect on the
+ default options used when calling the SDK's methods. This is why
+ the dynamic configuration should be set using an app initializer,
+ which ensures the configuration is available prior to
+ instantiating the SDK.
+
+
:information_source: Any request made through an instance of
- HttpClient that got instantiated by Angular, will use
- all of the configured interceptors, including our
+ HttpClient that got instantiated by Angular will use
+ all configured interceptors, including our
AuthHttpInterceptor. Because the
AuthHttpInterceptor requires the existence of
configuration settings, the request for retrieving those dynamic
- configuration settings should ensure it's not using any of those
+ configuration settings should ensure it's not using any
interceptors. In Angular, this can be done by manually
instantiating HttpClient using an injected
HttpBackend instance.
- import { AuthModule, AuthClientConfig } from '@auth0/auth0-angular';
// Provide an initializer function that returns a Promise
function configInitializer(
handler: HttpBackend,
config: AuthClientConfig
) {
return () =>
new HttpClient(handler)
.get('/config')
.toPromise()
// Set the config that was loaded asynchronously here
.then((loadedConfig: any) => config.set(loadedConfig));
}
export class AppModule {
// ...
imports: [
HttpClientModule,
AuthModule.forRoot(), // <- don't pass any config here
],
providers: [
{
provide: APP_INITIALIZER,
useFactory: configInitializer, // <- pass your initializer function here
deps: [HttpBackend, AuthClientConfig],
multi: true,
},
],
// ...
}
+
+ Using NgModules
+
+ Instead of using AuthModule.forRoot to specify auth
+ configuration, you can provide a factory function using
+ APP_INITIALIZER to load your config from an external
+ source before the auth module is loaded, and provide your
+ configuration using AuthClientConfig.set.
+
+ import { APP_INITIALIZER } from '@angular/core';
import { HttpClientModule, HttpClient, HttpBackend } from '@angular/common/http';
import { AuthModule, AuthClientConfig } from '@auth0/auth0-angular';
function configInitializer(handler: HttpBackend, config: AuthClientConfig) {
return () =>
new HttpClient(handler)
.get('/config')
.toPromise()
.then((loadedConfig: any) => config.set(loadedConfig));
}
@NgModule({
imports: [HttpClientModule, AuthModule.forRoot()],
providers: [
{
provide: APP_INITIALIZER,
useFactory: configInitializer,
deps: [HttpBackend, AuthClientConfig],
multi: true,
},
],
})
export class AppModule {}
-
+
Add login to your application
AuthService and call its
loginWithRedirect method.
- import { Component } from '@angular/core';
import { AuthService } from '@auth0/auth0-angular';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
})
export class AppComponent {
constructor(public auth: AuthService) {}
loginWithRedirect() {
this.auth.loginWithRedirect();
}
+ import { Component } from '@angular/core';
import { AuthService } from '@auth0/auth0-angular';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
})
export class AppComponent {
constructor(public auth: AuthService) {}
loginWithRedirect() {
this.auth.loginWithRedirect();
}
diff --git a/docs/interfaces/AppState.html b/docs/interfaces/AppState.html
index 7ec07920..2838d159 100644
--- a/docs/interfaces/AppState.html
+++ b/docs/interfaces/AppState.html
@@ -137,7 +137,7 @@
Indexable
Defined in
projects/auth0-angular/src/lib/auth.config.ts:142
@@ -218,7 +218,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:147
diff --git a/docs/interfaces/AuthConfig.html b/docs/interfaces/AuthConfig.html
index 5c688f1e..15d9777c 100644
--- a/docs/interfaces/AuthConfig.html
+++ b/docs/interfaces/AuthConfig.html
@@ -298,7 +298,7 @@ Hierarchy
Defined in
projects/auth0-angular/src/lib/auth.config.ts:107
@@ -966,7 +966,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:136
@@ -1005,7 +1005,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:130
@@ -1282,7 +1282,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:124
@@ -1560,7 +1560,7 @@
- let token: string;
try {
token = await auth0.getTokenSilently();
} catch (e) {
if (e.error === 'missing_refresh_token' || e.error === 'invalid_grant') {
auth0.loginWithRedirect();
}
}
+ let token: string;
try {
token = await auth0.getTokenSilently();
} catch (e) {
if (e.error === 'missing_refresh_token' || e.error === 'invalid_grant') {
auth0.loginWithRedirect();
}
}
diff --git a/docs/interfaces/HttpInterceptorConfig.html b/docs/interfaces/HttpInterceptorConfig.html
index a4954c31..38fe6c9f 100644
--- a/docs/interfaces/HttpInterceptorConfig.html
+++ b/docs/interfaces/HttpInterceptorConfig.html
@@ -116,7 +116,7 @@ Interface HttpInterceptorConfig
Defined in
projects/auth0-angular/src/lib/auth.config.ts:44
@@ -195,7 +195,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:45
diff --git a/docs/interfaces/HttpInterceptorRouteConfig.html b/docs/interfaces/HttpInterceptorRouteConfig.html
index 94aed57e..3d65713e 100644
--- a/docs/interfaces/HttpInterceptorRouteConfig.html
+++ b/docs/interfaces/HttpInterceptorRouteConfig.html
@@ -147,7 +147,7 @@ Interface HttpInterceptorRouteConfig
Defined in
projects/auth0-angular/src/lib/auth.config.ts:51
@@ -269,7 +269,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:101
@@ -306,7 +306,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:94
@@ -345,7 +345,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:85
@@ -407,7 +407,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:67
@@ -460,7 +460,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:79
diff --git a/docs/interfaces/LogoutOptions.html b/docs/interfaces/LogoutOptions.html
index 2d7d4877..4bc19730 100644
--- a/docs/interfaces/LogoutOptions.html
+++ b/docs/interfaces/LogoutOptions.html
@@ -173,7 +173,7 @@ Hierarchy
Defined in
projects/auth0-angular/src/lib/interfaces.ts:9
@@ -487,7 +487,7 @@
- import { Browser } from '@capacitor/browser';
await auth0.logout({
async openUrl(url) {
await Browser.open({ url });
}
});
+ import { Browser } from '@capacitor/browser';
await auth0.logout({
async openUrl(url) {
await Browser.open({ url });
}
});
diff --git a/docs/interfaces/RedirectLoginOptions.html b/docs/interfaces/RedirectLoginOptions.html
index 488f28a6..aa35020f 100644
--- a/docs/interfaces/RedirectLoginOptions.html
+++ b/docs/interfaces/RedirectLoginOptions.html
@@ -182,7 +182,7 @@ Hierarchy
Defined in
projects/auth0-angular/src/lib/interfaces.ts:6
@@ -429,7 +429,7 @@
- const client = new Auth0Client({
openUrl(url) {
window.location.replace(url);
}
});
+ const client = new Auth0Client({
openUrl(url) {
window.location.replace(url);
}
});
@@ -442,7 +442,7 @@
- import { Browser } from '@capacitor/browser';
const client = new Auth0Client({
async openUrl(url) {
await Browser.open({ url });
}
});
+ import { Browser } from '@capacitor/browser';
const client = new Auth0Client({
async openUrl(url) {
await Browser.open({ url });
}
});
diff --git a/docs/types/ApiRouteDefinition.html b/docs/types/ApiRouteDefinition.html
index d267650b..080d7af3 100644
--- a/docs/types/ApiRouteDefinition.html
+++ b/docs/types/ApiRouteDefinition.html
@@ -111,7 +111,7 @@ Type Alias ApiRouteDefinition
Defined in
projects/auth0-angular/src/lib/auth.config.ts:28
diff --git a/docs/variables/Auth0ClientService.html b/docs/variables/Auth0ClientService.html
index eaa0ac47..43cd4ad6 100644
--- a/docs/variables/Auth0ClientService.html
+++ b/docs/variables/Auth0ClientService.html
@@ -102,7 +102,7 @@ Variable Auth0ClientServiceConst
Defined in
projects/auth0-angular/src/lib/auth.client.ts:29
diff --git a/docs/variables/AuthConfigService.html b/docs/variables/AuthConfigService.html
index 07c51655..46b652b6 100644
--- a/docs/variables/AuthConfigService.html
+++ b/docs/variables/AuthConfigService.html
@@ -118,7 +118,7 @@
Use the Inject decorator to access the configuration
from a service or component:
- class MyService(@Inject(AuthConfigService) config: AuthConfig) {}
+ class MyService(@Inject(AuthConfigService) config: AuthConfig) {}
@@ -127,7 +127,7 @@
Defined in
projects/auth0-angular/src/lib/auth.config.ts:166
diff --git a/projects/auth0-angular/package.json b/projects/auth0-angular/package.json
index 99ad45eb..f09ac358 100644
--- a/projects/auth0-angular/package.json
+++ b/projects/auth0-angular/package.json
@@ -1,6 +1,6 @@
{
"name": "@auth0/auth0-angular",
- "version": "2.4.0",
+ "version": "2.4.1",
"description": "Auth0 SDK for Angular Single Page Applications (SPA)",
"keywords": [
"auth0",