【问题标题】:Firefox Addon: Uploading ImageFirefox 插件:上传图片
【发布时间】:2014-07-14 18:18:24
【问题描述】:

我想将图片从 Firefox 插件上传到网站。

我知道我可以createElement('canvas'),将 Image 数据转换为 base64 并 XHR POST 数据,但我想看看是否可以让 Firefox 处理它。

通常,用户会在网站上点击浏览,Firefox 会打开File Upload 对话框,选择文件,然后点击打开。

我想从上下文菜单中自动执行此操作,以便可以将浏览器打开的本地文件(即图像)直接上传到目的地。

这可能吗?如何实现?

澄清:

在通过 Firefox 上传的文件选择中,这些是必需的数据:
- 目标形式
- 本地文件位置
- 文件上传对话框中打开按钮附加的操作

在我想创建的上下文菜单情况下:
- 目标形式:将在脚本中进行硬编码
- 本地文件位置:右键单击的文件(即gContextMenu.target.src
- 操作:这是我想做的,并将“命令”附加到上述按钮的功能(现有的 Firefox 功能)

也就是说,不是手动创建new XMLHttpRequest() 并发布数据,而是使用Firefox 的现有功能。

换句话说,手动将“目标表单”和“本地文件位置”提供给 FILE UPLOAD 的 OPEN 按钮功能,就好像这是执行的过程一样。

【问题讨论】:

  • 有可能
  • 有多种方法。这是一种方法:(警告这家伙真的很草率)-[上传图片二进制-使用imageshack api](stackoverflow.com/questions/22036442/…
  • 谢谢,但是那个人正在使用 JavaScript、canvs、XHR,正如我所提到的,这不是我想要的 ;)
  • 我认为您将不得不使用 XHR。不同之处在于您要使用 FormData。您将 FormData 作为 XHR .send().open() 的第一个参数发送,无需 base64,只需使用画布中的 mozGetAsFile
  • 好问题的人。下面发布的解决方案让我学到了很多。

标签: javascript ajax firefox-addon firefox-addon-restartless


【解决方案1】:

使用 DOM 文件

DOM File constructor actually accepts plain paths (from privileged code)

var xhr = new XMLHttpRequest();
xhr.open("POST", "http://example.org/");
xhr.setRequestHeader("Content-Type",
                     "application/octet-stream");
xhr.send(new File("/tmp/test.upload"));

这可以与表单数据相结合。

使用输入流

您可以发送nsIInputStream。因此,只需知道文件的路径,然后初始化 nsIFileInputStreamnsIInputStreamsend() 的“超级接口”,并使用适当的 Content-Type 进行处理。

var {classes: Cc, interfaces: Ci, utils: Cu} = Components;

Cu.import("resource://gre/modules/Services.jsm");
Cu.import("resource://gre/modules/FileUtils.jsm");

var stream = Cc["@mozilla.org/network/file-input-stream;1"].
  createInstance(Ci.nsIFileInputStream);
stream.init(FileUtils.File("/tmp/test.upload"),
            -1, -1,
            Ci.nsIFileInputStream.DEFER_OPEN);
var xhr = new XMLHttpRequest();
xhr.open("POST", "http://example.org/");
xhr.setRequestHeader("Content-Type",
                     "application/octet-stream");
xhr.send(stream);

这可以与 nsIMultiplexInputStream 结合 (IIRC) 以构建更复杂的有效负载。

【讨论】:

  • 对 DOM File 来说非常有趣,这对 JSM 可用。但是从 JSM 中我们不应该使用new FileUtils.File 吗?图像的内容类型是否始终为application/octet-stream?还有你IIRC很多,你从哪里回忆起这个,我想去那里。
  • 啊我认为octet-stream在使用输入流时总是被设置,这样我们就可以设置FileUtils.File('/tmp/test.upload')(你为什么不做new FileUtils?)到我们想要的任何文件嗯?如果是真的,那真是太棒了,谢谢!
  • var xhr = new XMLHttpRequest(); 在 JSM 范围内不可用,您必须先导入 const XHR = Cc["@mozilla.org/xmlextras/xmlhttprequest;1"];,然后才能执行 var xhr = new XHR() 对吗?
  • 很好的信息尼尔斯。谢谢.....我对我的原始问题添加了更多说明,希望能解释我的要求。 :)
  • 这是一个文件 URI。你应该只传递一个文件路径。 .send(new File("C:\\Temp\\test.txt"));
猜你喜欢
  • 2012-05-01
  • 1970-01-01
  • 2012-11-05
  • 2011-09-08
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多