Azure App Proxy API

[Surry44]

Not an issue as such and I have seen some of your posts elsewhere. We are trying to use this with a AAD secured API published with Azure App proxy (which has little CORS support) and dont appear to support OPTIONS call.

I have seen some other posts from you about avoiding options call by using basic headers but this doesnt seem to be working for me. Is that still possible? Is it possible with this solution?

I tried using an azure function in function mode as a proxy in front of App proxy API and whilst I can avoid the initial CORS issue by setting the Azure Function CORS policy there is a second call to login @ microsoft which has an origin of "null" and fails.

Any chance you can confirm if you have a working method for SPFX which could support the above scenario - if at all possible using AADHTTP etc as per this project.

Great work and thanks for sharing BTW.
J

[s-KaiNet]

Hi,
what do you mean by "there is a second call to login @ microsoft which has an origin of "null" and fails"? Technically, if Azure Proxies don't have any CORS settings, then intermediate Azure function between SPFx and Azure Proxy should just work.

[Surry44]

So this is a brief summary (ish) of what we have:

1. • Setup of Azure App Proxy
2. • On prem API published with Azure AD app proxy as per:
3. • https://docs.microsoft.com/en-us/azure/active-directory/manage-apps/application-proxy-secure-api-access

Create App to be called by SPFX web part and API Permissions \ Add permission for user_impersonation for API my org uses \ Azure Appy proxy application. Granted for all users in tenant.

Setup of Azure function app - as proxy to Azure App proxy

1. • Create Azure Function
2. • Proxy mode add
3. • no authentication configured
4. • CORS settings - added ourtesttenant.sharepoint.com as entry

Going to function proxy URL results in redirect to Azure App proxy published API - redirect to login screen and successful auth shows result from API correctly.

Clone this repo - Update helloworldwebpart

1. Update client.get url = Azure function proxy URL
2. aadhttpclientfactory.getclient update app ID to client app ID same app as below.
3. updatepackage-solution, resource = display name of Azure AD application with permission to App Proxy API

Upload to app catalog
Approve permission request under API management

If I run chrome with disable cors (--disable-web-security clearly not an option for production) it works and response from on premises API can be seen (written to console.log) to prove the theory. I see a single request 302 get to the function url and then successful response from the Azure App Proxy url after some login.microsoft response redirects.

When using a normal browing session I see an initial 200 to the function app URL OK, then 2 x GET with 302 Found responses. with no requests to the azure app proxy domain at all, and the following in the console log:

Access to fetch at 'https://login.microsoftonline.com/.... (redirected from 'Azure Function URL here') from origin 'null' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Thanks!

[s-KaiNet]

I have a feeling that your Azure App proxy has incorrect authentication. Have you configured Azure AD authentication for App proxy?

[Surry44]

Hi still been fighting with this.
I have tried this with the Azure Function App proxy configured for Azure AD authentication, where I then granted the associated Azure AD application registration permission to call the API (user_impersonation scope) and then in SPFX code used the same App ID and URL of the Azure Function App proxy app. Both result in the CORS issue:
Chrome Console error:
Access to fetch at 'https://login.microsoftonline.com/1ad8a95.....etc' (redirected from 'https://myfunctionappproxyURL.azurewebsites.net/SPFX') from origin 'https://tenant.sharepoint.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

If I paste the full URL of that error into the browser I am authenticated and the on premises API response is served - the on premises API currently just returns the logged in username and this shows correctly so that shows azure ad auth is successful its just how I avoid this CORS issue...

Any help greatly appreciated I would happily write up and article on getting this working. Using the Azure Application proxy to publish on premises API and consume via SPFX must have many use cases I just cant find it documented anywhere. Only here with a native app sample: https://docs.microsoft.com/bs-latn-ba/azure/active-directory/manage-apps/application-proxy-secure-api-access

Thanks again