vue开发中上传文件时IE的兼容问题

最新推荐文章于 2023-09-14 15:00:44 发布

原创最新推荐文章于 2023-09-14 15:00:44 发布 · 857 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#vue

IE浏览器兼容问题专栏收录该内容

5 篇文章

订阅专栏

本文介绍了解决Internet Explorer浏览器中使用new File()构造函数的兼容性问题，通过使用FormData对象替代，确保了跨浏览器的文件上传功能正常运行。

 const file = new File([blobInfo.blob()], blobInfo.filename(), {
                        type: 'image/*',
                  })

new File

对象ie不支持问题；需要使用

new FormData()

替换

 const formData = new FormData()
                    // 服务端接收文件的参数名，文件数据，文件名
                    formData.append('file', blobInfo.blob(), blobInfo.filename())

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

qq_Girl200

关注关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

Vue+Minio如何开发支持IE的加密大文件上传控件？

2501_90699800的博客

02-20

1006

要求：免费,开源,技术支持技术：百度webuploader，分块，切片，断点续传，秒传，MD5验证，纯JS实现，支持第三方软件集成前端：vue2,vue3,vue-cli,html5,webuploader后端：asp.net,.net mvc,.net core,asp,jsp,java,springboot,php,数据库：MySQL,Oracle,SQL Server,达梦,人大金仓,国产数据库。

关于tinymce富文本编辑器插件图片的自定义上传

yuzenan的博客

05-16

6280

简介： 1.tinymce图片拖动到编辑框或者使用图片上传插件插入到编辑框时，需要指定上传方法； 2.需要先调用后台接口，讲前台上传的图片保存到服务器，之后后台返回的图片的路径，返回到前台做图片链接。 3.toolbar属性中需要配置‘|image media pageembed |’，才会在工具栏中显示上传图片的按钮（由于用的不熟，自己找了好久，这里特意写一下） tinymce中有两种...

1 条评论您还未登录，请先登录后发表或查看评论

1 条评论

Mouse@Rice 2021.03.22
大佬优秀解决了我的问题感谢

Vue+Element ui开发中碰到的IE问题

热门推荐

我走过最长的路，就是这条爬坑之路！！！

04-18

3万+

IE9样式错乱，IE11无法正常加载v-loading等问题引入了babel-polyfill插件，依然出现”polyfill-eventsource added missing EventSource to window”的奇怪问题(ie所有版本都有出现) 第一步：安装babel-ployfill （已安装请跳过此步骤） yarn add babel-ployfill 修改we...

解决 new file()在IOS下不兼容的问题

wangchaoqi1985的博客

07-16

392

解决 new file()在IOS下不兼容的问题

new File() 在360兼容模式下不兼容

Queen-Shir的博客

09-14

342

我的代码里需要用FormData的方式来上传图片，上传之前需要用 new File() 深拷贝图片的file对象。然后在360兼容模式下，上传图片时就js报错了。但是在360的极速模式还有谷歌、火狐等其他浏览器里是正常的，故猜测是 new File() 在360兼容模式下不兼容造成的。在 IE上传不支持 new File。经过排查发现，是因为promises的值有误，导致Promise.all()进入了catch()。最后一行一行代码排查到是。

Vue 实现附件上传

kuyz1的专栏

08-14

457

转发 https://blog.youkuaiyun.com/qq_37143673/article/details/106406642

IE浏览器new File不兼容问题解决

q879936814的博客

02-22

1872

重写File 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.lastMod

vue项目中使用axios上传图片等文件操作

10-19

在现代的Web开发中，上传文件到服务器是一项常见的功能，尤其是对于图片这类多媒体内容的上传。在Vue.js项目中实现文件上传功能，常用的HTTP客户端库之一是axios。axios基于Promise，能够很好地和Vue.js项目集成，...

一个基于webuploader兼容IE9的VUE上传插件

08-10

