Edge开启特定设置后crabbly/Print.js 1.6打印失效、预览不显示

这个问题是Edge浏览器PDF处理策略和Print.js的实现逻辑冲突导致的：

• 你开启的Edge设置作用是关闭内置PDF预览能力，所有PDF资源触发自动下载，不在浏览器页面内渲染
• 1.6版本的Print.js打印PDF时，会动态创建隐藏iframe，把传入的PDF地址（你这里是本地生成的blob对象URL）塞到iframe里，等iframe内置的PDF阅读器加载完文档，再调用浏览器打印接口拉起预览。
• 开启上述Edge设置后，iframe加载PDF地址时不会触发内置渲染，会直接走下载逻辑，iframe里拿不到可打印的文档内容，调用打印时自然会加载失败、预览出不来。
• 开发环境复现不了，通常是本地开发服务的资源上下文、跨域配置和生产环境存在差异，加上本地调试时Edge的安全策略、下载拦截规则更宽松，不会触发这个bug。

按改造成本从低到高排列：

• 升级Print.js到最新稳定版
  新版本已经针对浏览器拦截PDF内置渲染的场景做了兼容，检测到iframe加载异常时会自动走备用打印逻辑，基本不用改现有业务代码就能解决问题。
• 给现有打印逻辑加兜底判断
  如果暂时没法升级依赖，可以在调用打印方法时加异常回调和超时检测，内置打印走不通的时候直接打开PDF引导用户手动打印，参考代码：

  const bytes = convertBase64ToUint8Array(json.contentBase64)
  const blob = new Blob([bytes], { type: json.contentType });
  const url = window.URL.createObjectURL(blob);
  showMessage.success('成功将报告下载为PDF', url)
  
  let printReady = false
  print({ 
    printable: url, 
    type: 'pdf', 
    showModal: true,
    onLoadingEnd: () => {
      printReady = true
    },
    onError: () => {
      window.open(url, '_blank')
      showMessage.warn('当前浏览器设置阻止了自动打印预览，已打开PDF文件，请手动触发打印')
    }
  })
  
  // 3秒加载超时直接走兜底逻辑
  setTimeout(() => {
    if (!printReady) {
      window.open(url, '_blank')
      showMessage.warn('当前浏览器设置阻止了自动打印预览，已打开PDF文件，请手动触发打印')
    }
  }, 3000)
  

• 强制资源内联渲染
  如果PDF是从服务端返回的流，可以给响应头加Content-Disposition: inline，强制浏览器在页面内渲染PDF而不是触发下载。注意这个方案对前端本地生成的blob URL兼容性有限，优先选前两个方案。
• 换用pdf.js实现打印
  要是前面的方案都覆盖不到，可以放弃Print.js的PDF打印能力，引入pdf.js先把PDF渲染到隐藏canvas上，再调用canvas的打印接口，完全绕开浏览器内置PDF阅读器的设置限制，兼容性最好但改造成本最高。

内容的提问来源于stack exchange，提问作者user575219