Breaking News: Grepper is joining You.com. Read the official announcement!

image url to file js

Lucas Juan answered on January 27, 2022 Popularity 10/10 Helpfulness 8/10

answer image url to file js

related convert data uri to image file javascript

image url to file js

Comment

const url = "https://cdn.shopify.com/s/files/1/0234/8017/2591/products/young-man-in-bright-fashion_925x_f7029e2b-80f0-4a40-a87b-834b9a283c39.jpg"
const fileName = url.substring(url.lastIndexOf('/')+1)

fetch(url)
   .then(response => response.blob())
   .then(blob => new File([blob], `${fileName}`, {
   		type: blob.type
	}))
   .then(file => {
   		setFileData(file);
   		setPreview(URL.createObjectURL(file));
	})

Popularity 10/10 Helpfulness 8/10 Language javascript

Source: stackoverflow.com

Tags: file image javascript url

Link to this answer
Share Copy Link

Contributed on Jan 27 2022

Lucas Juan

0 Answers Avg Quality 2/10

Closely Related Answers

convert data uri to image file javascript

Comment

this will convert a dataURI to a Blob:

function dataURItoBlob(dataURI) {
    // convert base64/URLEncoded data component to raw binary data held in a string
    var byteString;
    if (dataURI.split(',')[0].indexOf('base64') >= 0)
        byteString = atob(dataURI.split(',')[1]);
    else
        byteString = unescape(dataURI.split(',')[1]);

    // separate out the mime component
    var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0];

    // write the bytes of the string to a typed array
    var ia = new Uint8Array(byteString.length);
    for (var i = 0; i < byteString.length; i++) {
        ia[i] = byteString.charCodeAt(i);
    }

    return new Blob([ia], {type:mimeString});
}
From there, appending the data to a form such that it will be uploaded as a file is easy:

var dataURL = canvas.toDataURL('image/jpeg', 0.5);
var blob = dataURItoBlob(dataURL);
var fd = new FormData(document.forms[0]);
fd.append("canvasImage", blob);

Popularity 9/10 Helpfulness 5/10 Language javascript

Source: stackoverflow.com

Tags: data-uri data-ur

Link to this answer
Share Copy Link

Contributed on Jun 09 2022

Vast Vendace

0 Answers Avg Quality 2/10

image url to file js

Contents

More Related Answers

image url to file js

Closely Related Answers

convert data uri to image file javascript

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.