本篇文章将围绕“一个基于webuploader兼容IE9的VUE上传插件”这一主题，深入探讨如何在Vue项目中实现IE9的文件上传功能。首先，WebUploader是由阿里大鱼团队开发的一个前端文件上传组件，它支持多文件上传、断点续...

精选资源

Vue项目中使用WebUploader实现文件上传的方法

01-19

在现代的浏览器里面能充分发挥HTML5的优势，同时又不摒弃主流IE浏览器，沿用原来的FLASH运行时，兼容IE6+，iOS 6+, android 4+ 。两套运行时，同样的调用方式，可供用户任意选用。采用大文件分片并发上传，极大...

IE9 elementUI文件上传的问题解决

10-17

总之，在IE9中实现Element UI的文件上传功能时，需要考虑一些特定的兼容性问题，并采取相应的技术措施。开发者需要理解这些技术细节，并通过调试和测试来确保功能的正确实现。虽然这可能会增加开发的复杂度和时间...

JavaScript blob类型转file类型以及ie不兼容file的处理

weixin_43969975的博客

10-24

2206

JavaScript blob类型转file类型 var file = new File([blob], filename, {type: contentType, lastModified: Date.now()});

js中关于Blob对象的介绍与使用

weixin_30679823的博客

07-18

602

blob对象介绍一个 Blob对象表示一个不可变的, 原始数据的类似文件对象。Blob表示的数据不一定是一个JavaScript原生格式 blob对象本质上是js中的一个对象，里面可以储存大量的二进制编码格式的数据。创建blob对象创建blob对象本质上和创建一个其他对象的方式是一样的，都是使用Blob() 的构造函数来进行创建。构造函数接受两个参数：第一个参数为一个数据序列...

tinymce图片的自定义上传和自定义img的url路径

Lee_is_bulibuli的博客

08-10

6896

tinymce图片的自定义上传和自定义img的url路径，实现自定义图片上传可以使用images_upload_handler属性代替TinyMCE来处理上传操作。该自定义函数需提供三个参数：blobInfo、成功回调和失败回调。

TinyMCE实现word上传

lsn690607887的博客

04-11

1087

主要解决了上传图文word的图片上传问题

vite+vue3+tinymce实现单图上传和多图上传到阿里云oss

deng_zhihao692817的专栏

05-31

1892

如何安装tinymce可以参考：在vuecli3.0+中使用tinymce及实现多图上传，文件上传，公式编辑等功能 - huihuihero - 博客园我改的是交互的部分，重点部分记录下来，便日后复查。 1、多图上传是依赖于多图上传的，所以单图上传很重要，我是上传到阿里云oss images_upload_handler: (blobInfo, success, failure) => { //console.log(

tinymce使用images_upload_handler将图片处理成base64或者url

yuguang的博客

08-18

1万+

1.处理成base64 initTinymce() { const _this = this; window.tinymce.init({ // language: this.language, language: "zh_CN", selector: `#${this.tinymceId}`, height: this.height, body_class: "panel-body ",

tinymce 富文本编辑器上传二进制图片（如果使用base64在图片数量多的情况下，编辑会变得明显卡顿）

hzxOnlineOk的博客

01-06

1985

package.json { "private": true, "scripts": { "start": "roadhog server", "build": "npm run lint && roadhog build", "lint": "standard src/**/*.js && stylelint src/**/*.css", "precommit": "npm run lint" }, "dependenc.

你不知道的 Blob

高先生的猫

07-23

4056

一、Blob 是什么 Blob（Binary Large Object）表示二进制类型的大对象。在数据库管理系统中，将二进制数据存储为一个单一个体的集合。Blob 通常是影像、声音或多媒体文件。在JavaScript中 Blob 类型的对象表示不可变的类似文件对象的原始数据。为了更直观的感受 Blob 对象，我们先来使用 Blob 构造函数，创建一个 myBlob 对象，具体如下图所示：如你所见，myBlob 对象含有两个属性：size 和 type。其中size属性用于表示数据的大小（...