Quantcast
Channel: Ionic Forum - Latest topics
Viewing all articles
Browse latest Browse all 70429

Cordova Plugin Camera make base64 image that couldn't be decoded

$
0
0

@nirwannursabda wrote:

I have a problem when try to encode jpeg image into base64 in cordova-plugin-camera. It cannot be decoded into image

I install cordova plugin add cordova-plugin-camera in ionic project

My Setup

ionic version : 1.7.11

cordova version : 5.4.1

My Files

-------------------- index.html -------------------------

I add two lib

<script src="lib/ngCordova/dist/ng-cordova.js"></script>
<script src="cordova.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>

-------------------- js/app.js ------------------------------

var myApp = angular.module('starter', ['ionic', 'starter.controllers', 'ionic-datepicker', 'ngCordova'])
.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    if (window.cordova && window.cordova.plugins.Keyboard) {
        cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
       cordova.plugins.Keyboard.disableScroll(true);

   }

  if (window.StatusBar) {
    // org.apache.cordova.statusbar required
    StatusBar.styleDefault();
  }
 });
})

.config(function($stateProvider, $urlRouterProvider) {
  $stateProvider

 .state('app', {
    url: '/app',
    abstract: true,
    templateUrl: 'templates/login.html',
    controller: 'AppCtrl'
})
// if none of the above states are matched, use this as the fallback
   $urlRouterProvider.otherwise('/app/playlists');
});

myApp.config(function($compileProvider){
    $compileProvider.imgSrcSanitizationWhitelist(/^\s*(https?|ftp|mailto|file|tel):/);
})

---------------------- js/controller.js ---------------------------

angular.module('starter.controllers', [])

.controller('AppCtrl', function($scope, $ionicModal
      , $timeout, $ionicPopup, $http
      , $location, $state, $ionicLoading
      , $window, $cordovaCamera, $ionicPlatform) {

// Form data for the login modal
$scope.lastPhoto = "";

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

    var options = {
        quality: 70,
        destinationType: Camera.DestinationType.DATA_URL,
        sourceType: Camera.PictureSourceType.PHOTOLIBRARY,
        allowEdit: false,
        encodingType: Camera.EncodingType.JPEG,
        targetWidth: 200,
        targetHeight: 200,
        correctOrientation:true
    };

        $cordovaCamera.getPicture(options).then(function(imageData) {
            $scope.lastPhoto = "data:image/jpeg;base64," + imageData;

            var validatePopup = $ionicPopup.alert({
                title: 'show encoded string',
                template: imageData
            });

            validatePopup.then(function(res) {
                console.log('Finished encoded');
            });

            $http.get('http://192.168.0.116/api/inserttemp?params='+imageData).then(function (resp){
                console.log('send encoded string to server success', resp);
            }, function(err) {
                console.log('there is an error in api');
            });
        }, function(err) {
            console.log('there is an error in camera');
        });

    }, false);
  };
 };
})

--------------------------- /templates/login.html ---------------------

<ion-modal-view>
  <ion-header-bar>
    <h1 class="title title-center">Image Base 64</h1>
    <div class="buttons">
      <button class="button button-clear" ng-click="closeLogin()">Exit</button>
    </div>
  </ion-header-bar>
  <ion-content>
   <form ng-submit="">
      <div class="list">
        <div style="width:100%;">
          <img id="pictProfile" data-ng-src="{{lastPhoto}}" ng-src="{{lastPhoto}}" style="display: block;margin-left: auto;margin-right: auto">
       </div>
        <button style="padding-left:20px;margin-padding:20px;" ng-click="choosePicture()" class="button button-block button-positive" type="button">Choose Picture</button>
      </div>
    </form>
  </ion-content>
</ion-modal-view>

When i try to encode image from here
// http://coenraets.org/blog/wp-content/uploads/2013/11/cordova.jpg

it show different encoded string with using this online tools
https://www.base64-image.de/

I try to decode base64 with this online tools
http://codebeautify.org/base64-to-image-converter

Have anyone similar issue with this?

I appreciate any help Thanks

Best Regard, Nirwan

Posts: 1

Participants: 1

Read full topic


Viewing all articles
Browse latest Browse all 70429

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>