When I try to upload a base64 image inside my angular application, the http.post method throws an error:
Failed to execute 'setRequestHeader' on 'XMLHttpRequest': Value is not a valid ByteString.
This is what the code looks like:
let headers = new Headers();
headers.append("Accept", 'application/json');
headers.append("Content-Type", "application/json");
headers.append('User-Agent', 'Mozilla/5.0 (Windows NT 10.0; …) Gecko/20100101 Firefox/68.0' );
let postData = {
"AudometerCapture":this.abc,
"Door1":this.abc,
"Door2":this.abc,
"Door3":this.abc,
"Door4":this.abc,
"TransactionID": 90
}
this.http.post('http://apiearningwheels.sharpnettechnology.com/api/DailyImageUpload/UploadDailyImages', JSON.stringify(postData), {headers: headers})
.map(res => res.json())
.subscribe(data => {
console.log(data);
this.showLongToast("result is :- " + res);
});
i expect the output to be 'result is = '
but i get the error.
The request works correctly using Postman.
The error is thrown because there is a symbol for three dots (…) in the last header, which cannot be correctly converted to ByteString.
So you have to remove the line or change it like this:
headers.append('User-Agent', 'Mozilla/5.0 (Windows NT 10.0; …) Gecko/20100101 Firefox/68.0' );
to
headers.append('User-Agent', 'Mozilla/5.0 (Windows NT 10.0;) Gecko/20100101 Firefox/68.0' );
I tested the headers, using https://codesandbox.io/s/angular, and it threw me an error on that line: Cannot convert string to ByteString because the character at index 30 has value 8230 which is greater than 255.