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为一个包含ArrayBuffer,ArrayBufferView,Blob,或者DOMString对象的Array— 或者任何这些对象的组合
refileName为自己想重新定义的名字type:DOMString,表示将要放到文件中的内容的 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);
这样就可以完美解决了!
js 上传文件时对名称进行重命名的更多相关文章
- 百度编辑器ueditor批量上传图片或者批量上传文件时,文件名称和内容不符合,错位问题
百度编辑器ueditor批量上传附件时,上传后的文件和实际文件名称错误,比如实际是文件名“dongcoder.xls”,上传后可能就成了“懂客.xls”.原因就是,上传文件时是异步上传,同时进行,导致 ...
- 使用ajaxfileupload.js上传文件
一直以来上传文件都是使用form表单上传文件,也看到过有人使用js上传文件,不过看起来蛮简单的也就没有怎么去理会.今天突然要使用这种方式上传文件,期间还遇到点问题.因此就记录下来,方便以后遇到这样的问 ...
- IE8上传文件时文件本地路径变成"C:\fakepath\"的问题
转自:http://yunzhu.iteye.com/blog/1116893 在使用<input id="file_upl" type="file" / ...
- IE浏览器上传文件时本地路径变成”C:\fakepath\”的问题【转】
转自:http://www.iefans.net/ie-shangchuan-bendi-lujing-fakepath/ 在使用<input id="file_upl" t ...
- IE浏览器上传文件时本地路径变成”C:\fakepath\”的问题
在使用<input id="file_upl" type="file" />控件上传文件时,有时会需要获取文件本地路径展示给客户,这时可以通过这样的 ...
- JS 上传文件 Uploadify 网址及 v3.2.1 参数说明
http://www.uploadify.com/ 一.属性 属性名称 默认值 说明 auto true 设置为true当选择文件后就直接上传了,为false需要点击上传按钮才上传 . buttonC ...
- js上传文件带参数,并且,返回给前台文件路径,解析上传的xml文件,存储到数据库中
ajaxfileupload.js jQuery.extend({ createUploadIframe: function(id, uri) { //create frame var frameId ...
- django + dropzone.js 上传文件
1.dropzone.js http://www.dropzonejs.com/ dropzone.js是一个可预览\可定制化的文件拖拽上传,实现AJAX异步上传文件的工具 2.dropzone.js ...
- js上传文件
一.原始的XMLHttpRequestjs上传文件过程(參考地址:http://blog.sina.com.cn/s/blog_5d64f7e3010127ns.html) 用到两个对象 第一个对象: ...
- winScp上传文件时,如何过滤制定文件
在用winScp上传文件时,有些文件不想上传到服务器上.怎么办呢? 比如我希望过滤.svn .git文件和目录怎么操作呢? 第一步:在菜单上选中选项,点击选项. 第二步,点击传输->编辑 第三步 ...
随机推荐
- 聊一聊 .NET Dump 中的 Linux信号机制
一:背景 1. 讲故事 当 .NET程序 在Linux上崩溃时,我们可以配置一些参考拿到对应程序的core文件,拿到core文件后用windbg打开,往往会看到这样的一句信息 Signal SIGAB ...
- win10将python打包成apk详细文档
打包不支持windows所以可以找一台linux的电脑 或者用win10子系统(推荐) 我用的是Ubuntu 方法:https://www.jianshu.com/p/fcf21d45ea74 我简单 ...
- IntelliJ IDEA 2022.3.1破解教程mac,windows,linux均适用/JetBrains产品全版本激活
前言 这个文章是2022.3.1的, 要2023.1的看我另一篇博文 https://www.cnblogs.com/daen/p/17363977.html 说明 以下使用IDEA作为演示 下载补丁 ...
- Linux下安装mamba-ssm踩过的坑
起初的原因是,想要跑一个用到了mamba-ssm的项目,故尝试在wsl中配置mamba-ssm库.提示需要pip install mamba-ssm后报错频繁,遇到了许多问题.查阅了很多blog和is ...
- Go中的文件操作
文件操作 读取文件的内容并显示在终端(带缓冲区的方式),使用os.Open,file.Close,bufio.NewReader(),reader.ReadString函数和方法. package m ...
- 来公司 3 年,被新来的技术大佬 PUA 了。。。
大家好,我是程序员鱼皮.最近收到一位鱼友的求助,感觉很有代表性,相信很多技术人都会遇到类似的情况.今天就和大家聊聊这个话题,看看遇到这种情况该怎么办. 鱼友提问 鱼皮哥,求解惑!最近我们公司新来了一个 ...
- 使用Redis加锁对请求进行去重
场景:对请求过来相同的数据进行去重 如一个Http的Get请求中 /get?a=zhangsan /get?a=lisi /get?a=zhangsan /get?a=wangwu /get?a=li ...
- git-intelligence-message 1.3.2 发布了,智能生成、提交git的工具
git-intelligence-message 1.3.2 发布了,这是一次小版本更新.主要内容是可以通过命令查看AI配置信息了. Git Intelligence Message (GIM) 是一 ...
- 性能提升30%!袋鼠云数栈基于 Apache Hudi 的性能优化实战解析
Apache Hudi 是一款开源的数据湖解决方案,它能够帮助企业更好地管理和分析海量数据,支持高效的数据更新和查询.并提供多种数据压缩和存储格式以及索引功能,从而为企业数据仓库实践提供更加灵活和高效 ...
- HyperWorks实体网格划分
实体网格剖分 在 HyperMesh 中,使用 Solid Map 功能进行实体网格剖分.该面板如下图所示: 图 4-4 Solid Map 面板 Ø 通过 Solid Map Panel 进行实体网 ...