>웹 프론트엔드 >JS 튜토리얼 >웹 애플리케이션에서 iOS 장치와 해당 버전을 어떻게 안정적으로 감지할 수 있습니까?

웹 애플리케이션에서 iOS 장치와 해당 버전을 어떻게 안정적으로 감지할 수 있습니까?

Susan Sarandon
Susan Sarandon원래의
2024-12-05 04:22:17705검색

How Can I Reliably Detect iOS Devices and Their Versions in Web Applications?

iOS 장치 감지

웹 애플리케이션을 개발할 때 장치의 운영 체제를 감지하는 것이 유용할 수 있습니다. 특히 iOS 장치에는 특정 처리가 필요할 수 있는 고유한 특성이 있습니다. 이를 달성하는 방법은 다음과 같습니다.

사용자 에이전트 스니핑

한 가지 일반적인 접근 방식은 사용자 에이전트 스니핑입니다. 그러나 이 방법은 사용자 또는 확장 프로그램 조작 가능성으로 인해 신뢰성이 떨어집니다. 그럼에도 불구하고 예는 다음과 같습니다.

var iOS = !window.MSStream && /iPad|iPhone|iPod/.test(navigator.userAgent);

이 방법은 사용자 에이전트 문자열 변경으로 인해 iOS 13을 실행하는 iPad를 감지하지 못할 수 있습니다.

플랫폼 감지

보다 강력한 접근 방식은 플랫폼을 확인하는 것입니다. 문자열:

function iOS() {
  return [
    'iPad Simulator',
    'iPhone Simulator',
    'iPod Simulator',
    'iPad',
    'iPhone',
    'iPod'
  ].includes(navigator.platform)
  || (navigator.userAgent.includes("Mac") && "ontouchend" in document);
}

또한 이 방법은 iPad를 iPadOS 13을 포함한 다른 iOS 기기와 구별합니다.

iOS 버전 감지

사용자 에이전트를 구문 분석하는 동안 iOS 버전을 제공할 수 있지만 보다 안정적인 접근 방식은 기능 추론입니다. 예는 다음과 같습니다.

function iOSversion() {
  if (iOS) {
    if (window.indexedDB) { return 'iOS 8 and up'; }
    if (window.SpeechSynthesisUtterance) { return 'iOS 7'; }
    if (window.webkitAudioContext) { return 'iOS 6'; }
    if (window.matchMedia) { return 'iOS 5'; }
    if (window.history && 'pushState' in window.history) { return 'iOS 4'; }
    return 'iOS 3 or earlier';
  }
  return 'Not an iOS device';
}

결론

이러한 기술을 사용하면 iOS 장치를 효과적으로 감지하고 해당 버전을 확인할 수 있으므로 이에 따라 웹 애플리케이션 동작을 맞춤 설정할 수 있습니다.

위 내용은 웹 애플리케이션에서 iOS 장치와 해당 버전을 어떻게 안정적으로 감지할 수 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.