Cordova文件传输：上传图片至AWS S3

Question

我正在使用ng-cordova文件传输插件将图片上传到我的AWS s3存储桶。

但是我遇到了两个问题，第一是它无法工作，第二是我不知道如何在模拟器上运行应用程序时调试问题。

以下是我的代码：

.controller('newItemCtrl', function($scope, $http, API_URL, me, $cordovaFileTransfer) {
       var s3URI = encodeURI("https://mybucketname.s3.amazonaws.com/"),
                policyBase64 = "MY_BASE64_ENCODED_POLICY_FILE",
                signature = "MY_BASE64_ENCODED_SIGNATURE",
                awsKey = 'my AWSAccessKeyId',
                acl = "public-read";

        var options = {
            fileKey: "avatar",
            fileName: "image.png",
            chunkedMode: false,
            mimeType: "image/png"
    //        params = {
    //            "key": fileName,
    //            "AWSAccessKeyId": awsKey,
    //            "acl": acl,
    //            "policy": policyBase64,
    //            "signature": signature,
    //            "Content-Type": "image/png"
    //        }
        };

        var imageURI = '../img/ionic.png';
        $scope.upload = function($cordovaFileTransfer) {

            $cordovaFileTransfer.upload(s3URI, imageURI, options)
                .then(function(result) {
                    console.log("SUCCESS: " + JSON.stringify(result.response));
                }, function(err) {
                    console.log("ERROR: " + JSON.stringify(err));
                }, function(progress) {
                    // constant progress updates
                });
        }
})

我也留下了params代码，想问另一个问题，但在运行应用程序之前，它给出了关于params的错误提示。我的问题是为什么在调用与该控制器相关联的模板之前就出错了。

- Ahmad Elmoualem

Answer 1

我曾经遇到类似的问题，为了进行调试，我使用了实时服务器日志来检查文件上传是否成功到达服务器，我注意到了一些错误：

• 我的服务器期望得到不同的文件键
• Access-Control-Allow-Origin头没有在服务器响应中正确发送

然后，我还安装了cordova原生通知插件（链接在这里），并在文件传输回调中添加警报以查看进程中哪里出现了问题。

总之，可能不是最好的调试方法，但它有效。

希望可以帮到你。

……还有一件事情，“选项”中的“params”部分似乎在以这种格式应用时效果最佳：

    var options = {
        fileKey: "avatar",
        fileName: "image.jpg",
        /*params: {
          "value1":"value1",
          "value2": "value2"
        }*/
    };

    var params = new Object();
    params.value1 = "value1";
    params.value2 = "value2";
    options.params = params;

从 Cordova docs 中得知："params: 是在 HTTP 请求中传递可选键/值对的一组。 （对象）" 因此，传入一个字典可能会有微妙的差异，我不确定，但我知道只要做出这个更改，它就可以运行。

- Emile Esterhuizen

---

如何在服务器上访问“params”对象？已经尝试了几个小时，但没有成功。 - jpgrassi

我经常在Google App Engine上使用webapp2，并且在那里像平常的post一样访问"params"，所以类似这样："self.request.get('param_name')"。对于文件对象，我使用了self.request.POST['image']，其中'image'是我用作文件键的名称。 - Emile Esterhuizen

基本上，您可以从POST对象中获取它们，可能需要记录整个HTTP POST以找到正确的语法。 - Emile Esterhuizen

我使用了ngCordova实现的FileTransfer插件。我尝试了所有方法，但无法获取params对象。然后我切换到原生的FileTransfer插件，它可以正常使用POST['field']获取params。不知道是包装器出了问题还是我没有正确使用它。无论如何，谢谢！ - jpgrassi

Answer 2

为了在模拟器上进行调试，我从我的应用程序目录中使用以下命令：ionic emulate ios -lc

这会将错误或日志显示在控制台中。

- Ezequiel Salas