Ionic Framework - Camera Image Uploads and Base64 Strings
Hi Today Discussed Ionic Framework - Camera Image Uploads and Base64 Strings menas Ionic Framework Build Mobile Application Framework. Previously more discussed Ionic Framework Today Camera Take Picture image uploads and Base64 strings. This Task discussed more details followed.
 |
| Ionic Framework - Camera Image Uploads and Base64 Strings |
First Install Image Resizer Plugin
cordova plugin add https://github.com/timkalinowski/PhoneGap-Image-Resizer
Install the Actionsheet Plugin
cordova plugin add https://github.com/EddyVerbruggen/cordova-plugin-actionsheet
Install the Camera Plugin
cordova plugin add cordova-plugin-camera
The Code
We are using the camera plugin here, but I did not use Ionic Framework with ngCordova – Camera here for the sake of simplicity, I suspect you will get the same behavior if you are using the ngCordova – Camera module to access the camera.
getPicture: function (options) {
var q = $q.defer();
navigator.camera.getPicture(function (result) {
// Do any magic you need
q.resolve(result);
}, function (err) {
q.reject(err);
}, options);
return q.promise;
},resizeImage: function (img_path) {
var q = $q.defer();
window.imageResizer.resizeImage(function (success_resp) {
console.log('success, img re-size: ' + JSON.stringify(success_resp));
q.resolve(success_resp);
}, function (fail_resp) {
console.log('fail, img re-size: ' + JSON.stringify(fail_resp));
q.reject(fail_resp);
}, img_path, 200, 0, {
imageDataType: ImageResizer.IMAGE_DATA_TYPE_URL,
resizeType: ImageResizer.RESIZE_TYPE_MIN_PIXEL,
pixelDensity: true,
storeImage: false,
photoAlbum: false,
format: 'jpg'
});
return q.promise;
},
toBase64Image: function (img_path) {
var q = $q.defer();
window.imageResizer.resizeImage(function (success_resp) {
console.log('success, img toBase64Image: ' + JSON.stringify(success_resp));
q.resolve(success_resp);
}, function (fail_resp) {
console.log('fail, img toBase64Image: ' + JSON.stringify(fail_resp));
q.reject(fail_resp);
}, img_path, 1, 1, {
imageDataType: ImageResizer.IMAGE_DATA_TYPE_URL,
resizeType: ImageResizer.RESIZE_TYPE_FACTOR,
format: 'jpg'
});
return q.promise;
}
Supporting File Uploads To Parse
/********************************************************
* *
* @param _params.photo base64 representation of photo *
* @param _params.caption string to go with photo *
********************************************************/
savePhotoToParse: function (_params) {
var ImageObject = Parse.Object.extend("ImageInfo");
// create the parse file object using base64 representation of photo
var imageFile = new Parse.File("mypic.jpg", {base64: _params.photo});
// save the parse file object
return imageFile.save().then(function () {
_params.photo = null;
// create object to hold caption and file reference
var imageObject = new ImageObject();
// set object properties
imageObject.set("caption", _params.caption);
imageObject.set("picture", imageFile);
// save object to parse backend
return imageObject.save();
}, function (error) {
alert("Error " + JSON.stringify(error, null, 2));
console.log(error);
});
}
