How to call Azure REST api using javaScript in API Management -> Developer Portal -> Custom HTML Code widget?

Question

In API Management, i am customizing new Developer Portal. In that i created a New page and added a new Custom HTML Code widget, in this widget i wanted to call Azure REST Api to get all different version of all the APIs in a Product.

So how can i accomplish it?
How can i get access token to call Azure REST Api?

Answer 1

@Bhavin Thank you for reaching out to Microsoft Q&A. I am assuming that you follow docs: https://learn.microsoft.com/en-us/azure/api-management/developer-portal-implement-widgets#revise-runtime-view-model to implement a widget (TypeScript) and looking for help in calling Azure REST API with a token.

Sample code for calling a REST API is available in the widget link (adding here just in case you need)

1. To get access token from Azure AD, you need app registration client id and client secret and using client credential flow, you can fetch the token. We have a detailed docs: https://techcommunity.microsoft.com/t5/azure-paas-blog/protect-api-s-using-oauth-2-0-in-apim/ba-p/2309538 that can help you in setting this up and follow client credential flow (check our docs: https://learn.microsoft.com/en-us/azure/active-directory/develop/v2-oauth2-client-creds-grant-flow to understand more on the flow).
   2. Then use the token to call Azure REST API to get all API(s) and its versions for a product https://learn.microsoft.com/en-us/rest/api/apimanagement/current-ga/product-api/list-by-product?tabs=HTTP.

Sample CURL/HTTP command to use the token is available in docs: https://learn.microsoft.com/en-us/azure/active-directory/develop/v2-oauth2-client-creds-grant-flow#use-a-token

I hope this answers your question. Feel free to reach out if you have any questions. Please 'Accept as answer' and ‘Upvote’ if it helped so that it can help others in the community looking for help on similar topics.