Vue

아이패드 감지

99duuk 2024. 12. 27. 17:24
isMobile() {
	return Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(userAgent);
    }

기존 이렇게 모바일 기기를 확인했다. 

 

아이패드가 안잡힌다.

isMobile() {
      const userAgent = navigator.userAgent || navigator.vendor || window.opera;
      console.log("userAgent:", userAgent);

      // 터치 장치 확인
      const isTouchDevice = 'maxTouchPoints' in navigator ? navigator.maxTouchPoints > 0 : false;
      console.log("isTouchDevice:", isTouchDevice);

      // iOS (iPhone, iPad) 감지
      const isIOS = /iPhone|iPad|iPod/.test(userAgent);
      console.log("isIOS:", isIOS);

      // iPadOS 감지
      const isModernIPad = navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1;
      console.log("isModernIPad:", isModernIPad);

      // Android 감지
      const isAndroid = /Android/.test(userAgent);
      console.log("isAndroid:", isAndroid);

      // User-Agent 기반 터치 디바이스 확인 (대체 논리)
      const isFallbackMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(userAgent);
      console.log("isFallbackMobile:", isFallbackMobile);

      // 최종 결과 반환
      const result = isTouchDevice && (isIOS || isModernIPad || isAndroid || isFallbackMobile);
      console.log("isMobile result:", result);

      return result;
    },

요로코롬 바꿨다.


아이패드

 


아이폰

 

 

딱히 깔끔하게 쓰이진 않았는데 일단 잘잡는듯? 

'Vue' 카테고리의 다른 글

node.js 버전 변경  (0) 2024.12.30
vue 동적 클래스 적용  (0) 2024.11.29
v-if="item" vs v-if="!!item"  (0) 2024.11.28
입력값 검증 메서드  (0) 2024.11.27
vue2 기본 레이아웃 복붙  (0) 2024.11.15