js代码:
var url = 'http://cdn.wangyuanqi.com/ava...'
// 构造新File对象
var aafile = new File([url], "aa.jpeg");
js代码:
var url = 'http://cdn.wangyuanqi.com/ava...'
// 构造新File对象
var aafile = new File([url], "aa.jpeg");
是谁教你这种写法的?你想传入一个 URL 然后获得这个 URL 所代表的 File 对象?那你方向完全是错的。
new File(['第一行', '第二行', '第三行'], '文件名');
这么构建出来的只能是一个文本文件(可以理解为 .txt),其中第一个参数表示这个文本文件每一行的内容。
你那个 size: 9
实际就是你传进去的 abff
变量的文本值字节长度。
//传入图片地址,获取图片Base64数据
function getBase64ByImgUrl(url, callback){
var canvas = document.createElement('canvas'),
ctx = canvas.getContext('2d'),
img = new Image;
img.crossOrigin = 'Anonymous';
img.onload = function(){
canvas.height = img.height;
canvas.width = img.width;
ctx.drawImage(img,0,0);
var dataURL = canvas.toDataURL('image/png');
// console.log('base64-dataUrl: ', dataURL);
callback(dataURL);
canvas = null;
};
img.src = url;
}
//将base64转换为文件流
function getFileByBase64(dataurl, filename) {
var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
while(n--){
u8arr[n] = bstr.charCodeAt(n);
}
return new File([u8arr], filename, {type:mime});
}
var url = 'http://cdn.wangyuanqi.com/avat.png';
getBase64ByImgUrl(url, function(dataURL){
//传入base64数据和文件名字
var fileFlow = getFileByBase64(dataURL,'avat.png');
console.log('fileFlow: ', fileFlow);
//继续....
})
13 回答13.1k 阅读
7 回答2.3k 阅读
3 回答1.4k 阅读✓ 已解决
6 回答1.5k 阅读✓ 已解决
2 回答1.5k 阅读✓ 已解决
3 回答1.5k 阅读✓ 已解决
2 回答1.2k 阅读✓ 已解决
File构造函数第一个参数我记得好像是Blob片段或者ArrayBuffer片段的数组吧。。如果传的是字符串,js虽然使用的是UTF16,但是好像依旧会转成是UTF8编码的字符二进制数据。
返回的这个File实例,实际上,只是内存里的一段缓存数据,前端浏览器好像也没有写硬盘的权限,缓存不下来。
你想通过url来加载文件,本地的话,只能通过input来让用户手动选择文件,js是没有权限直接去指定本地url取东西的。
远端文件,就通过XMLHttpRequest或者fetch api这种原生api或者其他ajax库去请求回来就行,指定返回类型是blob,你就直接可以取到Blob。然后你可以把Blob转成File。
这些ArrayBuffer,Blob,File本质上,都可以理解为,指代实际文件的对象。
区别就是,ArrayBuffer转成TypedArray用来进行操作,Blob就是二进制,File继承自Blob,一般指代文件。
以前读取Blob内容只能用FileReader,现在Blob基类上也渐渐支持直接取出数据的方法了。