API call not working from Angular 8 micro-front end app

[SB17]

I have created a root-config using the create-single-spa CLI. This runs on port 9000. The npm script section for the root application is: "scripts": { "start": "webpack-dev-server --mode=development --port 9000 --env.isLocal=true", "lint": "eslint src", "test": "jest", "prettier": "prettier --write './**'", "build": "webpack --mode=production" }

Furthermore, I created a angular 8 micro-front application using single-spa-angular. This runs on port 4200. The npm script for this micro-front end application is: "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e", "build:single-spa": "ng build --prod --deploy-url http://localhost:4200/", "serve:single-spa": "ng serve --disable-host-check --port 4200 --deploy-url http://localhost:4200/ --live-reload false" }

The micro-front end application is registered in the root-config as: registerApplication( "lego1", () => System.import("lego1"), location => location.pathname.startsWith('/lego1') );

and has {provide: APP_BASE_HREF, useValue: '/'} set inside its app.module.ts.

The micro-front end application loads/mounts correctly when I traverse to http://localhost:9000/lego1/questionnaire (questionnaire is a component in my angular 8 app).

Problem:

I am not able to get an API call working from angular 8 micro-front app. The asp.net core web api is hosted at: http://localhost:21021/

The http.get call looks like:

this.http.get<any[]>(​http://localhost:21021/api/services/app/Question/GetAll/);

However, this call fails with HttpErrorResponse: HttpErrorResponse {headers: HttpHeaders, status: 404, statusText: "Not Found", url: "http://localhost:9000/lego1/%E2%80%8Bhttp://localhost:21021/api/services/app/Question/GetAll/", ok: false, …}

Note that the API call is getting appended with the url of the root-config app "http://localhost:9000/lego1/%E2%80%8B" which leads to a 404.

Can you please advise what needs to be done for this to work?

[joeldenning]

This appears to be a bug specific to your code. I created this branch of coexisting-angular-microfrontends) that shows that this.http.get('') works with full urls.