fileapi相关内容

使用FileReader将输入文件数组转换为Base64

我有一个允许用户输入多个文件的表单。提交表单后,我将获得用户输入的文件列表,然后将数组中的每个文件转换为Base64。我很难弄清楚如何准确地完成最后一部分--将数组中的每个文件转换为Base64,然后返回列表。以下是我到目前为止的情况: 我编写的代码不起作用,但我认为我在正确的轨道上(使用map函数、FileReader等) ..
发布时间:2022-07-21 16:08:51 前端开发

将 base64 png 数据转换为 javascript 文件对象

我有两个用 PNG 编码的 base64,我需要使用 比较它们Resemble.JS 我认为最好的方法是使用 fileReader 将 PNG 转换为文件对象.我该怎么做? 解决方案 你可以从你的base64数据创建一个Blob,然后读取它asDataURL: var img_b64 = canvas.toDataURL('image/png');var png = img_b64 ..
发布时间:2022-01-21 08:17:43 前端开发

IE 8/9 中 FormData 的后备

FormData 在 IE 8/9 中不存在,但我需要这些浏览器中的功能.有一个很好的后备方案吗? 我会尝试通过 json 数据发送,但我需要将文件传递给服务器.我将此文件附加到现代浏览器中的 formData 并提交一个 XHR 请求.因为 FormData 在 IE 8/9 中不存在,这显然失败了. //我似乎无法让它与文件一起使用.$.ajax({url: '/genericHand ..
发布时间:2022-01-15 21:28:15 前端开发

如何检测浏览器支持文件 API 拖放

