Heroko add-on SSO using Angular Auth0 SDK

Hello,

I have a working application written in Angular using the Angular Auth0 SDK.

Now, I want to create a Heroku addon that will also be able to access the application using Herokus SSO mechanism for addons. So basically I want to keep the standard login using Auth0 for standarrd users but also provide access to Heroku users via the addon.

The way Heroku addons work is that my service must provide a SSO endpoint where they post some credentials data and then they get redirected to my application fully authenticated.

I am trying to find the cheapest way to implement this feature, but I am struggling finding a proper way to do it.

One path I am studying is the following:

  1. When the heroku user is redirected to my service’s SSO endpoint I create a M2M JWT token with some metadata that will be used to determine who is this user, and that it is a heroku user.
  2. The POST endpoint will redirect to the same redirect endpoint as Auth0 normally does after authenticating, in the hope that Angular Auth0 will catch this call and threat it as if it was a standar auth0 login.
  3. Need to disable Angular Auth0 token auto-refresh mechanism to avoid a refresh that will fail.

So what do you think? is this achievable at all? for step 2 I did not find documentation on what data I should send in the call so I am studying the source code of the angular auth0 sdk but it would be nicer to have some document that specifies this.
For point 3 I have no idea yet on how to disable the auto-refresh only for the M2M tokens…

Any help, hints or directions would be hugely appreciated!.

Thanks.

Hi @manast,

Unfortunately, I’m not sure if the Auth0 Angular SDK would not be able to integrate with the flow you’re describing. Would the Auth0 Heroku integration work for your use case? Heroku Single Sign-On Integration

Hello Stephanie,

the Heroku SSO is something different, thats like any other integration such as LinkedIn, Facebook, Google, etc. In my case I need to implement the Heroku SSO flow for addons: Add-on Single Sign-on | Heroku Dev Center
which is actually pretty simple to implement, however I have already an app using Auth0 for authentication and I want to reuse as much as possible.

Oh, I see, so this is not about adding an authentication option for users, but rather adding authentication between your Angular app and the add-on you are developing. Is that correct?

yes, the addon is the app itself actually. So the difference is that for Heroku users, they buy the addon in heroku instead of inside my app, but then they can jump from their Heroku account directly into the dashboard of my app.

Ah, okay! Thank you for explaining that. I will have to do some research on this, and I will let you know what I find!

1 Like

Hi @manast,

I’m sorry for the delay in responding! I haven’t been able to find a solution for you quite yet, but I’ve asked my team for help. I’ll let you know of any suggestions they have!

Thanks, I appreciate any help I can get.

Hi @manast,

I got some feedback on your approach from an engineer here and it looks like you are on the right track.

  1. heroku SSO contract redirects to your app, which is M2M.
  2. you first validate the SSO handshake is valid (as described in Add-on Single Sign-on | Heroku Dev Center)
  3. once 2 is solid, you then generate an M2M token with metadata.
  4. the token is handed by to whatever app and that app does standard JWT verification.

The heroku SSO integration will have to point to a web app – with M2M creds. The web app does double duty:

  1. it can vet that the heroku SSO handshake is legit.
  2. it can mint tokens using its client credentials.

Thanks Stephanie for your thorough replay.

Just one follow up question regarding point 4, which is basically the last piece I need to solve the puzzle. Assuming I am using Auth0’s official angular SDK, how should I pass the token to it? I could not find how in the provided documentation for the module.

Unfortunately, I don’t believe you’d be able to leverage the Angular SDK for sessions initiated in this way. The app would have to manage the JWT validation for those users (which I realize is not ideal). I’m going to confirm this once more but to my knowledge, the Angular SDK only supports Authorization Code Flow with PKCE. These users would not be going through this flow, so the SDK would not be able to validate the user’s session.

yeah, the complication then is that I need to have 2 applications with two different login mechanisms.