javascript - 如何使用 Javascript 从网页中获取图像数据

Question

我正在使用jsOauth-twitter将图像上传到调用update_with_media api 方法的 twitter 。看起来它需要实际的图像数据。这已经在我的网页上的普通<img src="localfile">标签内。

使用 Javascript，我可以获取实际的图像数据 (JPEG) 以将其传递给函数吗？它在 DOM 中可用吗？我需要原始图像数据，所以我可以将它作为应用程序/八位字节流传递给 twitter，所以 base64 对我没有好处。

Answer 1

看起来 API 需要将表单作为 multipart/form-data 发送，这意味着 media[] 参数需要一个文件，而不是二进制或 base64 编码数据。如果您在表单中使用 HTML 文件输入，这应该是相当简单的。

如果你必须使用 <img> 标签，那就很难了。我能想到的只是将图像绘制到 <canvas>，获取 base64 编码的 URI ，使用window.atob()toDataURI()对其进行解码以获取原始图像数据，然后手动构建 multipart/form-data POST 正文。这个答案有一些关于前几件事的示例代码。

API 可能有助于创建您的 OAuth 库可以接受的Blob类似文件的对象（而不是手动构建请求正文），但它还没有得到很好的支持。