creating an image file object from an image web url

Question

I would like to take an image's URL and use that to get the image file object and send it to my server. i have looked around and have gotten this far but the code does not work properly. When i send it to my server it does not upload as an image file but simply uploads as a file without the .JPG extension or any image file extension.

    var byteNumbers = new Array(this.imgUrl.length);

    for (var i = 0; i < this.imgUrl.length; i++)
    {
        byteNumbers[i] = this.imgUrl.charCodeAt(i);
    }

    this.img = new File(byteNumbers, "imgFromUrl", { type: "image/jpeg" });  

This gets the file and shows me the file details on my log such as lastmodified, filename and such. but when i upload it to my server i just get a file with no extension as mentioned above.

The file is being uploaded by being attached to a form and sent to the server.This is because i'm sending other data as well.

this.http.post(this.serverUrl + "face/detect/", data, { headers: this.headers })
          .toPromise()
          .then(response => response.json())
          .catch(error => error);

Answer 1

You would need to specify the extention in the file name

 var byteNumbers = new Array(this.imgUrl.length);

    for (var i = 0; i < this.imgUrl.length; i++)
    {
        byteNumbers[i] = this.imgUrl.charCodeAt(i);
    }

    this.img = new File(byteNumbers, "imgFromUrl.jpg", { type: "image/jpeg" }); 

Tell me if this solves the problem.