Meteor Slingshot Cordova / Android“错误:无法将文件上传到云存储[-0]”

时间:2016-08-16 22:02:19

标签: android cordova meteor amazon-s3 meteor-slingshot

我有一个使用弹弓上传到AWS / S3的meteor / cordova应用程序。我可以从浏览器和iOS上传和查看应用内的照片。

但是,在Android上我无法从弹弓提供的AWS链接加载照片并存储在我的数据库中,当我尝试上传照片时,我收到的错误信息如下:

    "error : failed to upload file to cloud storage [-0]"

有什么特定于Android的我错过了/我应该做什么来配置slingshot /我的应用程序一般为Android?任何帮助将非常感谢。谢谢!

相关的客户端代码(减去文件限制):

//upload to AWS once file is selected
'change #imgUpload' : function(){
  var uploader = new Slingshot.Upload("uploadFiles");
  var questionId = Session.get('selectedQuestion');
  uploader.send(document.getElementById('uploadInput').files[0], function (error, downloadUrl) {
    if (error) {
      // Log service detailed response
      console.log(error)
      console.error('Error uploading' );
      alert (error);
    }
    else {
      Meteor.call('uploadImage', questionId, downloadUrl);
    }
  });

相关的服务器端方法:

  'uploadImage' : function(questionId, downloadUrl){
check(questionId, String);
check(downloadUrl, String);
questionsList.update({_id: questionId},
                      {$set: {
                        picUrl: downloadUrl
                      }
                    });
}, //end upload image

相关的服务器端指令(减去文件限制):

Slingshot.createDirective("uploadFiles", Slingshot.S3Storage, {
  bucket: <bucketname>,
  acl: "public-read",


  authorize: function(){
    //you can't upload if youre not logged in
    if(!this.userId){
      var message = "Please log in before posting files";
      throw new Meteor.Error("Login Required", message);
    }
    return true;
  },

  key: function(file){
    //store file in a directory based on a users team name
    var teamName = Meteor.user().roles.defaultGroup[0]
    return teamName + "/" + file.name;
  }
});

相关的mobile_config.js访问规则:

App.accessRule('https://<app-name>.herokuapp.com/*');
App.accessRule('http://<app-name>.herokuapp.com/*');
App.accessRule('https://s3.amazonaws.com/<bucketname>/*');
App.accessRule('http://localhost:3010/*');

显示图片的相关模板:

  {{#if theQuestion.picUrl}}
        <img src="{{theQuestion.picUrl}}" width="300px" height="300px"  class="userPic">
  {{/if}}

上传pic的相关模板:

<template name="uploader">
  <form id="imgUpload">
    <input id='uploadInput' class="fileLoader" name="file" type="file">
    <label for="file" class="uploadWords">Tap here to upload/take a  picture</label>
  </form>

文件限制:

    Slingshot.fileRestrictions("uploadFiles", {
  allowedFileTypes: ["image/png", "image/jpeg", "image/gif"],
  maxSize: 10 * 1024 * 1024 // 10 MB (use null for unlimited)
});

2 个答案:

答案 0 :(得分:0)

如果有其他人遇到这个问题,我将在未来参考时,我最终撕毁流星弹弓并与https://github.com/Lepozepo/S3一起去。它运作良好。

随时向我发送任何代码的消息,但我基本上使用了示例中提供的样板代码。

答案 1 :(得分:0)

遇到同样的问题,我发现的是这个。 我们使用Webkit创建的文件对象与Andriod上可用的文件对象不同。 Webkit上的File Object构造函数是

new File([Blob],"FileName.png",{type: "image/png"});

与Cordova不同的是,在使用&#39; uploader.send&#39;时解决问题。而不是传递文件对象(内部由Meteor / Cordova创建)直接传递Blob对象,我用来创建blob对象的代码是

b64toBlob = function(b64Data, contentType, sliceSize) {
contentType = contentType || '';
sliceSize = sliceSize || 512;

var byteCharacters = atob(b64Data.split(',')[1]);
var byteArrays = [];

for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) {
    var slice = byteCharacters.slice(offset, offset + sliceSize);

    var byteNumbers = new Array(slice.length);
    for (var i = 0; i < slice.length; i++) {
        byteNumbers[i] = slice.charCodeAt(i);
    }

    var byteArray = new Uint8Array(byteNumbers);

    byteArrays.push(byteArray);
}

var blob = new Blob(byteArrays, {type: contentType});
return blob;}

我最终通过的方式构建了我的代码

    if (Meteor.isCordova) {
    console.log("Detected Mobile device");
    var blobFile = b64toBlob(data, "image/png");
    blobFile.name = "userPhoto.png";
    newFile = blobFile;
} else {
    newFile = new File([b64toBlob(data, "image/png")], "usePhoto.png", {type: "image/png"});
}
uploader.send(newFile, function (error, downloadUrl) {
//Deal with the download URL
}