PWA 上的特殊链接（电话：、邮件：、短信：）

Posted 2023-03-05

【中文标题】PWA 上的特殊链接（电话：、邮件：、短信：）

【英文标题】：Special links (tel:, mailto:, sms:) on PWA

【发布时间】：2018-05-12 14:56:32

【问题描述】：

我正在开发一个网站，使用 PWA 在手机上创建原生风格的 App。

我面临的问题是，当应用程序添加到主屏幕后，以 tel:、mailto: 或 sms: 开头的链接不再起作用。

在 android 上的普通 chrome 浏览器中，这些都可以正常工作 - tel 链接打开拨号器，mailto 链接打开邮件应用程序，sms 链接打开 SMS 应用程序。

只是当你通过 PWA 打开它们时，它们最终会出现如下所示的空白屏幕：

我怎样才能让它在 PWA 中像在浏览器中一样工作？

【问题讨论】：

forum 中也报告了此问题。如果您认为这是一个错误，您可以file a report 处理此问题。

我已代表您向bugs.chromium.org/p/chromium/issues/detail?id=792990 提交了此帖子中的详细信息。请在该问题上“加注星标”并回复任何后续信息请求。

我投票结束这个问题，因为这是一个错误报告，应该通过 Chromium 问题跟踪器解决。

根据bugs.chromium.org/p/chromium/issues/detail?id=792990#c8，这应该在最新的 Chrome Canary 版本中得到修复。

【参考方案1】：

刚遇到这个问题。有一个目标为“_blank”的链接阻止了 SMS: URI 在我的主屏幕启动的网络应用程序中触发：

<a href="sms:?body=Hello" target="_blank">

从链接中删除“目标”属性解决了问题：

<a href="sms:?body=Hello">

【参考方案2】：

在 Chrome 65.0.3325.109 上测试，tel: 在我在 onClick 处理程序中使用 window.location.href='tel:[phone]') 时工作正常，正如 https://bugs.chromium.org/p/chromium/issues/detail?id=792990#c2 所建议的那样

但是，当我尝试 window.open('tel:[phone]') 时，它对我不起作用。