Azure API Management - How to secure Subscription key

1
votes

Technical stack

  • API deployed in WebApp
  • API Management deployed and WebApp is configured as Web service URL.
  • UI developed in Angular application which calls API Management endpoints to display data on UI.
  • IP Authentication is implemented to make sure only allowed users has access to UI & API
  • Subscription is enabled at Product level and key is shared with client for API call
  • Separate product is created for UI and subscription key is used in UI to call API and display data

Now in this case, subscription key will be visible thru Browser -> Inspect -> Network tab

We want to make sure that user can't use UI key to make API call Using Proxy will hide the key but now anyone can call proxy url to get data.

How to make it secure?

enter image description here

3
angularsecurityazure-web-app-serviceazure-api-management
If you don't want to expose the subscription key from the client-side, avoid to call that API from there. I suggest to you to add a new ajax method in your server-side that will call that API and then return the response; in that way from client-side can't see the API call at all. If you want, you can add a policy limit from the APIM to restrict the caller IP of your API or Product. – nmbrphi
Thanks nmbrphi for your reply. So here you are talking about proxy, still my purpose is not resolved here. In this case, now anybody can call API and get data as now key is now encapsulated in ajax api call. I want to identify somehow that call is from UI or from anywhere else. user_agent, origin, x-referer all can be manipulated during API call. – Manish Joisar
Maybe with cross-domain policies? You can set the urls of the allowed ordigins for the API product for your UI project. docs.microsoft.com/en-us/azure/api-management/… – nmbrphi
Thank nmbrphi for your reply. CORS policy already implemented, problem is with UI API + UI Key can be call directly from another API, how to secure is a question – Manish Joisar
You can't. If you require the token for authentication, it is going to be visible. Even secure sites can't stop a username/password from being visible to the user through the browser tools. You have to either rethink your authentication or live with your solution. – garethb

3 Answers

1
votes

Did you find any solution ? I used nginx as proxy server and kept subscription key there as proxy_set_header subscription-key abc-def when calling microservice. This way subscription key wont be exposed to UI and will be forwarded to API Management Service via nginx.

0
votes

Store your keys on Azure Key vault and access from your front end application, https://medium.com/@ayanfecrown/azure-key-vault-node-js-step-by-step-tutorial-af131a78e220

-2
votes

As mentioned by nmbrphi, garethb, we can't control what end user see in browser network tab.

And as we do not have user authentication available in system and only have IP authentication, can't control usage of UI key directly from API.

To make sure we have more secured UI call, we have implemented custom logic which can be used for any javascript application

Reference http://billpatrianakos.me/blog/2013/09/12/securing-api-keys-in-a-client-side-javascript-app/

This helped me to at least distinguish UI calling API and API directly called from other application/tools like postman.

Thanks all for your help.