Angular.js和Amazon S3 - 如何上传文件？

Question

我在Angular.js中有一个应用程序。 事实上，我在我的旧网站上做了更新，改为Angular。

在旧版本中，我使用Uploadfy jquery组件来在Amazon S3中上传。 但现在，有了Angular，我无法使用它。

我想使用指令“ngUpload”。 但我不知道该怎么做。 有人可以帮我吗？

Answer 1

如果在POST数据中包含有效的S3参数，则可以从HTML表单直接上载到S3存储桶。 这些被称为预授权的HTML POST表单。

有效参数值是通过对AWS API的API调用在您自己的托管服务器上生成的。 然后将值作为隐藏输入字段添加到上载表单中。

这是他们在您的表单中的样子：

  <input type="hidden" name="AWSAccessKeyId" value="YOUR_AWS_ACCESS_KEY"> 
  <input type="hidden" name="acl" value="private"> 
  <input type="hidden" name="success_action_redirect" value="http://yourdomain/">
  <input type="hidden" name="policy" value="YOUR_POLICY_DOCUMENT_BASE64_ENCODED">
  <input type="hidden" name="signature" value="YOUR_CALCULATED_SIGNATURE">

亚马逊提供Java，Python和Ruby的示例代码。

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

Answer 2

您可以使用angular-file-upload轻量级角度指令，该指令支持文件进度和文件丢弃。

您可以在此处关注Amazon S3问题，其中包含示例代码，以及如何将所有这些数据与文件上载一起发送： https ： //github.com/danialfarid/angular-file-upload/issues/23

S3上传应该适用于上面的1.1.1版。

另一个相关问题： https ： //github.com/danialfarid/angular-file-upload/issues/23

Answer 3

如果要在上载后处理文件并将其移动到其他位置，则可以使用AWS JS SDK中的“公共”IAM帐户和API密钥执行此操作。 例如，处理和存储上载的文件。

使用Angular，AWS S3 JS SDK，CORS和IAM帐户。 有一些设置涉及锁定它，所以它不会被滥用。

我在这里记录了设置过程： http ： //www.cheynewallace.com/uploading-to-s3-with-angularjs/

Answer 4

一个如果最好的s3-file-upload angular指令带有动态数据绑定，回调函数 - https://github.com/vinayvnvv/s3FileUpload