I am trying to GET a HTML page from my API using Angular with JWT tokens in the header. But if I don't specify the text type the compiler spits out a cannot parse error (it tries to parse the HTML as JSON then), so I need to specify my response type.
Here is my component.ts:
httpOptions = {
headers: new HttpHeaders({
'Content-Type': 'application/json',
'Authorization': 'Bearer TOKENHERE'
})
};
constructor(private http: HttpClient) { }
ngOnInit() {
}
fetchDashboard() {
this.http.get('http://localhost:3000/avior/dashboard', {responseType: 'text', this.httpOptions,}).subscribe(j => console.log(j));
}
}
I tried removing or changing the content-type to text/html without any avail.
My API Response:
<html><head><title>Dashboard</title></head><body><h1>Dashboard works!</h1></body></html>
I am trying to GET a HTML page from my API using Angular with JWT tokens in the header. But if I don't specify the text type the compiler spits out a cannot parse error (it tries to parse the HTML as JSON then), so I need to specify my response type.
Here is my component.ts:
httpOptions = {
headers: new HttpHeaders({
'Content-Type': 'application/json',
'Authorization': 'Bearer TOKENHERE'
})
};
constructor(private http: HttpClient) { }
ngOnInit() {
}
fetchDashboard() {
this.http.get('http://localhost:3000/avior/dashboard', {responseType: 'text', this.httpOptions,}).subscribe(j => console.log(j));
}
}
I tried removing or changing the content-type to text/html without any avail.
My API Response:
<html><head><title>Dashboard</title></head><body><h1>Dashboard works!</h1></body></html>
2 Answers
Reset to default 8I did it this way:
getDivisionName(x: string): Promise<any> {
return this.httpClient
.get<any>(this.serviceUrl + `/something/${x}/`, {
responseType: 'text' as 'json',
})
.toPromise();
}
You could try the following on in your component to see if your call works to another website. The following should return the html of the requested page as a string. If this does not work with your API then perhaps the problem is not your code in the component, but the response your API is returning
const requestOptions: Object = {
headers: new HttpHeaders().append('Authorization', 'Bearer <yourtokenhere>'),
responseType: 'text'
}
this.http.get<string>('https://cors-anywhere.herokuapp.com/https://stackoverflow.com/questions/tagged/angular',
requestOptions)
.subscribe(response => {
console.log(response);
}
);
httpCilentModulewill parse your request by default so you will have to specify the content type – Joel Joseph Commented Nov 19, 2019 at 9:54Content-Typeas a header, as per your previous comment. – Nicholas K Commented Nov 19, 2019 at 10:04