zoukankan      html  css  js  c++  java
  • js 上传文件时对名称进行重命名

    最近在解决各种各样的浏览器兼容问题,遇到一个文件上传重命名的问题,就是在 IE上传不支持 new File

    查询MDN (  https://developer.mozilla.org/zh-CN/docs/Web/API/File/File  ) 发现其是一个构造器 创建新的FILe 对象实例;

    由于使用 input type="file" 获取的文件  File对象的name属性是只读的,所以想对其重名, 就考录根据input获取的Fil对象构造一个一模一样的新的FIle对象,并对其进行重名,所以采用的代码为:

      var Newfile = new File([u.file], refileName, {
              type: u.file.type
     });
    u.file为一个包含ArrayBufferArrayBufferViewBlob,或者 DOMString 对象的 Array — 或者任何这些对象的组合

    refileName为自己想重新定义的名字

    typeDOMString,表示将要放到文件中的内容的 MIME 类型。默认值为 "" 


    以上这种可以成功重名文件名,但是在IE上不支持,或报此对象不存在的错误;

    因 File 是继续于Blob的所以有以下一种解决办法:

    let File = window.File
    
    try {
      new File([], '')
    } catch(e) {
      File = class File extends Blob {
        constructor(chunks, filename, opts = {}){
          super(chunks, opts)
          this.lastModifiedDate = new Date()
          this.lastModified =+ this.lastModifiedDate
          this.name = filename
        }
      }
    }

    File不支持的话重写一下这个类,那么就在IE上就存在了File 这个类,然后就可以new了

    另外 还有一种解决方法,这个方法个人觉得是最好的,既可以兼容谷歌也可以兼容IE等其他浏览器

    let formData = new FormData();
    //data 为二进制的blob图片数据,//fileName 文件名
    formData.append('files',data,fileName);

    这样就可以完美解决了!

     

    作者:freddyhuang
    出处:https://www.cnblogs.com/freddyhuang
    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。

  • 相关阅读:
    招聘里常见的沟通能力到底是什么
    C++服务器linux开发环境管理
    网络游戏通信协议双向迭代加密
    win10控制台程序printf死锁问题
    手游系统逻辑档案之通信协议
    STL插入删除和查询测试
    MATLAB复制图片时边框大的问题
    2019网易笔试题C++--丰收
    暴力求解最长公共子串
    顺时针打印矩阵
  • 原文地址:https://www.cnblogs.com/freddyhuang/p/12743257.html
Copyright © 2011-2022 走看看