0
votes

I have a microfrontend running on port 4200, and the other one on 4201. I tried splitting up the translation files and would like to load both of the applications translations, so I wrote a custom loader that is making an http request to port 4201:

export const scope = function(http: HttpClient) {
  const loader =  ['en', 'de'].reduce((acc: any, lang: string) => {
    acc[lang] = () => firstValueFrom(http.get(`http://localhost:4201/assets/i18n/fields/${lang}.json`));
    return acc;
  }, {});
  return {scope: 'fields', loader: loader}
};

@NgModule({
  declarations: [RootComponent],
  imports: [
    CommonModule,
    RootRoutingModule,
    FormsModule,
    SharedModule.forRemote(environment),
    TranslocoModule
  ],
  providers: [
    {
      provide: TRANSLOCO_SCOPE,
      deps: [HttpClient],
      useFactory: scope
    }
  ]
})
export class RootModule { }

Both applications are javacript frontends, hence CORS blocks it. How can I ignore cores in the frontend?

You cannot "ignore" CORS. It's fundamental browser security.Pointy
@E.Maggini , No.Stefan
Just add the correct accept headers to the server that's serving up your destination data.Lissy93