iOS端Google搜索App中tel/mailto链接无法点击的解决方案咨询

问题描述 #

使用代码 <a href="tel:+6421212121"> Call Button </a> 创建的电话拨号链接，在iOS的Safari、Chrome、Firefox及Edge浏览器中均可正常触发拨号，但在iOS端Google搜索App内点击无任何响应。

可通过以下工匠类网站测试该问题（滚动至页脚查看电话号码链接）：

https://housepainterauckland.co.nz/
https://www.thehousepainters.co.nz/
https://superiorpainters.co.nz/

已尝试方案（无效） #

参考过通过JavaScript触发拨号的方案，该方案在常规浏览器中有效，但在Google搜索App内依旧无法正常工作。

可行解决尝试 #

1. 标准化tel链接属性 #

给<a>标签添加rel="external"属性，明确告知WebView这是外部协议链接，避免被内部拦截：

<a href="tel:+6421212121" rel="external">Call Button</a>

同时确保号码格式严格遵循tel:+[国家码][纯数字号码]的规范，不要包含空格、括号等额外字符。

2. 用JavaScript直接触发拨号（兼容WebView） #

放弃<a>标签，改用按钮结合JS事件触发拨号，同时添加触摸事件监听适配Google搜索App的WebView特性：

<button id="callButton">Call Button</button>
<script>
const callBtn = document.getElementById('callButton');
// 处理点击事件
callBtn.addEventListener('click', handleCall);
// 额外处理触摸事件，适配WebView触摸逻辑
callBtn.addEventListener('touchstart', handleCall);

function handleCall(e) {
  e.preventDefault();
  window.location.href = 'tel:+6421212121';
}
</script>

3. 排查页面全局事件拦截 #

检查页面中是否存在全局的click、touchstart事件监听代码，这些代码可能在Google搜索App的WebView中阻止了tel链接的默认行为，尝试临时移除相关拦截代码测试是否恢复正常。

内容的提问来源于stack exchange，提问作者mardag