0

我正在开发一个 Firefox 插件,需要将图像从本地文件系统直接上传到 S3。

我可以在 AWS、SO 等中找到的示例解释了如何使用用于图像传输的标准文件输入控件(以及其他 AWS 特定请求签名等,我已经完美地工作)为网页完成此操作。

http://bencoe.tumblr.com/post/30685403088/browser-side-amazon-s3-uploads-using-cors

使用 Ajax 请求(无 PHP)使用 HTML、javascript 和 jQuery 将图像上传到 Amazon s3

http://aws.amazon.com/articles/1434

但是,我找不到任何关于如何在使用文件输入的情况下上传文件的信息,我知道文件的本地绝对路径(插件本身在尝试将文件上传到 S3 之前会写出文件)。

经过几个小时试图找到“正确”的方式后,我想到了伪造文件输入,如下所示:

var fileInput = document.createElementNS("http://www.w3.org/1999/xhtml","input");
fileInput.setAttribute('type', 'file');
fileInput['files'] = [{
    mozFullPath: file.path,
    name: file.leafName,
    size: file.fileSize,
    type: 'image/gif' // testing only with gifs
}];

然后fd.append("file", fileInput.files[0]);fd 是我的FormData对象。然后通过 AJAX 将其发布到 s3。

这会将文件上传到 S3。但是,在浏览器中打开文件时,我得到的是文本"undefined"而不是图像。

然后我尝试fd.append("file", fileInput.files);了 - 这次浏览器返回的内容而不是图像是文本"[object FileList]"

我难住了!我知道这与试图伪造文件输入有关。我相信应该有一种更清洁、更正确的掺杂方式。

谁能阐明我如何解决这个问题?提前致谢。

4

1 回答 1

2

chrome代码(又名特权代码)中,您只需使用路径调用 File 构造函数即可构造 DOM File 对象:

var file = File("path/to/some/file");
fd.append("file", file);

有关更多信息,请参阅:在 chrome 代码中使用 DOM 文件 API

于 2013-10-23T16:03:45.490 回答