将 txt 上传到 Amazon S3答案

【问题标题】：Upload a txt to Amazon S3将 txt 上传到 Amazon S3
【发布时间】：2014-06-10 20:33:48
【问题描述】：

我正在使用 s3 sdk 上传一个字符串（这将变成一个 txt 文件）。使用sdk没问题。但由于 sdk 仅适用于新浏览器（例如：ie10+）我需要用另一种方式上传我的文件（适用于旧浏览器）

对于图像文件，我使用输入（类型文件）和上传表单

<form id="urlform" enctype="multipart/form-data" method="post" target="upload_target" class="inline">
    <input type="hidden" name="key" value="{{$parent.keyurl}}">
    <input type="hidden" name="acl" value="public-read">
    <input type="hidden" name="AWSAccessKeyId" value="{{$parent.awSAccessKeyIdUrl}}">
    <input type="hidden" name="success_action_redirect" value="{{$parent.redirectionUrl}}">
    <input type="hidden" name="x-amz-meta-filename" value="{{$parent.filenameurl}}">
    <input type="hidden" name="policy" value="{{$parent.policyurl}}">
    <input type="hidden" name="signature" value="{{$parent.signatureurl}}">
    <input type="hidden" name="x-amz-security-token" value="{{$parent.urlSessionToken}}">
    <div>
        <label>
        </label>
        <input type="file" name="file" id="urlfileinput">
    </div>
</form>

此解决方案仅适用于输入类型 file 。

出于安全原因，我无法使用 jquery 更改输入的值。

还有其他上传文本的方法吗（也许使用其余的 api）？

【问题讨论】：

这最终会帮助你：stackoverflow.com/questions/14882713/…
您能否从用户的角度明确说明您希望上传的行为方式？为什么要尝试使用 jQuery 更改文件输入的值？
为什么不尝试执行一个AJAX请求到服务器代码实现上传呢？它将提高安全性，因为真的会隐藏密钥和其他选项。

标签： javascript angularjs amazon-s3

【解决方案1】：

我很好奇您为什么要使用 URL 表单将其提交给 Amazon...这是非常不安全的，因为您将 AWS 访问密钥分发给所有人。首先，您需要考虑使用 Amazon SDK for Javascript，它应该可以很容易地与 Angular 作为依赖项一起使用。

接下来，您需要考虑做CORS on your S3 Bucket (cross domain resource sharing)，这样您就可以从任何地方在 S3 上“上传”某些东西，而无需进行身份验证（请注意这一点，因为 每个人 都可以访问并可以上传任何内容，如果您没有正确配置它，可以授予对其他内容的访问权限，例如删除）。

最后，您只需使用 SDK 的 AWS.S3().putObject() 函数将您需要的任何内容上传到您的公共 S3 存储桶。

【讨论】：

提供访问密钥并没有什么不安全的地方。访问密钥并不意味着是私有的。但是，密钥是。根据问题中的代码，请求显然是使用密钥/私钥签名的，这是预期且正确的。
也是CORS，跟认证无关。您可以在您的存储桶上设置 CORS 规则，但仍然希望请求经过身份验证，以便只有您允许的用户才能上传到您的存储桶。

【解决方案2】：

您可以使用表单数据发送文件。

var formData = new FormData();

formData.append("key", "{{$parent.keyurl}}");
formData.append("acl", 'public-read');
formData.append("AWSAccessKeyId", '{{$parent.awSAccessKeyIdUrl}}');
formData.append("success_action_redirect", '{{$parent.redirectionUrl}}');
.........
// JavaScript file-like object...
var blob = new Blob('testSample', { type: "text/xml"});
 formData.append("file", blob);

var request = new XMLHttpRequest();
request.open("POST", "upload_target");
request.send(formData);

【讨论】：

“upload_target”是什么意思？我也认为它可能是 var blob = new Blob(['testSample'], { type: "text/xml"});
"upload_target" 是您上传文件的链接，'testSample' 是生成文档的文本内容

【解决方案3】：

我找到了解决方案。要上传文本，我必须在表单内部使用名为“文件”的名称。

<form id="disclaimerform" enctype="multipart/form-data" method="post" target="upload_target" class="inline">
    <input type="hidden" name="key" value="{{keydisclaimer}}">
    <input type="hidden" name="acl" value="public-read">
    <input type="hidden" name="AWSAccessKeyId" value="{{awSAccessKeyId}}">
    <input type="hidden" name="success_action_redirect" value="{{redirection}}">
    <input type="hidden" name="x-amz-meta-filename" value="{{disclaimerfilename}}">
    <input type="hidden" name="x-amz-security-token" value="{{session_token}}">
    <input type="hidden" name="policy" value="{{policy}}">
    <input type="hidden" name="signature" value="{{signature}}">
    <div>
        <label></label>
        <textarea style="opacity:0;" name="file" id="disclaimerinput"/>
    </div>
</form>

【讨论】：