[求助] 移动端 h5 页面被嵌入到 APP 中, h5 端的下载 pdf 功能受到影响

2021-01-14 12:02:43 +08:00
 sybb

小弟接手维护了一个移动端的小网站,有一个导出 pdf 文件的功能,被客户引入到了他们的 APP 中,下载功能异常。

技术栈

服务端:Node.js / TypeORM / Apollo / GraphQL / MySQL

前端:Vue / Nuxt.js / Vuetify

前后端都使用 TypeScript,采用 Docker 部署。

pdf 实现方法

后端用puppeteer 生成 pdf 文件到服务端某个用 nginx 配置好的静态文件夹中,返回 url 给前端用动态生成 a 标签的方法生成下载。

问题

在移动端的 Safari 和 Chrome 中都能正常下载并打开以及保存到本地,但是在客户的 APP 中,下载时候会打开 pdf 文件(我猜是预览),导致没办法操作页面了,并且打开的文件显示乱码。

补充

所以,有没有老哥知道为什么 APP 中功能表现异常? h5 有办法能实现内嵌在别的应用后还能使用下载功能吗?

3011 次点击
所在节点    Node.js
7 条回复
thinkingbullet
2021-01-14 12:19:14 +08:00
iOS 不允许直接在浏览器中打开文件(下载文件)
sam014
2021-01-14 12:19:32 +08:00
APP webview 配置的问题?
Carseason
2021-01-14 12:21:14 +08:00
nginx 为这类文件强制下载方式呗。不然带 pdf 预览的都是会直接预览
sybb
2021-01-14 12:32:39 +08:00
@thinkingbullet 虽然我不太清楚你说的打开和下载是怎样的情况,但是这边再 nginx 中设置 content-type 什么后 目前已实现了在浏览器中下载并不会自动打开的哈,Safari 的表现是先弹出一个下载提示确认框,点击确认后,就在地址栏后面有一个正在下载的图标了。


@sam014 我甚至还不确定使用什么方式引入进去的


@Carseason 已经设置了哈, 在浏览器中打开能直接下载,但是在他们的 APP 中就不行,并且打开后还乱码
whypool
2021-01-14 12:37:48 +08:00
正常,要实现下载,app 开接口,申请写入文件权限才行
meepo3927
2021-01-14 14:54:52 +08:00
应该是 iOS 需要针对处理, 不能像 Android 或者桌面端一样直接下载。

同 1 楼和 5 楼 。
woxihejinghao
2021-01-14 15:27:15 +08:00
iOS 需要 APP 那边进行处理

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/744847

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX