Ionic 2 read images from data directory iOS

My app downloads images from an external resource to the data directory using FileTrasnfer. Now, in one of the pages of my app I’m supposed to display those images. The paths I used for the images is the exact path they were downloaded to, then I don’t understand why the images are not displayed, seems like there is no access to the file How can I access files in the file.datadirectory?

getfileimage() {
    const fileTransfer: FileTransferObject = this.transfer.create();
  let options ={
    headers:{
      'token': this.token,
      'sid': this.sid,
      'user': this.user,
      'type': "image",
      'file': this.FileName
    }

  }
    fileTransfer.download(this.apiUrl, this.file.dataDirectory + 'photo.jpg', true, options)
      .then(result => {

        console.log("getfileimage 2 :- " + JSON.stringify((result)));
        console.log("Response data ->>>>>>> :- " + JSON.stringify(result.nativeURL));
       // this.imageDis = normalizeURL(JSON.stringify(result.nativeURL));
        this.imageDis = JSON.stringify(result.nativeURL);
        //console.log("getfileimage :- " +this.imageDis);
      }, (err) => {
        console.log("Error is: " + JSON.stringify(err)); 

      });

output :----- getfileimage :- “file:///var/mobile/Containers/Data/Application/E806FDE7-1AF2-4DA2-BC07-E5FEC2E422ED/Library/NoCloud/photo.jpg” 2018-02-26 17:28:11.911819+0530 MyApp[607:174952] THREAD WARNING: [‘File’] took ‘10.540039’ ms. Plugin should use a background thread. 2018-02-26 17:28:11.936391+0530 MyApp[607:174952] WARNING: sanitizing unsafe URL value “file:///var/mobile/Containers/Data/Application/E806FDE7-1AF2-4DA2-BC07-E5FEC2E422ED/Library/NoCloud/photo.jpg” (see http://g.co/ng/security#xss) 2018-02-26 17:28:11.970340+0530 MyApp[607:174952] localFile :- cdvfile://localhost/library-nosync/photo.jpg

1 Like