我喜欢在 div 上添加背景,仅适用于支持拖动 & 的浏览器.删除文件 虽然我不喜欢使用modernizr,只是一个单行脚本 解决方案 为什么不直接从 Modernizr 复制所需的部分? var isEventSupported = (function() {变量标签名 = {“选择":“输入",“更改":“输入",'提交':'表格','重置':'表格','错误':'img',' ..
发布时间:2022-01-11 20:42:30 前端开发

将 UTF-8 BOM 添加到字符串/Blob

我需要在客户端为生成的文本数据添加一个 UTF-8 字节顺序标记.我该怎么做? 当然,使用 new Blob(['\xEF\xBB\xBF' + content]) 会产生 '"my data"'.> '\uBBEF\x22BF' 都没有工作('\x22' == '"' 是 content 中的下一个字符). 是否可以将 JavaScript 中的 UTF-8 BOM 添加到生 ..
发布时间:2021-12-28 16:34:01 前端开发

在 Google Chrome 中指定 Blob 编码

以下代码(供应商标准化)运行良好,在 Firefox 8 中显示“➀➁➂ Test",但在 Google Chrome 中显示“➀âžâž‚ Test".除了使用文件系统 API 将文件写入临时文件系统之外,是否有任何方法可以在 Google Chrome 中保留 blob 的编码? var b = new Blob(["➀➁➂ Test"], {type: "text/plain;char ..
发布时间:2021-12-27 15:57:55 前端开发

使用 WebSocket 上传大文件

我正在尝试使用 WebSocket API 上传大文件(至少 500MB,最好是几 GB).问题是我不知道如何编写“发送文件的这一部分,释放使用的资源然后重复".我希望我可以避免为此使用 Flash/Silverlight 之类的东西. 目前,我正在处理以下方面的工作: function FileSlicer(file) {//随机选取 1MB 切片,//我不认为这个大小对这个实验很重要t ..
发布时间:2021-12-25 13:38:54 前端开发

Safari 中用于多文件选择的文件输入大小问题

我在 Windows Vista 上的 Safari 5.1 中遇到多个文件上传不一致的问题(尚未尝试其他平台).输入元素具有 multiple 标志以允许选择多个文件.当用户确实选择了多个文件时,就会出现问题.在这种情况下,每个File 都有一个0 的size 属性.如果(仍然带有 multiple 标志),用户只选择一个文件,size 属性正确包含文件大小. 这个问题可以在下面的例子中看 ..
发布时间:2021-12-24 11:00:08 前端开发

在 HTML5 [多个] 文件输入中选择的最大文件数是多少?

我有 64000 张小图片要上传到我的网站(使用现有验证,所以没有 FTP 等).我已经为此创建了一个 HTML5 [multiple] type=file 输入,用于一百或数百张图像.几百不是问题.图像被批处理并发送到服务器. 但是当我选择一个大约有 16000 张图像的文件夹时,文件输入的 FileList 为空... onchange 事件触发,但文件列表为空.浏览器(或文件系统或操作 ..
发布时间:2021-12-24 10:38:43 前端开发

将文件上传选择限制为特定类型

无论如何要通过 元素来限制文件类型的选择? 例如,如果我只想上传图像类型,我会将可能的选择限制为 (image/jpg,image/gif,image/png),并且选择对话框会使其他 mime 类型的文件变灰. 附言我知道我可以在事后通过扫描 .type 属性使用 File API 执行此操作.我真的很想事先限制这个..我也知道我可以通过闪光 ..
发布时间:2021-12-24 10:37:52 前端开发

如何使用更改和删除事件在 Firefox 和 chrome/chromium 上传和列出目录

mozilla 和 webkit 浏览器现在都允许上传目录.当在 元素处选择一个或多个目录或在一个元素处放置一个或多个目录时,如何按照它们在两个 firefox 中的实际目录中出现的顺序列出所有目录和文件和 chrome/chromium,并在所有上传的目录都被迭代后对文件执行任务? 解决方案 您可以在 ..
发布时间:2021-12-24 10:28:06 前端开发

JS 和 type.match 作为文件 MIME 类型 - 需要建议

今天我遇到了一个有趣的事情,即 FF File API 和按类型分离文件.好的,这里有一个小片段 if (!input.files[0].type.match('image.*')) {window.alert("请选择图片");返回;} 它控制图像是只读的.但是例如 doc 文件和 pdf 呢?我找不到这件事的有用例子,所以我希望你能分享一些片段.我对检测不同的文件类型感兴趣,但如何使用 J ..
发布时间:2021-12-19 14:15:10 前端开发

Chrome 内存问题 - 文件 API + AngularJS

我有一个需要将大文件上传到 Azure BLOB 存储的 Web 应用程序.我的解决方案使用 HTML5 文件 API 切片成块,然后将其作为 blob 块放置,块的 ID 存储在数组中,然后将块作为 blob 提交. 该解决方案在 IE 中运行良好.在 64 位 Chrome 上,我已成功上传 4Gb 文件,但内存使用量非常大(2Gb+).在 32 位 Chrome 上,特定的 chrom ..
发布时间:2021-12-06 19:03:03 前端开发

如何使用 Angular2 或更高版本下载文件

我有一个 WebApi/MVC 应用程序,我正在为其开发 angular2 客户端(以替换 MVC).我在理解 Angular 如何保存文件时遇到了一些麻烦. 请求没问题(适用于 MVC,我们可以记录收到的数据)但我不知道如何保存下载的数据(我主要遵循与 这篇文章).我相信它非常简单,但到目前为止我根本没有掌握它. 组件函数的代码如下.我尝试了不同的替代方案,据我所知,blob 方式应 ..
发布时间:2021-11-28 00:01:20 前端开发

选择 &删除要解析的文件和/或文件夹

我使用了 SO 上一篇帖子中的一部分(虽然我不记得了)来解析 Chrome 上的文件和文件夹,但我无法让它在 Firefox 上运行(说实话我没有在其他人身上试过,虽然我认为它也不适用于 safari). 这是 2 个指令,ngDrop 和 input. angular.module('myApp').directive("ngDrop", function($rootScope) {va ..
发布时间:2021-11-09 04:15:56 前端开发