2016-05-24 5 views
0

Ich habe eine App in Ionic Framework gebaut, und das Backend dieser App hat eine Rails App Administrator Panel mit Content-Editor, Benutzerkontrolle, Bild-Uploads (mit Carrierwave).Umgang mit hochgeladenen Assets in Rails (Backend) in einer Ionic (Cordova) App

Ich machte eine API, die die prägnante Informationen zu Ionic App zurückgibt. Und isoliert das Rails-Admin-Panel in einem privaten Netzwerk. Ich bekomme vollständig Inhalte, Beziehungen von den anderen Objekten, und sendet sie per JSON zur Ionic App.

Aber ich verstehe nicht, wie richtig mit hochgeladenen (über Carrierwave) Vermögenswerte handelt, um die Bilder in meiner Ionic App zu zeigen.

Danke,

Antwort

0
then first you have to add 3 plugins which are below 
  1. cordova Plugin org.apache.cordova.file-Transfer

  2. cordova Plugin hinzufügen org.apache.cordova.file

  3. cordova Plugin hinzufügen hinzufügen org.apache.cordova.camera

Code unten und Schädlings in Ihrem Controller und kopieren Bild von Galerie auswählen und hochladen auf Server

$scope.editProfileImgGallary = function() { 
    navigator.camera.getPicture(uploadEditProfilePhotosImage, onFailEditProfilePhoto, { 
     targetWidth: 512, 
     targetHeight: 512, 
     quality: 40, 
     correctOrientation: true, 
     allowEdit: true, 
     destinationType: navigator.camera.DestinationType.FILE_URI, 
     sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY 
    }); 
    } 

    function onFailEditProfilePhoto(message) { 
    // alert('Failed because: ' + message); 
    } 

    function uploadEditProfilePhotosImage(imageURI) { 
    // $ionicLoading.show({ 
    // template: '<p>Loading...</p><ion-spinner icon="bubbles"></ion-spinner>' 
    // }); 
    console.log(imageURI); 
    // var img = document.getElementById('userEditProfileImg'); 
    // img.src = imageURI; 
    var options = new FileUploadOptions(); 
    options.fileKey = "file"; 
    options.fileName = imageURI.substr(imageURI.lastIndexOf('/') + 1); 
    options.mimeType = "image/jpeg"; 
    var ft = new FileTransfer(); 
    ft.upload(imageURI, encodeURI('uploadimg.php'), winEditProfilePhotos, failEditProfilePhotos, options); 
    } 

    function winEditProfilePhotos(r) { 
    console.log("Code = " + r.responseCode); 
    console.log("Response = " + r.response); 
    console.log("Sent = " + r.bytesSent); 
    // $ionicLoading.hide(); 
    } 

    function failEditProfilePhotos(error) { 
    console.log("upload error source " + error.source); 
    console.log("upload error target " + error.target); 
    // $ionicLoading.hide(); 
    // var alertPopup = $ionicPopup.alert({ 
    // title: 'Uh Oh!', 
    // template: 'You Get Some Error Please Try Again..' 
    // }); 
    } 

und kopieren Sie brüllen Code und Schädlings in Ihre HTML-Seite onClick Ereignis

<div ng-click="editProfileImgGallary();" ></div>