angular - Capturing images in ionic2 and then storing them locally on phone -


i using cordova plugin camera capture user's profile picture. want store in app.

here code captures it:

 camera.getpicture({       quality : 75,       destinationtype : camera.destinationtype.data_url,       sourcetype : camera.picturesourcetype.camera,       allowedit : true,       encodingtype: camera.encodingtype.jpeg,       targetwidth: 300,       targetheight: 300,       savetophotoalbum: false     }).then(imagedata => {       this.base64image = "data:image/jpeg;base64," + imagedata;      }, error => {       console.log("error -> " + json.stringify(error));     }); 

once image captured, want store locally can display on profile page. clue how can ?

you use cordova-plugin-file. change option

destinationtype : camera.destinationtype.data_url,

for

destinationtype: camera.destinationtype.file_uri (android) or

destinationtype: camera.destinationtype.native_uri (ios)

because data_url can memory intensive , cause app crashes or out of memory errors. should use file_uri or native_uri if possible.

so idea grab path image on device. that, can move photo folder created app (which in permanent storage) , can use path show photo in profile page. when used cordova plugin file not part of ionic native, code little bit ugly...

camera.getpicture(/*...theoptions*/).then(  (imagepath) => {      // create new file name using username or      let adate = new date(),      atime = adate.gettime(),      username = this.mycustomuserservice.getusername(),      newfilename = username + atime + ".jpg";       // returns reference actual file located @ imagepath      window.resolvelocalfilesystemurl(imagepath,      (file) => {           // returns reference file system          window.requestfilesystem(localfilesystem.persistent, 0,          (filesys) => {               // gets reference app directory, , if doesn't exist creates              filesys.root.getdirectory('yourappfoldername', {create: true, exclusive: false},              (directory) => {                   // moves file directory, new name                  file.moveto(directory, newfilename,                  // file succesfully moved , returns reference it. can use nativeurl grab                  // path image on device                  (fileentry) => {                      this.mycustomuserservice.setprofilephotourl(fileentry.nativeurl);                  },                   // start handing errors happen                  (error) => {                      // file unable moved                      // show error user                      // ...                  });              },               (error) => {                  // not reference app folder                  // show error user                  // ...              });          },           (error) => {              // not reference file system              // show error user              // ...          });      });  },   (err) => {       // not take picture       // show error user       // ...  }); 

Comments