Angular httpClient

Question

My problem is that I get this error when using httpClient from angular:

ERROR DOMException: Failed to execute 'open' on 'XMLHttpRequest': Invalid URL
    at https://localhost:xxxx/polyfills.js:5749:31

Code for http request in angular:

return this.httpClient.post<any>(host + '/isam/oidc/endpoint/amapp-runtime-oidcidp/token', body, {
      headers: new HttpHeaders().set('Content-type', 'application/x-www-form-urlencoded')
    });

But if I am using fetch is working:

fetch(host + '/isam/oidc/endpoint/amapp-runtime-oidcidp/token', {
        method: 'POST',
        credentials: 'include',
        body: 'xxxxxx',
        headers: {
          'Content-Type': 'application/x-www-form-urlencoded',
          'Accept': 'application/json'
        }
      })
        .then(res => { res.json(); console.log(res); })
        .then(myJson => { console.log(myJson) })

I am doing everything from localhost for now. If you can help me please to find what I am doing wrong with httprequest.

Thank you

How do you call your http request method? You usually have to subscribe to it — Ling Vu, Feb 13 '20 at 12:48
I posted how I make the http request above, but is not the problem to the subscribe, is breaking when I use httpclient post — Alex Alexa, Feb 13 '20 at 12:50

score 0 · Answer 1 · answered Feb 13 '20 at 13:04

0

I think that the problem is maybe in your headers. Can you put it like this

{ headers: new HttpHeaders({ 'Content-Type': 'application/x-www-form-urlencoded'}) }

answered Feb 13 '20 at 13:04

cvekaso

833
1
11
28

same, request is not even made – Alex Alexa Feb 13 '20 at 13:07
1

solved it, i made a mistake on environment variables, sorry about this . Fetch worked because I am not using http client from angular and i set that value hardcoded there – Alex Alexa Feb 13 '20 at 13:21
Glad that you figure out :) – cvekaso Feb 13 '20 at 13:33

score -1 · Answer 2 · answered Feb 13 '20 at 12:53

-1

https://localhost:xxxx

This is an invalid URL (just like the error message says).

If you have a : after the hostname, it must be followed by a port NUMBER (and then the path). xxxx is not a number, it is four letters.

answered Feb 13 '20 at 12:53

Ling Vu

4,740
5
24
45

is a number, I just put xxxx because can be anything. four letters? – Alex Alexa Feb 13 '20 at 12:54
I would propose to console log the url right before you send the request. Like: `console.log(host + '/isam/oidc/endpoint/amapp-runtime-oidcidp/token')` and check if it is a valid url – Ling Vu Feb 13 '20 at 12:57
url is ok, same as when I am using fetch – Alex Alexa Feb 13 '20 at 13:00
Can you paste your `package.json` into the question? The request looks fine to me. If it is not the url then it might be some version issues. – Ling Vu Feb 13 '20 at 13:01
angular 7.2.3 is the version. If I would can to subscribe to fetch would be great, that why I am trying to switch to http from angular – Alex Alexa Feb 13 '20 at 13:05

Angular httpClient

2 Answers2