构造的File对象,内容不正确, 最明显的就是文件大小只有几个字节

阅读 511
评论
    3 个回答

    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基类上也渐渐支持直接取出数据的方法了。

      是谁教你这种写法的?你想传入一个 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);
        
                //继续....
              })
          撰写回答

          登录后参与交流、获取后续更新提醒

          相似问题
          推荐文章