js根據路徑獲取本地檔案流資訊
阿新 • • 發佈:2019-01-09
案例:在系統中使用簽字筆產生的圖片直接傳到伺服器,不通過input上傳,本人是沒法獲取資料流,解決方案;使用圖片轉base64
程式碼如下:
var img = "http://127.0.0.1:8010/DrawImage.JPG";
function getBase64Image(img) {
var canvas = document.createElement("canvas");
canvas.width = img.width;
canvas.height = img.height;
var ctx = canvas.getContext("2d" );
ctx.drawImage(img, 0, 0, img.width, img.height);
var ext = img.src.substring(img.src.lastIndexOf(".")+1).toLowerCase();
var dataURL = canvas.toDataURL("image/"+ext);
return dataURL;
}
var image = new Image();
image.crossOrigin = '';
image.src = img;
image.onload = function (){
var base64 = getBase64Image(image);
console.log(base64);
}
console出來的,獲取到的base64串,base64可以直接作為圖片顯示的src
@@:一般專案都會涉及跨域問題,上面的圖片地址也涉及到了跨域,解析見下一篇(nginx解決跨域問題)