通过SendGrid发送的HTML邮件内Deep link移动端无法打开App求助

问题根因 #

• SendGrid默认开启的链接点击跟踪功能仅支持HTTP/HTTPS协议的链接，你使用的exampleapp://自定义协议会被该功能过滤/替换，导致链接失效
• 绝大多数邮件客户端默认禁用HTML表单提交行为，你最初使用form表单的方案本身就不兼容邮件场景
• 部分邮件客户端（如Gmail、Outlook）会主动拦截非HTTP/HTTPS开头的自定义协议链接，防止恶意跳转

解决方案 #

1. 关闭SendGrid当前邮件的链接跟踪 #

在Node.js调用SendGrid API的配置中添加关闭点击跟踪的参数，避免自定义协议链接被修改：

const msg = {
  to: '收件人邮箱',
  from: '发件人邮箱',
  subject: '重置密码',
  html: '你的邮件HTML内容',
  // 新增以下配置关闭当前邮件的点击跟踪
  mailSettings: {
    clickTracking: {
      enable: false,
      enableText: false
    }
  }
}

2. 替换按钮实现为A标签模拟样式 #

完全删除form表单结构，使用a标签直接绑定deeplink，同时保留原按钮的视觉样式：

<!-- 替换原来的form区块 -->
<div>
  <a href="exampleapp://resetpassword/" target="_blank" style="background: #00008B; padding: 10px 50px; border: none; color: #FFF; text-decoration: none; display: inline-block;">
    Reset Password
  </a>
</div>

3. 可选：添加降级兼容逻辑 #

如果仍有部分客户端拦截自定义协议，可以先将链接指向你的HTTPS域名下的落地页，在落地页中通过JS触发deeplink跳转，同时补充App未安装时跳应用商店的兜底逻辑，兼容性更好。

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