我正在开发一个Firefox插件,需要将图像从本地文件系统直接上传到S3。
我可以在AWS,SO等中找到的示例解释了如何使用标准文件输入控件进行图像传输(使用其他AWS特定请求签名等),我已经完美地工作了)。
http://bencoe.tumblr.com/post/30685403088/browser-side-amazon-s3-uploads-using-cors
Uploading Image to Amazon s3 with HTML, javascript & jQuery with Ajax Request (No PHP)
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]"
我很难过!我知道它与尝试伪造文件输入有关。我相信应该有一种更清洁,更正确的方法。
有谁可以解释我如何解决这个问题?提前谢谢。
答案 0 :(得分:2)
从chrome
代码(也称为特权代码),您只需通过使用路径调用File构造函数即可构建DOM File对象:
var file = File("path/to/some/file");
fd.append("file", file);
有关详细信息,请参阅:Using the DOM File API in chrome code。