Open imhoffd opened 3 years ago
Hi, thanks for creating this, so is there no solution on how to simply open a pdf with an app using capacitor? I've been trying since last week with this and now I'm considering switching back this app to Cordova
How are you doing this in Cordova?
How are you doing this in Cordova?
I'm not, this is my first time working with pdf files in Ionic. But for Cordova I've found a bit more information. Right now I'm following this tutorial to see if maybe I'm lucky
Anyone made some progress here? I am also tinkering about it. But I guess opening it in the build in browser and let that one display his own PDF controls is the easisiest solution right now. I would really like to not install 4 cordova plugins do display PDF's.
Hi, in my case, I ended up using this plugin:
https://github.com/stephanrauh/ngx-extended-pdf-viewer
Is originally designed for Angular but adapting to Ionic was not very difficult
@LuisManuel1983 how did you got it working with Capacitor urls? I mean capacitor://localhost/_capacitor_file....
. Here it just says "Unexpected server response (0) while retrieving pdf ---".
@muuvmuuv sorry I've only worked with standard URL's to show a PDF that is hosted online, not local files. That "capacitor link" is unknown to me... btw did you try the plugin I suggested?
https://github.com/stephanrauh/ngx-extended-pdf-viewer
If your error is with that plugin I would suggest to look at the issues there, the creator of that plugin is really awesome and helpful
@LuisManuel1983 I am already using that plugin. I guess it just has something to do with pdj.js trying to parse the url different when having a custom protocol.
Works with Ionic & Capacitor (pdf does not load with live reload when developing, because of CORS, but works fine otherwise)
https://github.com/stephanrauh/ngx-extended-pdf-viewer can use your local capacitor// url to open locally stored files.
const uriResult = await Filesystem.getUri({
directory: Directory.Data,
path: `filename.pdf`,
});
// the path to the file
const path = uriResult.uri;
// convert to capacitor//
const localFileURL = Capacitor.convertFileSrc(path);
(you can also get the url with cordova and old ionic plugins)
Is there a solution for a React based Ionic App? I'm getting the error:
[Log] PDFJS.express: Development environment detected. This license key is currently registered to {mydomain} (PDFJSDocumentType.js, line 64020, x2)
The problem seems to be that capacitor://localhost isn't {mydomain} and furthermore doesn't qualify as localhost according to PDFJS.
Perhaps we can write a plugin that uses Swift and Kotlin native APIs to display PDF?
I have url of pdf which i am downloading using capacitor-community/http for file opener I am using capacitor-community/file-opener I am getting error like this File Dest file:///Users/parameswarmeher/Library/Developer/CoreSimulator/Devices/DC5D6B85-FD86-4D98-BE33-D7A767C0415C/data/Containers/Data/Application/FB862B43-FC24-458D-A5FD-FC9FA7C181A5/Documents/DOCUMENTS/test.pdf ERROR MESSAGE: {"message":"Unable to download file","errorMessage":"Unable to download file","code":"DOWNLOAD"} ⚡️ [error] - {"message":"Unable to download file","errorMessage":"Unable to download file","code":"DOWNLOAD"} ⚡️ [error] - Error downloading or opening the file: {"code":"DOWNLOAD","errorMessage":"Unable to download file"}
could you help me what I am doing wrong
here is my code
async getPdfBase64(url: string): Promise<void> {
try {
const remoteUrl = 'https://www.w3.org/WAI/ER/tests/xhtml/testfiles/resources/pdf/dummy.pdf';
const fileName = 'test.pdf'
// Define the file path and options
const filePath = `${Directory.Documents}/${fileName}`;
// Download the file
const options: any = {
url: remoteUrl,
filePath: filePath,
fileDirectory: Directory.Documents,
method: 'GET',
};
const response: any = await Http.downloadFile(options);
console.log("respo", response)
// Check if the file was downloaded successfully
if (response.status !== 200) {
throw new Error(`Failed to download file: ${response.statusText}`);
}
const fileOpenerOptions: FileOpenerOptions = {
filePath: filePath,
contentType: 'application/pdf',
openWithDefault: true,
};
await FileOpener.open(fileOpenerOptions);
console.log('File downloaded and opened successfully!');
} catch (error) {
console.error('Error downloading or opening the file:', error);
}
}
https://github.com/mozilla/pdf.js
ref: https://github.com/capacitor-community/proposals/issues/15#issuecomment-659244394