Multiple SPA and APIs. Block SPA for a certain api

Get Help
,
1

I have a purely hypothetical situation, but I want to understand better why auth0 does not let you block a certain api for a certain spa with a simple on/off option.

Let’s say I have 2 SPA and 2 APIs, spa-a with api-a and spa-b with api-b. I don’t want want spa-a to be able to get a token for api-b, and spa-b to get a token for api-a.

If you go on the settings of the api you can set this kind of restriction for m2m but for spa and native you can’t. So, my question is, how does the PKCE flow help us in this kind of situations as per:
Single Page and Native apps do not require further configuration. They both can execute Authorization Code Flow with PKCE

I understand that we can add actions to block a client id for a certain api, and also have a list of whitelisted clients on the backend, but my question is purely related to this indication, how does PKCE help us in this way and why does auth0 consider that this kind of yes/no permission for spas and natives is not needed. I am just starting with authentication so I am sure that I am missing something.

Thank you!

3

Hi @danield20,

Welcome to the Auth0 Community and thank you for your post!

Your approach looks to be a valid one, since API calls can be made either from any application type.

However a difference here is that the API’s tab also provides the opportunity of enabling access to the Management API. Since SPAs are public clients and cannot securely store sensitive information (such as a Client Secret ), there are only a few endpoints available for these type of apps, mentioned in this documentation.

You’ve already pinpointed correct steps above:

but there are other options of allowing access to specific APIs:

  1. by going to the application’s settings - Advanced Settings - OAuth - Allowed APPs/APIs

Allowed Applications / APIs are applications that will be allowed to make delegation request. By default, all your applications will be allowed. This field allows you to enter specific client ids. You can specify multiple IDs by comma-separating them or one by line.

  1. using different tenants for the applications with their respective APIs could be another workaround.

As far the Authorization Code Flow with Proof Key for Code Exchange (PKCE) is concerned, this is the recommended flow for implementing authentication for native, mobile, or single-page apps. Since all these apps can not securely store a Client Secret PCKE helps exchange a code for an ID Token or an Access Token, but it does not directly help with calling APIs. However you can also check the Call Your API Using the Authorization Code Flow with PKCE.

I hope this helps and if you have further questions please let me know!
Best regards,
Remus

4

Thanks for taking the time to respond. I think the first option for the Allowed APPs/APIs is something that I was looking, although I do have some question.

Why is this under the apps advanced settings?

If I have 2 spas, and I put the client id for one here, will it block that spa from accessing all of the apis? That’s why I was thinking that this setting would make sense to be under the APIs settings.

Thank you,
Daniel

5

Hi @danield20,

Thanks for replying !

You are right in some way! If you populate those fields for both of your SPAs with the allowed APIs, then the other application will be blocked from making requests to other APIs listed under your tenant settings.

As for your mention:

You can always create a new topic under our Product Feedback page, so if it reaches multiple votes our engineers will consider making this change.

Hope this helped!
Thanks,
Remus