关于 Safari 无法下载 pdf 文件的问题

pdf.js PDF预览与下载避坑:跨域、Blob与移动端Safari适配 PDF预览与下载是前端开发中常见的需求,pdf.js作为Mozilla开源的纯前端解析方案,凭借Canvas自绘能力和高度可控性,成为许多项目的首选。然而,在实现PDF下载时,开发者常遇到点击下载却变成预览的场景。这背后涉及浏览器对PDF资源的默认行为、同源策略、跨域资源共享(CORS)以及响应头Content-Disposition的配置等底层原理。理解这些机制,不仅能帮助开发者选择正确的下载策略,如使用a标签download属性、fetch+Blob强制下载或后端附件头方案,还能优雅处理移动端Safar 阅读详情

测试了很长时间,使用了各种方法,后来在一开源下载工具FileSaver.js的讨论中了解到苹果这边目前暂不支持

相关讨论帖

有用的讨论信息

No there is no alternative package if there where we would have fixed it already and the question have brought up many times.
So there is nothing we can do except to wait for ios to fix it
and since there is nothing to do i will close this.

But still, it does not show or popup the Download File dialog on IOS 11.4. I tried Safari, Chrome, and Firefox and all behaves in the same way. All the 3 browsers open the text file content in a new tab generating some weird filename which is visible on the tab title bar as well as in the URL bar.
Any idea of how can I popup a download file dialog to save the Text file in IOS? I am using AngularJS for my App Development.

So the conclusion here about safari is

  1. download attribute in safari is not supported
  2. It will try other means to save the blob by opening a new url
  3. If the mimetype can be rendered by safari it will be able to display it in a new tab
  4. If the mimetype is application/octet-stream:
    4.1 Create a base64 link with FileReader api
    4.2 try to open a new tab using window.open + base64 url
    4.3 if it was more then 1 sec before the user interaction happened it will use the current page instead
    but that is likely going to fail because (see first example using location.href) Failed to load resource: Frame load interrupted This may still work if the mimetype is not application/octet-stream and the saveAs was not called synchronous
  5. Safari don’t have anything like msSaveAs()
  6. safest way to force the file to be saved is to have a data:attachment/file" + base64 ready and open that link using window.open() when the user interacts with the website (or at least to it under 1 second)
  7. when saving it as a attachment filename will be “unknown”

I suppose that the opening in new tab is expected behavior for Safari <12 on iOS because the browsers do not have an access to file system. This gives the user a chance to save a file with an additional click to the cloud storage.

pdf.js实现PDF不预览直接下载:解决浏览器预览与文件下载冲突的完整方案 在线文档处理中,PDF的预览与下载常常被混为一谈,但它们在技术实现上属于完全不同的链路。浏览器内置的PDF查看器会在点击下载时优先预览,尤其在使用`<a download>`属性时,浏览器仍可能强制打开文件,导致文件下载失败或名称丢失。pdf.js作为前端解析PDF的核心库,主要负责渲染而非下载,要真正实现“不预览直接下载”,需要借助`getData()`获取原始二进制数据,再通过Blob重新封装并触发下载。这一思路能有效解决跨域文件、中文文件名乱码、iOS Safari强制预览等高频问题。在具体应用中,无 阅读详情

相关推荐

pdf js 手机上在线浏览pdf

pdf 在线浏览,适合手机上的百度文库,flexpaper在andorid手机上,qq浏览器不支持,可以使用pdf.js解决在手机上浏览pdf功能。

Mac常见问题|Safari下载文件没有反应的解决方法

很多小伙伴在使用Safari浏览器下载文件的时候,会发现下载之后没有反应,不知道下载文件是否下载成功?今天小编就给大家带来了Safari下载文件没有反应的解决方法,一起来看看吧~ 如果遇到Safari浏览器下载文件时没有任何反应,同时也没有任何提示信息,那么可能是你的浏览器禁止了该网站的文件下载权限,下面是具体的设置方法: “Safari 浏览器”>“偏好设置”然后点按“网站”。然后选择「下载项」,里面会有不同网站的下载权限的配置信息以及全局下载设置。▪请求:站点必须请求才能开始下载。 ▪拒绝:站点不

