0

I am trying to send a simple string as Queryparameter with a GET request in Angular 9. The string contains special chars like +

by example

  getString(stringParam: string): Observable<boolean> {
    console.log('api param', stringParam);
    let params = new HttpParams();
    params = params.set('stringParam', stringParam);
    return this.http.get<boolean>(`${URL}/param`, { params });
  }

the console log shows me PL + QP/2 but the query param is send like PL QP/2 in the headers.

So for some reason it drops the + (and probably some other chars also, not confirmed) And I got no clue why, does anyone has a lead on this? I tried playing with the URI encoding, but I did not succeed.

Thanks in advance.

Vanonckelen Dieter
  • 64
  • 8

1 Answers1

0

You can include the + character by percent-encoding it with encodeUriComponent(): https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/encodeURIComponent

The + character is a reserved character and is ofted used to replace spaces in a url: https://en.wikipedia.org/wiki/Percent-encoding

Here's an example comparing the two: https://stackblitz.com/edit/kbs-so-ng-reserved-character-url?file=src/app/app.component.ts

Debugging that character can be tricky because once removed some browsers will show a space as + character leading you to believe it's present when it's not in your case.

Kevin
  • 146
  • 5
  • Thanks for your effort, after some extra debugging I noticed that the URIComponent is not necessary, the param is encoded correctly without. BUT I noticed that the request URL was double encoded, Im still figuring that out. – Vanonckelen Dieter Aug 07 '20 at 07:39