Sending POST request of local image to Microsoft OCR API with Angular

Question

I have an Angular app and I want to send a local image from my device to Microsoft OCR API but I have this issue.

In onUpload() function it looks like this

let headers = new HttpHeaders({
      'Ocp-Apim-Subscription-Key': this.myKey,
      'Content-Type': 'application/octet-stream' });
    let options = { headers: headers };
    let data = this.imgURL
    this.http.post("https://southeastasia.api.cognitive.microsoft.com/vision/v1.0/ocr?language=unk&detectOrientation =true",data,options)
    .subscribe(
        (val) => {
            console.log(val);
        },
        response => {
            console.log("POST call in error", response);
        },
        () => {
            console.log("The POST observable is now completed.");
        });

When I try to log the 'this.imgURL' it returns "data:image/png;base64,iVBORw0KGg......."

I tested the request here and selected "application/octet-stream", it says the body should be [Binary Image Data]

The request returns '400'

code: "InvalidImageFormat" requestId: "1be37150-b8ea-4750-ad06-d12e76b3ac49" message: "Input data is not a valid image."