Mobile phone album image compression and uploading Based on H5 + API,

Mobile phone album image compression and uploading Based on H5 + API,

// The Master function App () {}/ *** image compression. By default, the same proportion of compression x @ param {Object} path * can be a relative path on the pc side, however, on the mobile terminal, the input path must be the absolute path for storing the photographic image * @ param {Object} obj *. The Object has width, height, and quality (0-1) * @ param {Object} callback * The callback function has a base64 string data */App. prototype. dealImage = function (path, obj, callback) {var img = new Image (); img. src = path; img. onload = function () {var that = this; // by default, the var w = that is compressed proportionally. width, h = that. height, scale = w/h; w = obj. width | w; h = obj. height | (w/scale); var quality = 0.7; // The default image quality is 0.7 // generate canvas var canvas = document. createElement ('canvas '); var ctx = canvas. getContext ('2d '); // create an attribute node var anw = document. createAttribute ("width"); anw. nodeValue = w; var anh = document. createAttribute ("height"); anh. nodeValue = h; canvas. setAttributeNode (anw); canvas. setAttributeNode (anh); ctx. drawImage (that, 0, 0, w, h); // image quality if (obj. quality & obj. quality <= 1 & obj. quality> 0) {quality = obj. quality;} // The smaller the quality value, the blurrier the image to be drawn. var base64 = canvas. toDataURL ('image/jpeg ', quality); // The callback function returns the base64 value callback (base64 );}} /*** get image post-processing callback processing data * @ param {Object} delobj * Object parameter to be processed * @ param {Object} cb * The callback function returns the data to be processed, including the source file size, processed file size, file name */App. prototype. delPhotoMsg = function (delobj, cb) {var camera = plus. camera. getCamera (); var res = camera. supportedImageResolutions [0]; var fmt = camera. supportedImageFormats [0]; var _ this = this; var fileObj = {origin :{}, now :{}}; // callback object interface // get the camera to take a photo of camera. captureImage (function (path) {plus. io. requestFileSystem (plus. io. PRIVATE_WWW, function (fs) {fs. root. getFile (path, {create: true}, function (fileEntry) {fileEntry. file (function (file) {// console. log ("original file size:" + file. size/1024 + "KB filename:" + file. name); origin (file. size, file. name) ;}})}) function origin (filesize, filename) {// mobile end image compression processing plus. io. resolveLocalFileSystemURL (path, function (entry) {var local = entry. toLocalURL (); // obtain the local address // image compression processing _ this. dealImage (local, delobj, function (base) {fileObj. now. base64Char = base; fileObj. now. base64Length = base. length; fileObj. now. fileSize = (base. length/1024 ). toFixed (2) + "KB"; fileObj. origin. fileSize = (filesize/1024 ). toFixed (2) + "KB"; fileObj. origin. filePath = local; fileObj. fileName = filename; cb (fileObj) ;}}}, function (err) {console. log ("photo retrieval error:" + err. message) ;},{ resolution: res, format: fmt})}/***** @ param {Object} del * parameter objects to be processed directly * example: "{width: 100, height: 100, quality: 0.5}" * by default, you only need to set width or height, quality default 0.7 * @ param {Object} options * image processing attributes processing file format multiple select multiple files for Batch Processing * example: {filter: "image", multiple: true} * @ param {Object} callback * The callback function returns the corresponding parameter * returned Object array, including the size of the original file * For example, obj [0]. origin. fileSize, obj [0]. now. fileSize, obj [0]. now. filePath and so on */App. prototype. delGalleryImg = function (del, options, callback) {var _ this = this; var fileObj = {now :{}, origin :{}} plus. gallery. pick (function (eve) {if (options. multiple) {delmultiple (eve); // multiple photo processing callback function} else {delsingle (eve); // Single Image Processing callback function }}, function (err) {console. log (err. message) },{ filter: options. filter | "image", multiple: options. multiple | false}) // function for processing multiple images delmultiple (eve) {for (var I = 0, len = eve. files. length; I <len; I ++) {// console. log (I + ":" + eve. files [I]) (function (I, len) {// because this is an asynchronous operation, you need to automatically execute the function to input the index value to the function for automatic retValue (eve. files [I], function (filepro) {// console. log (JSON. stringify (filepro) inner (I, len, filepro) ;}) (I, len)} var cbobj = []; // function inner (index, len, result), a character array for saving json strings {// console. log (index + "" + JSON. stringify (result); cbobj. push (JSON. stringify (result); // if the object is directly pushed to a value, the same object element (unknown) exists, so an if (cbobj. length = len) {var tempobj = []; // call back the array of the object after parsing the string (var I = 0; I <len; I ++) {// traverse all files for String Parsing var obj = JSON. parse (cbobj [I]) tempobj [I] = obj;} callback (tempobj); // callback array object }}// process a single image function delsingle (path) {// call the internal function callback function to select a single external image. Processing attribute callback retValue (path, function (filepro) {callback (filepro) ;});} function retValue (path, cb) {plus. io. requestFileSystem (plus. io. PRIVATE_WWW, function (fs) {fs. root. getFile (path, {create: true}, function (fileEntry) {fileEntry. file (function (file) {// console. log ("original file size:" + file. size/1024 + "KB filename:" + file. name); origin (file. size, file. name) ;})}) // Callback function origin (filesize, filename) {// mobile image compression plus. io. resolveLocalFileSystemURL (path, function (entry) {var local = entry. toLocalURL (); // obtain the local address // image compression processing _ this. dealImage (local, del, function (base) {fileObj. now. base64Char = base; fileObj. now. base64Length = base. length; fileObj. now. fileSize = (base. length/1024 ). toFixed (2) + "KB"; fileObj. origin. fileSize = (filesize/1024 ). toFixed (2) + "KB"; fileObj. origin. filePath = local; fileObj. fileName = filename; cb (fileObj );})})}}}

This example is developed based on HBuilder. When mobile APP photos and photos are uploaded and album images are compressed,

Don't like it, don't spray it, hope you have more advice in this area.