Angular: use POST instead of GET to retrieve third party API data (Error 400 url too long)

I am developing a little project to understand HTTP requests. For this, I am using a third party API that I call to.

Data Police API

My project has a library of all neighbourhood boundaries in lat and long coordinates. I use these boundary coordinates as a query to API for street level crimes (as mentioned in the document linked below).

Street Level Crimes

Example request:

getComments(): Observable<APIData[]> { return this.http.get<APIData[]> ('https://data.police.uk/api/crimes-street/all-crime?poly=52.268,0.543:52.794,0.238:52.130,0.478&date=2017-01'); }

There are some neighbourhoods that have exceedingly complex boundary coordinates, leading to extremely long URL requests due to query parameters. The document above mentions:

'The API will return a 400 status code in response to a GET request longer than 4094 characters. For submitting particularly complex poly parameters, consider using POST instead.'

How do you use the POST method to return API data to my front end webapp?

Continue reading...