Problem context
- Our team is building an enterprise content management system.
- The content management system will include images that will need to be protected by user security.
- Most HTTP requests are protected using MSAL pattern described below: https://learn.microsoft.com/en-us/azure/active-directory/develop/tutorial-v2-angular-auth-code
- Most data-oriented HTTP API requests are properly guarded with JWT tokens attached to the HTTP request headers.
- We use ASP.NET CORE 6 for our web api.
Problem statement
Unfortunately, GET requests for images defined in Angular templates do not include the JWT tokens in the HTTP request header. Given the lack of JWT tokens, the webapi responds with 401 for all GET requests for images.
Questions
- Can Angular interceptors hook into GET requests defined in the template of the Angular component? Are there ways to “hook” an Angular GET request in the template of the Angular component so that it does properly include a bearer token?
