iOS 12下判断APP安装状态并跳转，如何规避Safari弹窗（免付费）

问题分析 #

我完全懂你在iOS 12上遇到的这个糟心问题——用常规的自定义URL Scheme跳转逻辑时，只要APP没安装，Safari就会弹出“无法打开此页面”的生硬提示，得等用户点确定才会跳应用商店，体验特别差。而且你试过的常规方案都不管用，还不想用branch.io这类付费服务对吧？

其实根源在于iOS 12及以后的Safari对未注册的自定义URL处理更严格了：直接调用window.location.replace('myapp://')时，系统会立刻检测到这个URL无法解析，直接触发错误弹窗，常规的延时跳转根本绕不开这个检测。

可行的无付费解决方案 #

下面这个方法结合了隐藏iframe和页面可见性API的技巧，能完美规避iOS 12上的错误弹窗，全程不用依赖第三方付费服务：

核心思路 #

不直接修改window.location触发跳转，而是用隐藏iframe加载自定义URL（Safari不会对后台iframe的无效URL弹提示），同时监听页面的可见性变化——如果APP成功打开，当前浏览器页面会被挤到后台，这时我们就取消后续的应用商店跳转；如果一段时间内页面没被隐藏，就判定APP未安装，再跳应用商店。

完整代码示例 #

function openAppOrRedirectStore() {
  const appDeepLink = 'myapp://'; // 你的APP自定义URL Scheme
  const appStoreLink = 'https://apps.apple.com/cn/app/your-app-id'; // 你的应用商店链接

  // 创建隐藏的iframe来尝试打开APP
  const hiddenIframe = document.createElement('iframe');
  hiddenIframe.style.display = 'none';
  hiddenIframe.src = appDeepLink;
  document.body.appendChild(hiddenIframe);

  // 设置定时器，准备跳应用商店
  const redirectTimer = setTimeout(() => {
    window.location.replace(appStoreLink);
    // 清理iframe
    document.body.removeChild(hiddenIframe);
  }, 1500);

  // 监听页面可见性变化：如果APP打开，页面会被隐藏
  function handlePageVisibility() {
    if (document.hidden || document.visibilityState === 'hidden') {
      clearTimeout(redirectTimer);
      document.body.removeChild(hiddenIframe);
      // 移除监听，避免内存泄漏
      document.removeEventListener('visibilitychange', handlePageVisibility);
      window.removeEventListener('pagehide', handlePageVisibility);
    }
  }

  // 同时监听pagehide事件，覆盖APP直接打开的场景
  document.addEventListener('visibilitychange', handlePageVisibility);
  window.addEventListener('pagehide', handlePageVisibility);

  // 特殊处理：iOS主屏幕web app（Standalone模式）
  if (window.navigator.standalone) {
    clearTimeout(redirectTimer);
    document.body.removeChild(hiddenIframe);
  }
}

// 调用执行
openAppOrRedirectStore();

关键细节说明 #

• 隐藏iframe的作用：iOS 12的Safari不会对后台加载的iframe弹出无效URL提示，只会默默忽略，这就绕过了烦人的错误弹窗。
• 页面可见性监听：当APP成功打开时，浏览器页面进入后台，document.hidden会变为true，这时我们立刻取消定时器，避免误跳应用商店。
• 延时时间设置：1500ms是比较稳妥的数值——给系统足够的时间打开APP，太短可能导致APP还没启动就跳商店，太长会让用户等待太久。
• Standalone模式适配：如果用户是从主屏幕打开的web app，直接取消跳转逻辑，因为这种场景下APP的打开行为和普通浏览器环境不同。

为什么你的原代码无效？ #

你原来的代码直接修改window.location，Safari会立刻检测到这个URL无法解析，直接触发错误弹窗，定时器只能在用户手动点击“确定”后才执行，完全没法绕过这个提示环节。

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