HTML5 formdata：從遠程服務器讀取圖像數據

有人知道，是否有可能將圖像從遠程URL讀取爲二進制文件。我知道File API讓我們有可能從我們的本地系統讀取二進制文件。但我找不到有關從遠程URL讀取的信息。也許我甚至可以從瀏覽器緩存中讀取這些信息，在我從這裏加載這些信息之後呢？HTML5 formdata：從遠程服務器讀取圖像數據

來源

2011-11-16 Владимир Дворник

我認爲這將解決您的問題，使您的網址作爲SRC的img標記。

function getBase64Image(img) { 
    // Create an empty canvas element 
    var canvas = document.createElement("canvas"); 
    canvas.width = img.width; 
    canvas.height = img.height; 

    // Copy the image contents to the canvas 
    var ctx = canvas.getContext("2d"); 
    ctx.drawImage(img, 0, 0); 

    // Get the data-URL formatted image 
    // Firefox supports PNG and JPEG. You could check img.src to 
    // guess the original format, but be aware the using "image/jpg" 
    // will re-encode the image. 
    var dataURL = canvas.toDataURL("image/png"); 

    return dataURL.replace(/^data:image\/(png|jpg);base64,/, ""); 
}

此功能是在Get image data in JavaScript?

發現使用它像

var img = new Image(); 
img.load = function(){ 
    var data = getBase64Image(this); 
}; 
img.src= "my IMAGE URL";

或使用您自己的img標籤從你的HTML

來源

2011-11-16 15:53:44 Niels

感謝您unsver，但它看起來像我不能使用函數toDataUrl如果我從遠程服務器加載img到畫布。和我想我有幾個變種解決這個問題： - 也許使用我自己的代理圖像 - 也許使用雅虎管道莫名其妙 –

HTML5 formdata：從遠程服務器讀取圖像數據

回答

相關問題