iOS 11下Gmail WebView与主屏幕Safari的无UA差异检测问询

针对你遇到的iOS 11里Gmail内嵌Safari和原生Safari UA完全一致、无法通过UA区分的问题，这里有几个实际可行的检测方案，贴合你的业务场景：

1. 利用原生Safari专属对象检测 #

原生Safari浏览器会暴露window.safari这个专属对象，而大多数第三方App的WKWebView（包括Gmail的内嵌浏览器）不会提供这个对象。你可以用以下代码快速判断：

function isNativeSafari() {
  return typeof window.safari !== 'undefined';
}

返回true就是原生Safari，返回false则大概率是内嵌WebView环境。

2. 直接检测图像捕获控件可用性（最贴合你的需求） #

既然核心问题是WebView里图像捕获控件失效，不如跳过环境判断，直接检测控件是否能正常工作：

async function canUseCameraCapture() {
  // 先检测input的capture属性是否被支持
  const testInput = document.createElement('input');
  testInput.type = 'file';
  testInput.accept = 'image/*';
  testInput.capture = 'camera';
  
  if (!('capture' in testInput)) {
    return false;
  }
  
  // 进一步检测相机权限（WebView常限制此权限）
  try {
    const stream = await navigator.mediaDevices.getUserMedia({ video: true });
    // 拿到权限后立即停止流，避免占用相机
    stream.getTracks().forEach(track => track.stop());
    return true;
  } catch (err) {
    // 权限被拒或不支持，判定为WebView环境
    return false;
  }
}

调用这个函数，如果返回false，就直接引导用户切换到原生Safari打开，这种方式比环境判断更精准，不会出现误判。

3. 窗口行为差异辅助判断（补充方案） #

部分WebView会限制window.open的行为，你可以通过这个特性辅助验证：

function isInWebView() {
  const originalOpen = window.open;
  let isRestricted = false;
  
  // 临时重写window.open，检测是否被拦截
  window.open = function() {
    isRestricted = true;
    return originalOpen.apply(this, arguments);
  };
  
  const testWindow = window.open('about:blank');
  // 被拦截或无法打开新窗口，判定为WebView
  if (testWindow === null || isRestricted) {
    window.open = originalOpen;
    return true;
  }
  
  testWindow.close();
  window.open = originalOpen;
  return false;
}

可以把这个方法和前面的方案结合使用，提升检测的准确率。

小提示 #

• 优先用第二种方案，直接针对你的业务痛点，避免环境误判；
• 引导用户时，尽量给出清晰操作步骤，比如“点击右上角[...]按钮，选择在Safari中打开”；
• 记得在目标iOS版本上充分测试，后续系统更新可能会带来行为变化。

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