weixin_51582445的博客 6620

中国传媒大学计算机考研初复试经验贴

中传的计算机专业考研的话主要分为两大学院:计网学院和国重,大部分专业在计网学院。

DoKiDoK的博客 1565

js禁用浏览器 pdf 打印、下载功能(pdf.js 禁用打印下载、功能)

js禁用浏览器 pdf 打印、下载功能(pdf.js 禁用打印下载、功能)

从事前端,不断积累经验,学习新的技术。头像不是本人是莉莉崽(美貌、可爱集于一身的小姐姐,小仙女),一个宝藏博主,值得喜欢! 1万+

手把手教你配置微信商户平台IP白名单:企业付款到零钱必备步骤

本文详细解析了微信商户平台IP白名单的配置原理与实操步骤,这是实现企业付款到零钱功能的关键安全环节。文章从理解IP白名单的安全逻辑出发,指导开发者精准定位服务器公网IP,并提供了在商户平台后台的详细配置流程与常见问题排查指南,帮助开发者高效完成配置,确保企业付款API的顺利调用。

weixin_29326909的博客 738

近4000张真实城市场景行人数据集:YOLO训练实战指南

行人检测是计算机视觉在智能驾驶与机器人感知中的基础任务,其核心挑战在于模型对真实道路场景的鲁棒性——尤其在小目标、遮挡、光照变化及中国特有交通参与者(如外卖骑手、接娃家长)下的泛化能力。本文围绕轻量化、高覆盖、强落地性的近4000张实采图像,系统阐释如何构建面向YOLO系列模型的高质量训练数据集:从四维场景采样策略(光照-遮挡-尺度-姿态)出发,解析标注规范对检测精度的关键影响,并说明数据增强需服务于真实干扰源(雨痕、动态模糊、对比度衰减),而非盲目堆叠。该数据集专为已掌握YOLO训练流程的算法工程师、嵌入

weixin_32495691的博客 298

PDF.js禁止打印和下载,含后台权限控制

