Javascript 403禁止使用预先签名的URL向S3发布错误

Javascript 403禁止使用预先签名的URL向S3发布错误,javascript,angularjs,amazon-web-services,post,amazon-s3,Javascript,Angularjs,Amazon Web Services,Post,Amazon S3,我一直在尝试使用lambda生成的预签名URL将文件上载到s3。每次我收到错误时:net::ERR\u CONNECTION\u中止。已正确获取预签名的URL 编辑:我已经更新了代码,现在是: angular.module("root", []) .config(function ($httpProvider) { "use strict"; $httpProvider.defaults.withCredentials = true; }) .controller("index"

我一直在尝试使用lambda生成的预签名URL将文件上载到s3。每次我收到错误时:net::ERR\u CONNECTION\u中止。已正确获取预签名的URL

编辑:我已经更新了代码,现在是:

angular.module("root", [])
.config(function ($httpProvider) {
    "use strict";
    $httpProvider.defaults.withCredentials = true;
})
.controller("index", ["$scope", "$http",
    function ($scope, $http) {
        "use strict";
        $scope.status = null;
        $scope.upload = function () {
            if ($scope.image === undefined) {
                $scope.status = "No image selected";
                return;
            }
            $scope.contentType = $scope.image.type;

            $scope.status = "Fetching presigned URL";

            var presignedRequest = {
                "request": "uploadImage",
                "fileName": $scope.image.name,
                "acl": "public-read"
            };

            $http.post(
                "https://2eprazdmue.execute-api.us-east-1.amazonaws.com/prod",
                presignedRequest
            ).then(function successCallback(response) {
                $scope.status = "Uploading image to s3";

                var responseData, fields, postData, key, postConfig, field, uploadForm;
                responseData = response.data;
                fields = responseData.fields;

                postData = new FormData();
                postData.append("key", fields.key);
                postData.append("AWSAccessKeyId", fields.AWSAccessKeyId);
                postData.append("acl", fields.acl);
                postData.append("policy", fields.policy);
                postData.append("signature", fields.signature);
                postData.append("x-amz-security-token", fields["x-amz-security-token"]);
                postData.append("file", $scope.image);
                postData.append("Content-Type", $scope.image.type);

                $http.post(responseData.url, postData, {
                    transformRequest: angular.identity,
                    headers: {"content-Type": undefined}
                }).then(function successCallback(response) {
                    $scope.status = "Successfully uploaded " + $scope.image.name;
                }, function errorCallback(response) {
                    $scope.status = response;
                });
            }, function errorCallback(response) {
                $scope.status = "Unable to fetch presigned URL";
            });
        };
    }])
.directive('fileModel', [
    '$parse',
    function ($parse) {
        "use strict";
        return {
            restrict: 'A',
            link: function (scope, element, attrs) {
                var model, modelSetter;
                model = $parse(attrs.fileModel);
                modelSetter = model.assign;

                element.bind('change', function () {
                    scope.$apply(function () {
                        if (attrs.multiple) {
                            modelSetter(scope, element[0].files);
                        } else {
                            modelSetter(scope, element[0].files[0]);
                        }
                    });
                });
            }
        };
    }
]);
我现在不再得到一个net::ERR\u CONNECTION\u中止错误,但我得到了一个403禁止错误。我已经成功地发送了一个请求,手动将请求负载输入到HTML表单输入中,因此我假设标题(或我的代码)就是问题所在

JS生成的头文件:

Accept:application/json, text/plain, */*
Accept-Encoding:gzip, deflate, br
Accept-Language:en-GB,en;q=0.8,en-US;q=0.6,ms;q=0.4,th;q=0.2
Connection:keep-alive
Content-Length:2936843
Content-Type:multipart/form-data; boundary=----WebKitFormBoundaryuyWiXZ6LvawWckxV
Host:demo-aws-cms.s3.amazonaws.com
Origin:https://s3.amazonaws.com
Referer:https://s3.amazonaws.com/demo-aws-cms/Upload.html
User-Agent:Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36
由HTML表单生成的标题:

Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8
Accept-Encoding:gzip, deflate, br
Accept-Language:en-GB,en-US;q=0.8,en;q=0.6
Cache-Control:max-age=0
Connection:keep-alive
Content-Length:2936831
Content-Type:multipart/form-data; boundary=----WebKitFormBoundaryC6YNH9mHnueC7mex
Host:demo-aws-cms.s3.amazonaws.com
Origin:null
Upgrade-Insecure-Requests:1
User-Agent:Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36
为了更好地衡量,以下是未成功请求的请求有效负载:

------WebKitFormBoundaryalO5LJ55Rh2wHelZ
Content-Disposition: form-data; name="key"

images/${filename}
------WebKitFormBoundaryalO5LJ55Rh2wHelZ
Content-Disposition: form-data; name="AWSAccessKeyId"

ASIAJPB3BN4YMCEOFROA
------WebKitFormBoundaryalO5LJ55Rh2wHelZ
Content-Disposition: form-data; name="acl"

public-read
------WebKitFormBoundaryalO5LJ55Rh2wHelZ
Content-Disposition: form-data; name="policy"

eyJjb25kaXRpb25zIjogW3siYWNsIjogInB1YmxpYy1yZWFkIn0sIFsiY29udGVudC1sZW5ndGgtcmFuZ2UiLCAwLCA4OTIwMDAwXSwgWyJzdGFydHMtd2l0aCIsICIkQ29udGVudC1UeXBlIiwgImltYWdlLyJdLCB7ImJ1Y2tldCI6ICJkZW1vLWF3cy1jbXMifSwgeyJrZXkiOiAiaW1hZ2VzL0lNR18yMDE2MDcyMF8xNzM3NTQuanBnIn0sIHsieC1hbXotc2VjdXJpdHktdG9rZW4iOiAiRlFvRFlYZHpFTEwvLy8vLy8vLy8vd0VhREJFMGJKd1lManlzT0QrazBTTFlBazh5elo2cG4vVFJpVVRVcmo4VC9Yc2srWllxRm40WUdoY3F3K3lSV2NPenZlWUt0ME1wZC9EdW9Ic0dKeFpENjBMRzNZVTZkbmYwdU5xYldiN2trbTdUOWJUTmpRdjNSaDltWGpTTnFsS0xObUNYZmN5d2Rlbk8xN3lXTSsza1g0RlhISzZGcVN2YmY5bjBnUVF6MFJMSFcyU1hyZmhhUXNxeEV1ZE1pWWI0aVI2WVNYK1J1dUhiSTRFS29OczkweUhjRWhPamduVlNoajdwTXFZWWJNaCtLUmR0WTlXSjB5cDhoeUhJQ3lHNmRZUlNRUXgzVWR5bGVKWWxQY1ErK1VONEV2TjdiY1dZeE12TTV5Wm1rSzVNVVJOR3BvUFVUY0N2MWxDZUNVZ0JxSGVuUDIzTng5RHJ0OEVjTFlRUmNDdWdFUldkTjZtU1NkdFNOWmlpcUVydzdvckpjZ2pzbHRYaUF5eTFFNkVDTmMwSFVHYXdlU3Q3SUd3bVJmTGRVQWh6SWpuRDZzRG5idzJsUjdUU2JIRU83T1BWbUQ5aXlLYzdtakN6TXRnVWpySmVXa0R4NTVZbUZ2RlpNNW9tQVdSTEgyVDJ3L1VaS0lYN3NyNEYifV0sICJleHBpcmF0aW9uIjogIjIwMTYtMDktMDVUMDU6MDM6MzhaIn0=
------WebKitFormBoundaryalO5LJ55Rh2wHelZ
Content-Disposition: form-data; name="signature"

2bc4CnEFkS25/drg26AtMT6Qmtw=
------WebKitFormBoundaryalO5LJ55Rh2wHelZ
Content-Disposition: form-data; name="x-amz-security-token"

FQoDYXdzELL//////////wEaDBE0bJwYLjysOD+k0SLYAk8yzZ6pn/TRiUTUrj8T/Xsk+ZYqFn4YGhcqw+yRWcOzveYKt0Mpd/DuoHsGJxZD60LG3YU6dnf0uNqbWb7kkm7T9bTNjQv3Rh9mXjSNqlKLNmCXfcywdenO17yWM+3kX4FXHK6FqSvbf9n0gQQz0RLHW2SXrfhaQsqxEudMiYb4iR6YSX+RuuHbI4EKoNs90yHcEhOjgnVShj7pMqYYbMh+KRdtY9WJ0yp8hyHICyG6dYRSQQx3UdyleJYlPcQ++UN4EvN7bcWYxMvM5yZmkK5MURNGpoPUTcCv1lCeCUgBqHenP23Nx9Drt8EcLYQRcCugERWdN6mSSdtSNZiiqErw7orJcgjsltXiAyy1E6ECNc0HUGaweSt7IGwmRfLdUAhzIjnD6sDnbw2lR7TSbHEO7OPVmD9iyKc7mjCzMtgUjrJeWkDx55YmFvFZM5omAWRLH2T2w/UZKIX7sr4F
------WebKitFormBoundaryalO5LJ55Rh2wHelZ
Content-Disposition: form-data; name="file"; filename="IMG_20160720_173754.jpg"
Content-Type: image/jpeg


------WebKitFormBoundaryalO5LJ55Rh2wHelZ
Content-Disposition: form-data; name="Content-Type"

image/jpeg
------WebKitFormBoundaryalO5LJ55Rh2wHelZ--