vue调用手机浏览器打开pdf_在微信中调用外部浏览器实现文件下载之解决

本文介绍了如何在微信环境中使用Vue调用手机浏览器打开PDF并实现文件下载。针对微信更新导致的常见下载方案失效问题,提出了遮罩提示用户在新窗口打开的解决方案,并提供了纯JS、纯jQuery及jQuery+CSS+Div三种实现方式的代码资源。此外,还分享了一个优化版代码,支持用户点击下载链接后才弹出提示,并具备关闭功能。对于安卓设备,还提供了一种利用特殊JS代码自动跳出微信的方法。
摘要由CSDN通过智能技术生成

网传方案(已失效):

使用微信打开网址时,无法在微信内打开常用下载软件,手机APP等。网上流传的各种微信打开下载链接,微信已更新基本失效,最新的一个是使用链接跳转方式:·

http://mp.weixin.qq.com/mp/redirect?url=http://baidu.com#weixin.qq.com#wechat_redirect。

AAffA0nNPuCLAAAAAElFTkSuQmCC

遮罩解决方法

今天要加的是一个遮罩提示的解决方法:弹出一个遮罩提示用户在新的浏览器窗口打开。

再也不用管微信如何的更新,直接判断微信的ua,然后弹出一个遮罩提示用户在浏览器中打开下载。并且不加关闭的按钮。类似于下面这样子:

AAffA0nNPuCLAAAAAElFTkSuQmCC

这样子用户就只能在浏览器中打开,并且可以直接下载应用了。欢迎打开微信扫描查看(其他扫描没有效果)。

AAffA0nNPuCLAAAAAElFTkSuQmCC

演示和下载

我已经将代码上传到github上了,你可以直接下载我的图片和js来用。github地址

如果这个代码对你有用,希望你在下载时也点击star一下。

版本一:纯JS。

版本二:纯jQuery。

版本三:jquery+css+div(虽然操作复杂,但实际上平时常用这种)。

如果你已经将它用在你的项目中了,欢迎留下你的在线地址哦。

号外:由于这个代码一进入就是弹出提示,可能会影响用户其它操作,故而写了另一篇优化的代码,支持用户点击下载链接之后才弹出提示,并且还可以点击关闭。

终极解决方法

上面的方案其实可以再次优化:安卓手机可以利用特殊js代码自动跳出微信,在外部浏览器里打开(由于IOS系统限制,目前苹果只能使用遮罩解决方案)。

演示:

AAffA0nNPuCLAAAAAElFTkSuQmCC

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值