[FIXED] Preview File from assets folder

[andreiradoi]

Hi,

Using Ionic 4, how would a path for a file located in /assets directory look like?

I've tried using:

• file://assets/filename.pdf
  • file.applicationDirectory + '/public/assets/filename.pdf' (ionic-native file plugin)

But I am getting 'The requested URL was not found on this server.'

I've checked my simulator directory and the file is there.

Thanks

[mostafa-mansour1]

Try relative directly

try relative path ‘/assets/file.pdf’

Regards,

---

Mostafa Mansour Software Engineer 00971 524988466 0020 1113019196

On 27 Aug 2020, at 5:49 PM, andreiradoi notifications@github.com wrote:



Hi,

Using Ionic 4, how would a path for a file located in /assets directory look like?

I've tried using:

• file://assets/filename.pdf
• file.applicationDirectory + '/public/assets/filename.pdf' (ionic-native file plugin)

But I am getting 'The requested URL was not found on this server.'

I've checked my simulator directory and the file is there.

Thanks

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHubhttps://github.com/mostafa-mansour1/previewAnyFile/issues/10, or unsubscribehttps://github.com/notifications/unsubscribe-auth/ABSFOB7TWRJIOCRAVS4C45LSCZP7TANCNFSM4QNANTBA.

[andreiradoi]

"unsupported URL" for any urls that don't have file://

I am using an iPad Simulator with iOS 13.5 if it's any help.

Thanks a lot for your help!

[andreiradoi]

Hi Mostafa,

By any chance, did you find the time to check out this issue?

Thanks,

[mostafa-mansour1]

the trick is to get the blob or base64 of the asset file

check this code

import { PreviewAnyFile } from '@ionic-native/preview-any-file/ngx';
import { File } from '@ionic-native/File/ngx';
import { HttpClient } from '@angular/common/http';

constructor(
private http: HttpClient,
private file: File,
private previewAnyFile: PreviewAnyFile,)

preview(){
    let assetPath = './assets/files/preview.pdf';
    this.http.get(assetPath, { responseType: 'blob' }).subscribe(fileBlob => {
      let fileName = assetPath.replace(/^.*(\\|\/|\:)/, '');
      const writeDirectory = this.platform.is('ios') ? this.file.syncedDataDirectory : this.file.externalDataDirectory;
      this.file.writeFile(writeDirectory, fileName, fileBlob, { replace: true }).then(fileProp => {
        this.previewAnyFile.preview(fileProp.nativeURL);
      })
    });
}

[andreiradoi]

Beautiful!

Thank you so much!

[mostafa-mansour1]

there is a new version from the plugin, in this version you can use the previewAsset method directly without any extra codes