在以 HTML 和 CSS 制作的 PhoneGap 应用程序中打开 PDF答案

【问题标题】：Open PDF in the PhoneGap App that is made in HTML and CSS在以 HTML 和 CSS 制作的 PhoneGap 应用程序中打开 PDF
【发布时间】：2013-07-05 09:56:23
【问题描述】：

我的 iPad 应用在 Phone Gap 中有一个奇怪的问题。问题是我必须通过链接在我的应用程序中打开 PDF 文档，当我单击打开 PDF 的链接时，它会显示没有返回链接的 PDF 文档。

因此，当我通过链接在我的应用中打开 PDF 文档时，它会将我带入死胡同，我无法返回应用的主页。

我的问题是，当我打开一个可以带我回到主页的 PDF 时，我怎样才能拥有一个顶栏？ iPad 的任何内部元素都可能是？

非常感谢。

【问题讨论】：

标签： css html cordova

【解决方案1】：

尝试使用 In App Browser 插件。

如果您使用的是更高版本的 Phonegap / Cordova 版本（2.8.0、2.9.0 等），它应该随附 - 无需安装其他任何东西。

http://docs.phonegap.com/en/2.9.0/cordova_inappbrowser_inappbrowser.md.html#InAppBrowser

它将允许您在覆盖您的应用程序的新“窗口”中打开 PDF。它有一个“完成”按钮，用户可以使用它来关闭它并在完成后返回您的应用。

您可以使用应用内浏览器打开 PDF，使用如下方式：

window.open('http://whitelisted-url.com/pdftoopen.pdf', '_blank');

即_blank 选项触发应用内浏览器插件。如果您改用_system，它可能在 iBooks 中打开它（只是在那里猜测 - 不能 100% 确定它是否会使用 iBooks）。

【讨论】：

有人碰巧知道为什么这对我也不起作用吗？我使用 iPhone 4 和 Cordova 3。
我不明白“它应该附带它”。我使用的是cordova 3.6，是的，您确实已经安装了org.apache.cordova.inappbrowswer 以使其正常工作。这很好用。谢谢！
@Gallwynmasc - 对于 Cordova 版本 2.x，默认包含许多插件（包括 In App Browser）。在 3.x 中，插件都是可选的，你可以安装你想要的。

【解决方案2】：

尝试在 URL 中添加 https://docs.google.com/viewer?url= 前缀

喜欢，window.open('https://docs.google.com/viewer?url=http://www.example.com/example.pdf&embedded=true', '_blank', 'location=yes');

【讨论】：

这需要用户登录 Google Drive。还要确保对 url 参数进行编码。聪明的解决方案。
我将 PDF 上传到 Google Drive 并将共享设置为公开，然后共享链接。我不相信这种方法需要用户登录。

【解决方案3】：

尝试使用以下步骤从 URL 打开任何类型的文档：

安装这个插件：cordova plugin add https://github.com/ti8m/DocumentHandler
使用此代码：

handleDocumentWithURL(function() { console.log('success'); }, function(error) { console.log('failure'); if (error == 53) { console.log('No app that处理此文件类型。'); } }, 'http://www.example.com/path/to/document.pdf');

它适用于我在 Android 和 IOS 上。我用它来打开 images 和 PDF 文件。

Android ：如果可用，它会使用系统应用程序打开文件，否则会给出错误，您可以处理。

IOS : 它在弹出窗口中打开文件，例如带有完成按钮和选项按钮的视图。

它不显示您的文档 URL。

来源可在此处获得：https://github.com/ti8m/DocumentHandler

【讨论】：

【解决方案4】：

感谢 asgeo1，

我使用window.open()解决了这个问题。

<a href="#" onclick="window.open('http://12example.pdf', '_blank', 'location=no');"><img src="images/samplens.jpg" border="0" /></a>

希望对你有帮助。

【讨论】：

是的，当使用phonegap时，window.open会触发我提到的In App Browser插件；）

【解决方案5】：

我最终使用了WebIntent

如here 所述。棘手的部分是修改 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;

【讨论】：