Comments (8)
Thanks for posting this @Schmaga! We recently upgraded our Angular Quickstart with the shareReplay
method as well. Here's our take on a great AuthService
: https://auth0.com/docs/quickstart/spa/angular2/01-login#add-an-authentication-service
from auth0-spa-js.
This is a duplicate of my post from the auth0 community forum, but I hope it might help someome:
I think I might have found the problem. Because of the observables and multiple subscriptions, there might have been concurrency issues or multiple instances of the Auth0Client. I got rid of the error by doing it this way:
Create the client as shared observable in a similar way like you proposed in your updated angular quickstart:
private auth0Client$ = (from(createAuth0Client(this.config))).pipe(
shareReplay(1), // Every subscription receives the same shared value
);
And using it using a piped observable.
isAuthenticated() {
return this.auth0Client$.pipe(switchMap(client => {
return from(client.isAuthenticated());
}));
}
This has solved the error for me.
from auth0-spa-js.
@luisrudge I've seen that! And I got to say that this is a waaaay better AuthService
than the one before 👍
(By the way, I did not run onto this thread issue)
from auth0-spa-js.
This is probably happening because the iframe was already closed 🤔 Can you inspect dev tools and see if you're sending two requests to the /authorize endpoint?
from auth0-spa-js.
I've got the same problem, and there are 2 requests sent to /authorize
.
from auth0-spa-js.
Same problem, two requests. Happens only if you refresh a page after sign-in (I'm using Auth0 with Angular SPA), without refreshing it works fine and sends just one request.
from auth0-spa-js.
@gosuhiman @rkuprin Is it possible that you have two instances of the client? can you build a repro to help me identify why are you seeing two requests?
from auth0-spa-js.
Same problem if you write code like this:
class Auth {
getAuthClient = () => new Promise((resolve) => {
if (this.auth0Client) {
return resolve(this.auth0Client);
}
return resolve(createAuth0Client({
domain: DOMAIN,
client_id: CLIENT_ID,
connection: DATABASE,
audience: AUDIENCE,
redirect_uri: ORIGIN,
}).then(auth0Client => resolve(auth0Client)));
});
getUserInfo = async () => {
const auth0Client = await this.getAuthClient();
return auth0Client.getUser();
}
}
If you call getUserInfo
in several places in your project, after refreshing page, it will invoke function createAuth0Client
several times.
In function createAuth0Client
, it will call getTokenSilently
. That is, if you invoke createAuth0Client
multiple times, it will use a same iframe window(not sure). Once a tread called close, the other thread will fail.
So I changed the code to this:
class Auth {
constructor() {
this.setUp();
}
setUp = async () => createAuth0Client({
domain: DOMAIN,
client_id: CLIENT_ID,
connection: DATABASE,
audience: AUDIENCE,
redirect_uri: ORIGIN,
}).then((auth0Client) => {
this.auth0Client = auth0Client;
});
getAuthClient = () => new Promise((resolve) => {
const checkAuth0Ready = setInterval(() => {
if (this.auth0Client) {
resolve(this.auth0Client);
clearInterval(checkAuth0Ready);
}
}, 500);
setTimeout(() => clearInterval(checkAuth0Ready), 10000);
});
getUserInfo = async () => {
const auth0Client = await this.getAuthClient();
return auth0Client.getUser();
}
And it doesn't throw exceptions now.
from auth0-spa-js.
Related Issues (20)
- "Misconfiguration in the system or a service outage" error in Auth0 HOT 3
- prompt in authorizationParams is not getting override. It is coming none even if it is set to other value like login. HOT 7
- Sophos Cyber Security Endpoint detects ransomware in the package HOT 3
- Total Cookie Protection breaks auth HOT 2
- Better error messaging when out of local storage quota? HOT 4
- Angular SSR window.crypto HOT 1
- User without Organization Membership caused infitine login redirect loop HOT 2
- NullInjectorError HOT 1
- Use '.well-known/openid-configuration' to configure Auth0Provider (Auth0Client) calls HOT 6
- Clarify limits for checkSession method HOT 7
- React Quickstart causing error upon clicking the login button HOT 2
- organization option of Auth0Client.getTokenSilently function is unexpectedly reuse previous value HOT 4
- Make getTokenSilently Generic HOT 2
- Support `getAccessTokenSilently` for multiple audiences in parallel HOT 4
- auth0-spa-js for multipage app? HOT 3
- Suport for multi tab sessions HOT 5
- Add configuration option for custom transaction storage
- LoginWithPopup doesn't work in Microsoft Word add-in on Mac HOT 3
- Extra redirect on silent login after upgrade to v2 HOT 9
- Implicit return in auth0-spa-js/src/cache /cache-manager.ts when TS "noImplicitReturns" is set to true HOT 4
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from auth0-spa-js.