什么是 PWA 应用？
PWA 全称是 Progressive Web Apps，是一种既可以像 Native 应用一样提供原生级别的用户体验，又可以通过 Web 技术进行开发的应用。PWA 应用可以在多种操作系统和多种设备上运行，不需要用户下载安装即可使用，同时也可以在离线情况下进行部分功能操作。
PWA 应用如何打开外部应用？
在一些场景下，PWA 应用需要与外部应用进行交互，比如调起微信支付或者调起电话号码拨打等。下面介绍两种常见的打开外部应用方式。
1. 使用 a 标签打开链接
在 PWA 应用中，可以使用 a 标签打开链接的方式来启动外部应用。例如，想要调起电话号码拨打，可以在 HTML 中使用如下代码：
-- ------------------------
这样用户点击链接时，就会打开外部电话应用并自动填入电话号码。
同样地，如果要打开微信支付，可以在 HTML 中使用如下代码：
-- ---------------------------------------------------------------------------------------
注意，这里使用的是 weixin 协议头，而不是 http 或 https。
需要注意的是，使用 a 标签打开链接的方式有一个缺点，那就是无法监听用户是否真正打开了链接。如果用户没有安装对应的应用，会直接跳转至对应的应用商店下载应用，而且这个过程是不可控的。
2. 使用 Web Share API 分享
除了使用 a 标签打开链接的方式，PWA 应用还可以使用 Web Share API 分享的方式来启动外部应用。Web Share API 是浏览器提供的一个 API，用于实现 Web 与原生应用之间的分享功能。PWA 应用可以使用这个 API，将需要分享的内容分享到手机上的各种应用中。
例如，要分享一个网页链接，可以使用如下代码：
-- ----------------- -
-----------------
------ -------
----- -------
---- ------
--
-------- -- --------------------
--------- -- -----------------------
- ---- -
-------------------------
-如果用户的设备支持分享功能，则会弹出分享面板，选择对应的分享应用分享即可。
需要注意的是，使用 Web Share API 分享的方式也有一个缺点，那就是不是所有浏览器都支持这个 API，而且目前只有 iOS 和 Android 系统的原生浏览器以及 Chrome 和 Safari 等少数几种浏览器支持。
总结
在 PWA 应用中，要打开外部应用有两种方式：使用 a 标签打开链接和使用 Web Share API 分享。其中，使用 a 标签打开链接的方式适用范围较广，但用户不能知道是否真正成功打开了链接；使用 Web Share API 分享的方式则需要用户设备支持分享功能，但操作过程更安全、简单。在实际开发中，可以根据需求选择合适的方式。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/654762f87d4982a6eb1c1bb4