javascript - 在 chrome IOS 选项卡上打开 base64 pdf

标签 javascript ios google-chrome pdf

我正在生成一个 base64 pdf,我只需要在另一个 iOS chrome 选项卡中显示它。我有以下代码。

if (navigator.userAgent.includes('CriOS')) {
  var base64PDF = base64ArrayBuffer(response.data);
  var win = window.open();
  win.document.write('<iframe id="myIframe" width="600" height="315" src="data:application/pdf;base64,' + base64PDF + '" frameborder="0" allowfullscreen ></iframe>');
  win.document.write('<script>window.open(window.document.getElementById("myIframe").src) </script>');

} else if (navigator.userAgent.includes('iPad') || navigator.userAgent.includes('iPhone')) {
  var base64PDF = base64ArrayBuffer(response.data);
  window.location.assign('data:application/pdf;base64,' + base64PDF);
}

该代码让我在 iframe 上显示 pdf,但是当我这样做时,window.location.href 是生成 pdf 的 url,而选项卡中的 url 是 about:blank。

所以我决定在文档中编写一个脚本,使用 iframe 的 src 执行 window.open 但我在另一个选项卡中得到一个空白页面。

我正在寻找在 chrome 选项卡的 url 中设置 data:application/pdf;base64,..... 这将向用户显示“打开方式”选项,他将有类似的选项,通过 gmail 或邮件等发送。实际上我不能这样做,因为 url 是 about:blank 并且不是有效的 PDF base64 链接。

我已经尝试过类似的东西 window.location、window.open、window.location.href、window.location.assign,以编程方式创建一个标签并单击它以更改 href,打开 about:blank 选项卡时不会发生任何其他事情。

当我尝试时,类似于 window.location.href = 'data:application/pdf;base64,.....;return false;' , google chrome 重定向到 url 正确的新选项卡,但返回 false;最后一部分或url中的句子,以便做一个错误的pdf。

我不知道为什么您无法以编程方式打开该数据:应用程序......但是如果您像我在本文开头提到的那样创建一个 iframe,然后用手指将 iframe 拖动到另一个选项卡,chrome 打开data:application......在选项卡的url中。

最佳答案

var divpdf = document.createElement('div');
divpdf.innerHTML = '<object  style="display:none;" id="docuFrame" type="application/pdf" width="1px" height="1px" data="' +
linkSource + '"></object>';
document.lastElementChild.appendChild(divpdf);
var frame = document.getElementById('docuFrame') as HTMLObjectElement;
window.open(frame.data);
frame.remove();
divpdf.remove();

关于javascript - 在 chrome IOS 选项卡上打开 base64 pdf,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53964697/

相关文章:

javascript - 如何使用 Angular 将 firebase 数据绑定(bind)到 fullCalendar

google-chrome - Chrome Dev Tools中的自动换行功能?

node.js - Express 静态网络请求卡在 "pending"

ios - 翻转后 UIView 的框架发生变化

javascript - 设置cookie并自动登录

javascript - 在 setTimeout 回调函数中保留 event.clientX 值

javascript - 试图让 iPhone 上的链接正常工作

javascript - 如何通过重复使用相同的功能在 Canvas 上动态绘制?

ios - UITextView .isEmpty 不适用于键盘发送 Swift

ios - MPMoviePlayerController 隐藏音量 slider