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

Question

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

使用Javascript，我可以获取实际图像数据（JPEG）以将其传递给函数吗？它在DOM中可用吗？我需要原始图像数据，所以我可以将它作为application / octet-stream传递给twitter，所以base64对我没有好处。

Answer 1

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

如果您必须使用＆lt; img＆gt;标签，然后这将是困难的。我能想到的是将图像绘制到＆lt; canvas＆gt;，获取带有toDataURI()的base64编码的URI，解码它以使用window.atob()获取原始图像数据，然后构建multipart / form -data POST body手动。 This answer有一些示例代码用于前几件事。

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