Enable CORS for Azure Rest webapi application

Question

I have simple jQuery page that makes calls to azure restful API to get the status of VMs. I\'m facing a problem that it\'s complaining about Cross-Origin Resource Sharin

Answer 1

Okay, here is how to do it in short:

1. Add Function App (charge per request)
2. Open the Newly created function app
3. In Proxies, select that from the right list
4. Give it a name, route template will be your new endpoint URL, backend URL is your login endpoint eg: https://login.microsoftonline.com//oauth2/token
5. After that, back to your function app, select the platform feature tab, Select CORS, delete all of them and enter your application URL or simply a *

You can be more specific with these, but this is enough to get the token. And all the other endpoint didn't have CORS problem.

Good luck.

Answer 2

You cannot use a client secret from front-end Javascript. Your client secret will be public, it's basically your app's password.

Client credentials grant is for back-end applications.

You need to use e.g. the implicit grant flow with ADAL.JS/MSAL.JS to acquire tokens. Your front-end app also should be registered as Native since it is a public client.

Here is a sample app: https://github.com/Azure-Samples/active-directory-javascript-singlepageapp-dotnet-webapi

Oh, and the CORS error comes from Azure AD's token endpoint. You cannot do anything about it.