function download(blobUrl, filename) {}在这个下面写调用方法。1. 禁止打印搜索window.print = function print(){}在这个下面写调用方法。2.禁止下载(function (root, factory) {viewer.js中添加。

xnian_的博客 4032

利用正射影像对斜射图像进行反向投影

因此,RANSAC算法可以通过计算inliners和outliers的数量来评估估计关键点的质量,确保与其他点不一致的点不会在Homography矩阵中被估计。然后,它通过考虑关键点周围区域中图像的梯度大小和方向来计算每个提取的关键点的方向。由于单应性矩阵的计算可能会受到两个图像中异常值的存在的影响,这将导致矩阵的不正确估计并导致沿图像的对准和映射不良。FLANN匹配器的方法基于K近邻搜索的概念,即从图像中找到k个近邻。找到相机在正射影像坐标系中的位置并在正射影像上绘制重叠区域的边界框。

gis收藏家的博客 1513

浏览器无法下载PDF文件怎么办

其实就是浏览器的设置问题。 打开谷歌浏览器的设置 将按钮开关改到如下状态 再点击下载PDF的按钮就可以了。

此心安处 2万+

智能体开发套件(ADK)介绍

city } ---") city_normalized = city . lower() . replace(" " , "") # 模拟天气数据库 mock_weather_db = {

lpfasd123的博客 1412

【SpringBoot 4.x 第2节】夯爆了,学习 Spring Boot 4.x 前,需要具备哪些 Java 基础?

🏆 本文收录于 《滚雪球学 Spring Boot 4.x》 专栏。 本专栏面向 有一点 Java 基础,但没有系统学过 Spring Boot 的读者,采用“滚雪球式学习法”:先跑通、再理解、再重构、再上线,最终带你从第一个 Hello API 一路完成一个可部署、可监控、可扩展的后端项目。

**My Coding Family** 4572

pdf 无须浏览直接下载

最近页面有下载pdf需求,之前a标签有自带的图片下载,但是pdf浏览器默认会自动浏览打开,介绍一下此方法浏览器无须打开其他页面进行下载文件 浏览器 pdf 无须浏览直接下载 支持多种文件下载 downloadFile方法下载pdf 图片等 import { download,downloadFile} from "./download.js"; downloadFile(下载文件路径...

shanyanwt的博客 6450

在VINS-FUSION上处理KITTI数据集(双目+GPS)

VINS-Fusion 是一个开源的实时多传感器状态估计库,主要由香港科技大学的沈邵劼教授领导的研究团队开发。它是 VINS-Mono(单目视觉惯性系统)的扩展,支持多种传感器组合,如双目、立体相机和IMU。

如果想成为中心,那么就到中心去吧。 1206

hbase 只更新一个字段_苹果iOS14 Beta8系统更新,只带来一个变化

苹果这几天一直频繁上热搜,导致一进网站页面全是关于苹果的消息。这不,苹果又再一次更新了新系统--- iOS 14 Beta 8。不过目前还只是测试版本,此次更新包的大小只有 100 MB 左右,主要是稳定性的提升,与上一个版本没有很大的区别。之前的版本中 Safari 出现了下载 PDF 文件后无法打开的问题,Beta8 已经修复。但在Beta 7 中有部分同学出现了“暴露通知”无法正常开启的问题...

weixin_31784241的博客 148

ET2012新版免狗免安装绿色软件

ET2012新版免狗免安祖昂绿色软件。,新界面,新视觉,

假人有限元模型

假人模型,车辆碰撞假人有限元模型,适合做乘员安全的研究者利用

Safari浏览器下载PDF文件提示DLL文件丢失?解决方法汇总

如果知道具体的DLL文件名称,可以从可信来源下载对应的DLL文件,并将其放置到正确的系统目录下。如果在使用Safari浏览器下载PDF文件时遇到提示丢失DLL文件的问题,这可能并不是因为Safari本身或PDF文件的问题,而是Windows操作系统中缺少了某些必要的库文件。有时候,问题可能是由于Safari浏览器的版本过旧或者安装不完整导致的。确认您的计算机上已经安装了最新版本的Adobe Acrobat Reader或其他兼容的PDF阅读器软件,并且该软件能够正确打开PDF文件。

leleshengh520的博客 887

复分析 阿尔福斯(Ahlfors) 第三版答案 英文

答案分为十章,有部分习题没有答案,全英文复分析阿尔福斯(Ahlfors) 第三版答案

如何在iPhone或iPad上使用Safari下载文件

Khamosh PathakKhamosh PathakIn your work or personal life, you’ll sometimes need to download a file on your iPhone or iPad. Using the new feature introduced in iOS 13 and iPadOS 13, you can now do thi...

cum43546的博客 1万+

TMS_WebGMaps_1.9.8.0_Full_Source

TMS_WebGMaps_1.9.8.0_Full_Source 全源码 delphi cbuilder

在 Mac 上的 Safari 中下载时遇到问题?故障排除和修复的方法

在 Mac 上的 Safari 中下载时遇到问题?小编将告诉大家解决 Safari 下载丢失、卡住和丢失的方法。 一、检查您的默认下载文件夹 Safari 浏览器会将您下载的每个文件发送到 Mac 上的文件夹。不出所料,它使用下载作为默认位置。但是,您可以更改这一点,甚至可能没有意识到。 因此,您应该检查 Safari 发送下载的位置,并根据需要进行相应的更改。去做这个: 1.单击Safari(在 Mac 的顶部菜单栏中)并选择“偏好设置”。 2.选择“通用”选项卡,展开文件下载位置下拉框,选择“下载”(

weixin_48039619的博客 4687

mac safari无法打开网页_苹果设备上对于网页存储为 PDF 的一些探索

不同的苹果设备对于PDF的支持略有差异,在此只做一些对比。从网页上收集整理一些资料,如果兼顾打印或手写标注就可以优先考虑 PDF 格式,但是如何存储PDF却是一个问题。iOS 设备从网页创建 PDF在以前,iOS 设备的 Safari 只能从“打印”这个操作里面存储 PDF 格式,还有一种辅助方式为Workflow (捷径的前身,故下称捷径)提供的 Make PDF 。后来 Safari 自带创建...

weixin_32375369的博客 545

解决 iOS Safari/UC 浏览器无法下载后端生成的文件

在开发 PDF 转 Word 等在线文件转换工具时,前端通过 blob URL + JavaScript 触发下载的方案在 iOS 全系浏览器(Safari、UC、Chrome、微信内置)上完全失效,表现为点击下载无反应,或下载后报 OfficeImportErrorDomain 错误 912 无法打开。本文分析了两个根因:iOS WebKit 内核不支持脚本触发的 blob URL 下载,以及 application/octet-stream 通用 MIME 类型导致 iOS 无法识别文件格式。给出的解决

m0_37978198的博客 284

mac safari 下载pdf

版本:10.15.3 (1)在 Mac 上的 Safari 浏览器 App 中,点按 PDF 的链接。 (2)将指针移到浏览器窗口的底部中间以查看控制

FemaleHacker的博客 2990

分析和解决iPad上Chrome浏览器无法下载文件的问题

通过上述步骤,大多数关于iPad上Chrome浏览器下载文件的问题应该可以得到解决。如果问题仍然存在,建议联系Apple支持或Chrome客服获取进一步的帮助。

m0_73640344的博客 2588

PDF.JS-文件流方式在线展示pdf文件

目前所在项目要求实现在线预览PDF功能,于是百度查了一些资料,借鉴了一些大佬好的想法,特总结下来,供参考。 PDFJS是在线预览PDF的一款神器,官网地址:http://mozilla.github.io/pdf.js/ 下载后解压文件,直接拖进项目里就可以: 一些其博客说要把viewer.js里面的 defaultUrl: { value: "compressed.tracemonkey-pldi-09.pdf", kind: OptionKind.VIEWER .....

MJlife的博客 1万+

php生成内容加后缀,safari下载文件自动加了html后缀问题

如何下载文件?方法一、直接通过nginx下载静态文件如果文件是保存在服务器上面的,可以直接用nginx下载文件比如说可以供用户下载pdf文件,那么我的nginx配置可以是这样子的:location ~ /document/(.*)\.pdf$ {root /home/nemo/myfile;try_files /$uri 404;}按照上面的配置,当我请求 http://fbd.intelleee...

weixin_42191359的博客 518

使用pdf.js展示pdf文件(亲测可用)

2、从后端获取blob形式的pdf文件,具体怎么获取和后端商定(思路,后端提供一个接口,参数为文件链接,前端带参文件链接请求接口后,接口返回此文件链接的blob形式的文件流。老版本和新版本同时引入,当请求页面是判断当前客户端类型,若是ios则使用老版本的pdf.js文件。此链接可下载最新版本,不兼容老版本浏览器和苹果系统,若需在苹果展示则使用最上面。找到/web/viewer.js,搜索 fileOrigin,并注释以下代码段。3、获取到blob形式的pdf文件后,添加到iframe中,完成。

weixin_45816407的博客 9278
上一篇: Fix ReferenceError: Unknown plugin "transform-remove-strict-mode"
下一篇: 微信公众号检测本地App, 安装则打开,未安装则下载的实现方式
Wang's Blog
博客等级 码龄12年 7434粉丝 2421原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Wang's Blog

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值