Is it feasible to dynamically add specific headers to a single page within an Angular SPA...

I'm concerned that since Angular's routing is handled client-side, this might not be directly possible or is it?

I attempted to add headers on my local Angular server as follows:



"options": {
"headers": {
"Cross-Origin-Embedder-Policy": "require-corp",
"Cross-Origin-Opener-Policy": "same-origin"
}
}


This resulted in CORS errors for all app resources loading from different origins. Given that Angular routers operate client-side, I'm exploring options to achieve server-side rendering for a specific single page. I need to apply the above headers to that path both locally and when deploying with Cloudflare.

Continue reading...