Current behavior
currently i host angular at firebase hosting which has 151.101.1.195 and my API is located at azure server that has IP 23.98.64.158
then i send POST request using the following lines in my angular v6.1.7
const req = new HttpRequest('POST', `${environment.ApiHost}api/do/something`, token, { headers: this.authenticationService.getAccessTokenHeader(), responseType: "text" });
return this.httpClient.request<any>(req);
it suppose to do a OPTIONS Request to my Azure API server at 23.98.64.158 then only POST but somehow it dit POST, OPTION and then POST. Looking at chrome devtool network tab, shows that my request went to firebase ip 151.101.1.195 for the first POST (which is shouldn't) but subsequent OPTION and POST request resolve to correct azure IP 23.98.64.158
this is my devtool Header General info i grab which show that it is posted to wrong Remote Address 151.101.1.195
Request URL: https://someazuresite.azurewebsites.net/api/do/something
Request Method: POST
Status Code: 504 Gateway Timeout (from ServiceWorker)
Remote Address: 151.101.1.195:443
Referrer Policy: no-referrer-when-downgrade
FROM INITIATOR:-
m | @ | zone.js.pre-build-optimizer.js:2969
-- | -- | --
| t.scheduleTask | @ | zone.js.pre-build-optimizer.js:407
| onScheduleTask | @ | zone.js.pre-build-optimizer.js:297
| t.scheduleTask | @ | zone.js.pre-build-optimizer.js:401
| e.scheduleTask | @ | zone.js.pre-build-optimizer.js:232
| e.scheduleMacroTask | @ | zone.js.pre-build-optimizer.js:255
| p | @ | zone.js.pre-build-optimizer.js:1114
| (anonymous) | @ | zone.js.pre-build-optimizer.js:3001
| N.o.(anonymous function) | @ | zone.js.pre-build-optimizer.js:1394
| (anonymous) | @ | http.js.pre-build-optimizer.js:1639
| e._trySubscribe | @ | Observable.js.pre-build-optimizer.js:42
| e.subscribe | @ | Observable.js.pre-build-optimizer.js:28
| e.call | @ | catchError.js.pre-build-optimizer.js:18
| e.subscribe | @ | Observable.js.pre-build-optimizer.js:23
| (anonymous) | @ | subscribeTo.js.pre-build-optimizer.js:21
| i | @ | subscribeToResult.js.pre-build-optimizer.js:11
| t._innerSub | @ | mergeMap.js.pre-build-optimizer.js:73
| t._tryNext | @ | mergeMap.js.pre-build-optimizer.js:68
| t._next | @ | mergeMap.js.pre-build-optimizer.js:51
| t.next | @ | Subscriber.js.pre-build-optimizer.js:55
| (anonymous) | @ | scalar.js.pre-build-optimizer.js:5
| e._trySubscribe | @ | Observable.js.pre-build-optimizer.js:42
| e.subscribe | @ | Observable.js.pre-build-optimizer.js:28
| e.call | @ | mergeMap.js.pre-build-optimizer.js:29
| e.subscribe | @ | Observable.js.pre-build-optimizer.js:23
| (anonymous) | @ | kg-fcm-setup.component.ts:64
then subsequent request pointed back to correct Azure IP
Request URL: https://someazuresite.azurewebsites.net/api/do/something
Request Method: OPTIONS
Status Code: 200 OK
Remote Address: 23.98.64.158:443
Referrer Policy: no-referrer-when-downgrade
Request URL: https://someazuresite.azurewebsites.net/api/do/something
Request Method: POST
Status Code: 500 Internal Server Error
Remote Address: 23.98.64.158:443
Referrer Policy: no-referrer-when-downgrade
Expected behavior
i should see only call OPTION and POST to https://someazuresite.azurewebsites.net/api/do/something and resolve to AZURE IP only Remote Address: 23.98.64.158:443 why did zone.js starts POST to the wrong firebase IP?
Minimal reproduction of the problem with instructions
What is the motivation / use case for changing the behavior?
Environment
Angular CLI: 6.1.5
Node: 8.12.0
OS: win32 x64
Angular: 6.1.7
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router, service-worker
Package Version
------------------------------------------------------------
@angular-devkit/architect 0.7.1
@angular-devkit/build-angular 0.7.1
@angular-devkit/build-ng-packagr 0.7.5
@angular-devkit/build-optimizer 0.7.1
@angular-devkit/build-webpack 0.7.1
@angular-devkit/core 0.7.5
@angular-devkit/schematics 0.7.5
@angular/cli 6.1.5
@angular/pwa 0.7.5
@ngtools/json-schema 1.1.0
@ngtools/webpack 6.1.1
@schematics/angular 0.7.5
@schematics/update 0.7.5
ng-packagr 3.0.6
rxjs 6.3.2
typescript 2.9.2
webpack 4.9.2
<pre><code>
Angular version: X.Y.Z
<!-- Check whether this is still an issue in the most recent Angular version -->
Browser:
- [x] Chrome (desktop) version XX
- [ ] Chrome (Android) version XX
- [ ] Chrome (iOS) version XX
- [ ] Firefox version XX
- [ ] Safari (desktop) version XX
- [ ] Safari (iOS) version XX
- [ ] IE version XX
- [ ] Edge version XX
```
For Tooling issues:
- Node version: v8.12.0
- Platform: windows 10 Version 10.0.17134 Build 17134
when I use the HttpClient, i set as a private object in the constructor and then use that object in my functions, in this way:
`constructor(private http: HttpClient) { }
request(token ) { return this.http.post(this.URLAPI/any, token); }`
Maybe this will be helpful.