angular-architects / module-federation-plugin

MIT License
683 stars 184 forks source link

Cors remoteEntry different domain #512

Closed carlosmarind closed 2 months ago

carlosmarind commented 2 months ago

hi.

I have one shell, and two microfronts behind, but this two are on different domains. when a load the remote entry ( loadManifest or setManifest) and the library load the remote entry, the http request throws an error because CORS. this http call its triggered internally by loadManifest or setManifest, so i cannot control the headers. The server its not a problem, because the call dont event reach it, the browser blocks the call before.

fetch('/assets/manifest/manifest.json?_v=' + Date.now(),{ headers: {"Access-Control-Allow-Origin": "*"} }) // Fetch the manifest avoiding cache .then((res) => res.json()) .then((definitions) => setManifest(definitions)) // Load the manifest and set it in the module federation , this its where cors error happens .then(() => import('./bootstrap').catch((err) => console.error(err)));

manifest.json

{ "mf1": "https://mf1-dev.mydomain-it.com/remoteEntry.js", "mf2": "https://mf2-dev.mydomain-it.com/remoteEntry.js" }

shell lives in https://shell-dev.mydomain-it.com/remoteEntry.js

manfredsteyer commented 2 months ago

You really need to tell the respective server to provide the headers. If the server side is never called, already the CORS preflight might fail.