DEV Community

Angular + Module Federation remote import modules πŸ‘·β€β™€οΈ

Julie Gladden on August 11, 2023

When implementing Module Federation in Angular (specifically using the library @angular-architects/module-federation) you need to be careful of wha...
Collapse
 
lakshma_reddy_b144df153c7 profile image
LAKSHMA REDDY

Hi,Β 
I have two interceptors where I have to invoke the remote app interceptor if I make any API call from the remote app, but it's not invoking. In my remote app, I have a module called remote module. Since I have added interceptors in providers, I am able to call the remote app from the host application, but remote interceptors are not calling.Β can you give any suggestion

Collapse
 
juliegladden profile image
Julie Gladden

Hi! Do you think you could give me some more details?

From what I can tell so far, and correct me if I'm wrong:
You have host interceptors that are global, that are intercepting for both the host and remote.
The remote also has its own interceptor, but it's not intercepting?

Collapse
 
javier_marcoshuayaneyal profile image
Javier Marcos Huayaney Ale

I'm using Angular 19 and Native Federation, and I'm experiencing the same issue that has been reported. My shell has provideHttpClient, and my remote project also has provideHttpClient. I'm using an interceptor in my remote; the interceptor works correctly when I access the remote project independently, but when I access it through the shell, the interceptor no longer executes.

Collapse
 
mxvoloshin profile image
max

Yep, I have the same issue I have a remote interceptor but it's not executing.

Thread Thread
 
juliegladden profile image
Julie Gladden

Hey, Max. If you give me some more details I might be able to help. Do you have the HttpClientModule imported in your remote?

Thread Thread
 
mxvoloshin profile image
max

Hey. Yes, so technically I have a Shell application and the MFE application. Shell application consumes it's own API, MFE application consumes it's own API. So I want the MFE application has it's own HttpClientModule and interceptor for authentication, but when I implemented it, it's not getting called but instead it's using the HttpClient from the Shell application every time I'm trying to do anything.

Thread Thread
 
juliegladden profile image
Julie Gladden

Are you sharing dependencies for @angular/common/http in your webpack.config.ts in both the shell and remote?

Thread Thread
 
mxvoloshin profile image
max

sorry, missed your reply.
Yes, both my shell and mfe applications have this in the webpack.config
shared: {
...shareAll({ singleton: true, strictVersion: true, requiredVersion: 'auto' })
}

Thread Thread
 
naresh_kumar_cd5cc6ccf827 profile image
Naresh kumar

Hi, I have the same problem. Where you able to get it working?

Thread Thread
 
davegamboa99 profile image
DaveG

Hello, were you able to solve this? Currently facing this issue in my mfe right now. I also tried setting the singleton: false for the @angular/common/http. Yet still the interceptor from the mfe is still not working.

Thread Thread
 
lakshma_reddy_b144df153c7 profile image
LAKSHMA REDDY

I have fixed this by adding shell interceptor in your shell FeatureModule