如何从 URL.createObjectURL(file)创建的 blob url 中获取 file 对象？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

V2EX 提问指南

这是一个创建于 2176 天前的主题，其中的信息可能已经有所发展或是发生改变。

前端页面只存了 blob url，现在要把对应的文件上传到无服务，如何获取到文件再 ajax 上传？

13 条回复 • 2018-12-16 03:00:18 +08:00

deepdark

2018-12-15 10:13:22 +08:00 via Android

你就把 blob url 当成真的 url 处理就完事了

coolair

2018-12-15 10:29:32 +08:00

@deepdark 处理不了啊，传上去是个字符串啊，不是文件对象。

MinonHeart

2018-12-15 10:31:30 +08:00 via iPhone

用 xhr 拉 blob url 转换成 file

ted94

2018-12-15 10:38:34 +08:00 via Android

File API

coolair

2018-12-15 11:21:37 +08:00

@MinonHeart
@ted94
xhr 拉 blob url 只能用异步的 onload 方法，但是如果有多个图片想同时上传的话，我的 formdata 还没有拼完，ajax 就发出去了……

ted94

2018-12-15 11:30:28 +08:00 via Android

@coolair 不大清楚你的问题是什么，可以完整的描述一次么

coolair

2018-12-15 12:23:39 +08:00 via Android

@ted94 是这样的，页面上有多张图片，其中的 src 是一个 blob:http 的链接，现在想把这些图片通过一次 ajax 请求都存到服务器上去。

yimity

2018-12-15 12:51:53 +08:00 via Android

跟正常的选择 img，用 filereader 读取上传没区别吧。

DOLLOR

2018-12-15 12:56:39 +08:00 via Android

先用 AJAX 或 XHR 或 FileReader 把 blob URL 的文件读取出来，再用 AJAX 把图片提交到服务器。别说你不懂处理异步流程…

coolair

2018-12-15 14:35:06 +08:00 via Android

@DOLLOR 如果处理一个图片可以在异步处理完后发个 ajax，如果有五张图片，怎么等五个异步完了后再发 ajax 呢？

Twinkle

2018-12-15 14:41:11 +08:00

@coolair 多张就计数

SakuraKuma

2018-12-15 18:35:57 +08:00

@coolair Promise.all

EscYezi

2018-12-16 03:00:18 +08:00 via iPhone

@coolair 在循环用中 await