Question

更新：通过升级修复。从未检查过我们的bower.json，运行的是v5.0.9（现在是12.0.4）！吃鞋......

我正在尝试使用v4身份验证/签名AngularJS 1.4.1将“简单”图像上传到S3。 v4的东西似乎工作正常，但我不确定当AWS响应告诉我我没有发送正确的请求有效负载时如何解决剩下的部分：

<?xml version="1.0" encoding="UTF-8"?>
<Error>
  <Code>InvalidArgument</Code>
  <Message>POST requires exactly one file upload per request.</Message>
  <ArgumentName>file</ArgumentName>
  <ArgumentValue>0</ArgumentValue>
  <RequestId>B353DC15D1CC165F</RequestId>
  <HostId>8joOZ1eyGCW88X3t6ppL7DSKM8XPIu0MrJ7A/dozNG0Cg205cEH5NeEV1lsvKWw+ama8Xqx1w+s=</HostId>
</Error>

在浏览器网络窗口中，请求有效负载仅显示单个部分，其中上载配置对象就像纯文本一样。这应该是多个部分，上传对象中每个属性一个。

在Chrome中选择文件后，会显示

<img ngf-src="orgCtrl.logoFileArray[0]">

但是Upload.upload的data参数中的相同数据似乎没有相同。我的HTML如下：一个按钮选择，另一个按钮触发上传：

<button
  ng-show="orgCtrl.editMode"
  class="btn upload-btn"
  ngf-select
  ng-model="orgCtrl.logoFileArray">
  Select
</button>

<button ng-show="orgCtrl.editMode" ng-click="orgCtrl.uploadLogo()">UPLOAD TO S3</button>

Javascript看起来像这样：

view.uploadLogo = function() {

  // (snip) get server-side signature/policy secrets etc

  var uploadObj = {
    url: "https://xyzpdq-test-images.s3.amazonaws.com/",
    method: "POST",
    data: {
      "key"                  : "logos/TEST.png",
      "acl"                  : res.s3PolicyResult.acl,
      "policy"               : res.s3PolicyResult.base64Policy,
      "X-amz-credential"     : res.s3PolicyResult.credentials,
      "X-amz-algorithm"      : res.s3PolicyResult.algorithm,
      "X-amz-date"           : res.s3PolicyResult.date,
      "X-amz-signature"      : res.s3PolicyResult.signature,
      "Content-Type"         : 'image/png',
      "success_action_status": res.s3PolicyResult.successStatus,
      "file"                 : view.logoFileArray[0] // ??? no file data?
    }
  };

  $log.debug('uploadObj', uploadObj);

  Upload.upload(uploadObj)
  .then(function (resp) {
    console.log('Success ' + resp.config.data.file.name + 'uploaded. Response: ' + resp.data);
  }, function (resp) {
    console.log('Error status: ' + resp.status);
  }, function (evt) {
    var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
    console.log('progress: ' + progressPercentage + '% ' + evt.config.data.file.name);
  });
};

更新：根据评论，还尝试删除Content-Type元素，但无济于事：我仍然看到相同的JSON对象有效负载，而不是带有边界标记的多个部分。

目标是使请求看起来像这样（假签名/策略数据，但格式正确）：

我是否需要实际表单HTML元素？（尝试仅使用ngf-select attrib的按钮。）能够使用https://angular-file-upload.appspot.com/#/1.4.1获得上述内容，但这是使用S3 v2身份验证。暂停调试ng-file-upload插件，但可能会出现这种情况。

更新2：

var upload = Upload.upload({
  url: "https://xyzpdq-test-images.s3.amazonaws.com/",
  method: 'POST',
  data: {
    key               : "logos/TEST.png",
    acl               : res.s3PolicyResult.acl,
    policy            : res.s3PolicyResult.base64Policy,
    'X-amz-credential': res.s3PolicyResult.credentials,
    'X-amz-algorithm' : res.s3PolicyResult.algorithm,
    'X-amz-signature' : res.s3PolicyResult.signature,
    'Content-Type'    : logoFile.type !== '' ? logoFile.type : 'application/octet-stream',
    filename          : "TEST.png",
    file              : logoFile
  }
});

再次尝试使用该有效负载，但仍未将请求有效负载格式化为data对象的每个元素作为单独的部分，我只看到一个字符串表示为{{1}的单个部分}：

data

使用v4身份验证将ng-file-upload上传到S3 - POST请求有效负载未正确形成

0 个答案: