Braintree Apple Pay集成问题：Safari环境下检测不支持Apple Pay

我之前也踩过类似的坑，结合你的环境（Safari 11.1 + macOS 10.13.4 + 沙箱环境），给你列几个关键排查点：

1. 确认客户端初始化时机 #

很多人会在DOM未完全加载时就调用检测方法，导致判断失准。务必把检测逻辑放在DOMContentLoaded事件回调里，或者页面末尾加载：

document.addEventListener('DOMContentLoaded', function() {
  braintree.client.create({
    authorization: '你的沙箱授权token'
  }, function(err, clientInstance) {
    if (err) {
      console.error('客户端初始化失败:', err);
      return;
    }
    // 在此执行Apple Pay支持检测
    braintree.applePay.isSupported({
      client: clientInstance,
      merchantIdentifier: '你的Apple Pay商户ID'
    }, function(supportedErr, supportedResult) {
      if (supportedErr) {
        console.error('检测出错:', supportedErr);
        return;
      }
      if (supportedResult.isSupported) {
        // 渲染Apple Pay按钮
      } else {
        console.log('当前环境不支持Apple Pay');
      }
    });
  });
});

2. 核对商户ID与域名配置 #

• 确保代码中传入的merchantIdentifier和Braintree后台配置的Apple Pay商户ID完全一致，大小写、字符都不能错
• 检查Braintree后台的Apple Pay域名白名单，必须精确匹配你的测试域名（比如https://your-test-domain.com，非443端口要加上端口号），localhost在Safari中可能不被识别，建议用带SSL证书的真实测试域名

3. 检查Safari与沙箱账号设置 #

• 沙箱测试时，Mac登录的Apple ID必须是Apple官方沙箱测试账号，且该账号已在Wallet中添加了测试卡片（可在Apple开发者后台生成）
• Safari 11.1要求页面必须是真实HTTPS环境，不能是自签名证书的站点（除非你在Safari中手动信任了该证书）

4. 确认Braintree库加载完整 #

如果用CDN加载，要确保同时加载了client和apple-pay模块，比如：

<script src="https://js.braintreegateway.com/web/3.94.0/js/client.min.js"></script>
<script src="https://js.braintreegateway.com/web/3.94.0/js/apple-pay.min.js"></script>

不要只加载基础client库，漏掉Apple Pay模块会导致检测逻辑失效。

5. 查看控制台错误详情 #

打开Safari开发者工具（偏好设置-高级勾选「显示开发菜单」），查看控制台的具体错误信息——比如商户ID不匹配、域名不在白名单、授权失败等，这些细节比单纯的「不支持」提示更能定位问题。

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