Announcing the General Availability of the Auth0 SPA JS SDK

Auth0 has a new JS SDK for securing single page applications (SPAs) with best practices.

Learn more about the JavaScript SDK here.

Post brought to you by @sam.julien :man_technologist:t2:

2 Likes

This looks really great, kudos to the team! So, how would you go about getting a token for a different audience with the new SPA SDK? Like, if you need to be able to talk to more than one API?

Is the tutorial for end-to-end testing using Cypress with Auth0 (End-to-End Testing with Cypress and Auth0) still relevant with this SDK?

1 Like

Hey there @le.minh.pham.hoang!

Let me reach out to the team responsible for the SDK to ask that!

1 Like

@robertmclaws2k

See the example here:

$('#getTokenPopup').click(async () => {
  const token = await auth0.getTokenWithPopup({
    audience: 'https://myapi/',
    scope: 'read:something
  });
});

Note that Auth0 doesn’t support multiple audiences for one access token though. An access token is only meant for one backend/API.

1 Like

Hey there again @le.minh.pham.hoang!

Unfortunately the tutorials are not yet up to date with the new SDK but we’re working on getting them ready!

3 Likes

FYI for anyone visiting this topic, we have two new FAQs for auth0-spa-js:

1 Like

For those of us still sadly still needing to support IE 11, any advice ? I’ve spent 3 days with Babel, Browserify etc trying to get the new SDK to work. I’m reverting back. Maybe at least add some minimum browser requirements to the FAQ. Thanks.

FWIW there is a PR currently open in the repo to fix this

any update on this by any chance?

Hey there @echee!

As Luis created the PR, I’m sure it will be reviewed and merged soon!

That’s great news. A lot of corporate clients still use IE believe it or not. Will you announce when it is released ?

Sure! Will let u know as soon as the PR gets merged!

Hi all,

I see the parseHash method doesn’t exist anymore, instead, there is a new method called handleRedirectCallback.

With auth0.js (v9) the parseHash method returns: accessToken, idToken and expiresIn.
But, the new handleRedirectCallback method doesn’t return anything.
Instead, we need to call getTokenSilently that return accessToken
So, what is the best way to request the idToken and expiresIn?.

Hi @bruno-caravelo, welcome back to the forum!

You can get the id_token using the getUser call (docs here).

As for expires_in, there is the access_token.exp claim that comes back with the token, and expires_in is equivalent to access_token.exp + now.

However, you shouldn’t need it anymore – the SDK will hit Auth0 and see if there is a valid token and return it, otherwise it will prompt the user to log in again. It will also cache a valid token for you in memory. Auth0.js didn’t do all this, so you needed to manually check for expiration and renew the token. With the new SPA SDK, you don’t need to do that. :tada:

By the way, we now have a migration guide for moving from auth0.js to auth0-spa-sdk.

Hope that helps!

Cheers,
Sam Julien

Hi @sam.julien ,

Thanks for the information!

Thank you for the questions @bruno-caravelo – I’ve added these two FAQs based on your feedback!

2 Likes

Hi @konrad.sopala! Are there any updates on the “end to end testing with cypress and auth0” tutorial? Thanks :slight_smile:

Not sure about that @Rosoll

Will reach out to appropriate team and find out. Will get back to you shortly!

1 Like

Hey there!

Managed to get some info back. No ETA for now, the team is currently evaluating their backlog and will know soon what priorities they will have.

1 Like