Shop Bild Firebase Speicherung von cordova Kamera Plugins auf Ionic

Question

ich rot habe einige Themen zu diesem Thema (zB: Uploading image to Firebase Storage from Cordova app) aber nicht fand meine Antwort ...

Ich arbeite an einem Projekt IONIC mit der Implementierung des ngCordova Kamera-Plugins, um Fotos zu machen und Bilder von der Bibliothek zu bekommen.

Also habe ich das Ergebnis als Image-URI und ich möchte es in Firebase-Speicher hochladen (als Datei oder Blob). Hier ist mein Code:

$scope.fromCamera = function() { 
$ionicPlatform.ready(function() { 

    var options = { 
    quality: 75, 
    destinationType: Camera.DestinationType.FILE_URI, 
    sourceType: Camera.PictureSourceType.CAMERA, 
    allowEdit: true, 
    encodingType: Camera.EncodingType.JPEG, 
    targetWidth: 300, 
    targetHeight: 300, 
    saveToPhotoAlbum: true e 
    }; 

    $cordovaCamera.getPicture(options).then(function(imageURI) { 
    window.resolveLocalFileSystemURL(imageURI, function (fileEntry) { 
     fileEntry.file(function (file) { 
     var reader = new FileReader(); 
     reader.onloadend = function() { 
      // This blob object can be saved to firebase 
      var blob = new Blob([new Uint8Array(this.result)], { type: "image/jpeg" });     

      // Create the storage ref 
      var ref = storageRef.child('images/test'); 
      // Upload the file 
      uploadPhoto(blob, ref); 

     }; 
     reader.readAsArrayBuffer(file); 
     }); 
    }, function (error) { 
     console.log(error) 
    }); 
    }); 

}); 

};

Ich lese die Datei und wandle sie in einen Blob, bevor ich sie in Firebase hochlade. Und ich habe einen 'Codierungsfehler' erhalten, der mir mitteilt, dass "ein URI, der der API bereitgestellt wurde, fehlerhaft war oder die resultierende Daten-URL die Beschränkungen der URL-Länge für Daten-URLs überschritten hat."

Ich benutze es ein Chrome-Browser mit der Cordova Mocks-Erweiterung.

Jede Hilfe ist willkommen! Dank

Answer 1

uploadPhoto() ist meine Funktion die Datei auf Feuerbasis Speicher (und speichern Sie die URL in Firebase Datenbank)

var storageRef = Firebase.storageRef(); 
var databaseRef = Firebase.databaseRef(); 

var uploadPhoto = function(file, ref) { 
    var task = ref.put(file); 
    // Update progress bar 
    task.on('state_changed', function(snapshot){ 
    // nothing 
    }, function(error) { 
    // Handle unsuccessful uploads 
    }, function() { 
    // Handle successful uploads on complete 
    $scope.downloadURL = task.snapshot.downloadURL; 
    $scope.actualKey = databaseRef.child('posts').push().key; 

    databaseRef.child('posts/' + $scope.actualKey).update({ 
     url : $scope.downloadURL, 
     id : $scope.actualKey, 
     time : firebase.database.ServerValue.TIMESTAMP, 
    }); 
    } 
); 

}

Answer 2

versuchen zu ändern ...

[new Uint8Array(this.result)] 

hochladen

nur

[this.result] 

alternativer Ansatz $cordovaFile

var fileName = imageURI.replace(/^.*[\\\/]/, ''); 

$cordovaFile.readAsArrayBuffer(cordova.file.tempDirectory, fileName) 
    .then(function (success) { 
    // success - get blob data 
    var imageBlob = new Blob([success], { type: "image/jpeg" }); 

     // Create the storage ref 
     var ref = storageRef.child('images/test'); 
     // Upload the file 
     uploadPhoto(imageBlob, ref); 

    }, function (error) { 
    // error 
    }); 

Statt ich den Weg von der URI, im Code verwendet wird, gehe ich davon aus dem folgenden ...

// modify the image path when on Android 
    if ($ionicPlatform.is("android")) { 
    path = cordova.file.cacheDirectory 
    } else { 
    path = cordova.file.tempDirectory 
    } 

fühlen sich frei, den Pfad zu analysieren, um das Verzeichnis zu erhalten