在用 HTML 和 CSS 制作的 PhoneGap 应用程序中打开 PDF
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/17520348/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Open PDF in the PhoneGap App that is made in HTML and CSS
提问by Steve
I have a strange problem with my iPad App in Phone Gap. The problem is that I have to open PDF document in my app through links and when I click the link which opens the PDF, it shows me the PDF document with no back link.
我的 iPad 应用程序在 Phone Gap 中有一个奇怪的问题。问题是我必须通过链接在我的应用程序中打开 PDF 文档,当我单击打开 PDF 的链接时,它会向我显示没有反向链接的 PDF 文档。
Hence, when I open the PDF document in my app through a link, it takes me to a dead end and there is no way I can go back to the main page of my app.
因此,当我通过链接在我的应用程序中打开 PDF 文档时,它会将我带到死胡同,我无法返回我的应用程序的主页。
My question is that how can I have a Top-Bar, when I open a PDF which could take me back to my home page? Any internal element for the iPad may be?
我的问题是,当我打开一个可以带我回到我的主页的 PDF 时,我怎么能有一个顶栏?iPad 的任何内部元素可能是?
Thanks a lot.
非常感谢。
回答by asgeo1
Try using the In App Browser plugin.
尝试使用应用内浏览器插件。
If you're using a later Phonegap / Cordova version (2.8.0, 2.9.0 etc) it should come with it - nothing else to install.
如果您使用的是较新的 Phonegap / Cordova 版本(2.8.0、2.9.0 等),它应该随附 - 无需安装其他任何东西。
http://docs.phonegap.com/en/2.9.0/cordova_inappbrowser_inappbrowser.md.html#InAppBrowser
http://docs.phonegap.com/en/2.9.0/cordova_inappbrowser_inappbrowser.md.html#InAppBrowser
It will allow you to open the PDF in the a new 'window' that overlays your app. It has a 'Done' button that users can use to close it and return to your app when they are finished.
它将允许您在覆盖您的应用程序的新“窗口”中打开 PDF。它有一个“完成”按钮,用户可以使用它关闭它并在完成后返回到您的应用程序。
You would open the PDF using the In-App Browser, using something like this:
您将使用应用内浏览器打开 PDF,使用如下内容:
window.open('http://whitelisted-url.com/pdftoopen.pdf', '_blank');
I.e. the _blank
option triggers the In-App Browser plugin. If you were to use _system
instead it mightopen it in iBooks (just guessing there - not 100% sure if it would use iBooks).
即该_blank
选项会触发应用内浏览器插件。如果您_system
改用它,它可能会在 iBooks 中打开它(只是在那里猜测 - 不能 100% 确定它是否会使用 iBooks)。
回答by BetRob
Try prefixing https://docs.google.com/viewer?url=
in the URL
尝试https://docs.google.com/viewer?url=
在 URL 中添加前缀
like, window.open('https://docs.google.com/viewer?url=http://www.example.com/example.pdf&embedded=true', '_blank', 'location=yes');
喜欢, window.open('https://docs.google.com/viewer?url=http://www.example.com/example.pdf&embedded=true', '_blank', 'location=yes');
回答by SANAT
Try this to open any kind of documents from URL using following steps:
尝试使用以下步骤从 URL 打开任何类型的文档:
- install this plugin : cordova plugin add https://github.com/ti8m/DocumentHandler
use this code :
handleDocumentWithURL(function() { console.log('success'); }, function(error) { console.log('failure'); if (error == 53) { console.log('No app that handles this file type.'); } }, 'http://www.example.com/path/to/document.pdf');
- 安装这个插件:cordova插件添加https://github.com/ti8m/DocumentHandler
使用此代码:
handleDocumentWithURL(function() { console.log('success'); }, function(error) { console.log('failure'); if (error == 53) { console.log('No app that handle this file '); } }, ' http://www.example.com/path/to/document.pdf');
It works for me both on Android and IOS. I used it for open imagesand PDFfiles.
它在 Android 和 IOS 上都适用于我。我用它来打开图像和PDF文件。
Android: It opens files using system apps if available, otherwise it give an error, which you can handle.
Android:如果可用,它会使用系统应用程序打开文件,否则会出现错误,您可以处理。
IOS: It opens files in popup like view with Done button and Option button.
IOS:它使用“完成”按钮和“选项”按钮在弹出式视图中打开文件。
It doesn't show your docs URL.
它不会显示您的文档 URL。
Source is available here : https://github.com/ti8m/DocumentHandler
来源可在此处获得:https: //github.com/ti8m/DocumentHandler
回答by lucas
I've ended up using WebIntent
我最终使用了WebIntent
as described here. The tricky part was to modify WebIntent.java to properly identify file type:
作为描述在这里。棘手的部分是修改 WebIntent.java 以正确识别文件类型:
String type = obj.has("type") ? obj.getString("type") : null;
// New code starts
Uri uri = obj.has("url") ? Uri.parse(obj.getString("url")) : null;
String extension = MimeTypeMap.getFileExtensionFromUrl(obj.getString("url"));
if(extension != null){
MimeTypeMap mimeTypeMap = MimeTypeMap.getSingleton();
type = mimeTypeMap.getMimeTypeFromExtension(extension);
}
// New code ends
JSONObject extras = obj.has("extras") ? obj.getJSONObject("extras") : null;
回答by Steve
Thanks asgeo1,
谢谢 asgeo1,
I solved it by using window.open()
.
我通过使用解决了它window.open()
。
<a href="#" onclick="window.open('http://12example.pdf', '_blank', 'location=no');"><img src="images/samplens.jpg" border="0" /></a>
Hope it helps.
希望能帮助到你。