[javascript] 모바일 디바이스의 근접 센서 데이터 활용하기

05 Dec 2023

javascript

모바일 디바이스는 다양한 센서를 내장하고 있어 다양한 기능을 제공합니다. 그 중에서도 근접 센서는 사용자가 디바이스에 가까이 두었는지 여부를 감지하는 역할을 합니다. 근접 센서 데이터를 활용하면 다양한 기능을 구현할 수 있습니다. 이번 글에서는 JavaScript를 사용하여 모바일 디바이스의 근접 센서 데이터를 활용하는 방법에 대해 알아보겠습니다.

근접 센서 데이터 가져오기

모바일 디바이스의 근접 센서 데이터를 가져오기 위해서는 ProximitySensor API를 사용해야 합니다. 아래는 ProximitySensor API를 사용하여 근접 센서 데이터를 가져오는 예제 코드입니다.

if ('ProximitySensor' in window) {
  const sensor = new ProximitySensor();

  sensor.onactivate = () => {
    console.log('근접 센서 활성화');
  };

  sensor.onchange = (event) => {
    console.log('근접 센서 값 변경: ', event.value);
    // 근접 센서 값에 따른 동작 구현
    if (event.value < sensor.max) {
      // 디바이스가 사용자에게 가까이 있는 경우
      // 원하는 동작 수행
    } else {
      // 디바이스가 사용자에게 멀리 떨어져 있는 경우
      // 원하는 동작 수행
    }
  };
  
  sensor.start();
} else {
  console.log('이 디바이스는 근접 센서를 지원하지 않습니다.');
}

위의 코드에서는 먼저, 현재 디바이스가 근접 센서를 지원하는지 확인합니다. ProximitySensor 객체를 생성한 뒤, onactivate 이벤트와 onchange 이벤트의 핸들러를 등록합니다. onactivate 이벤트는 근접 센서가 활성화되었을 때 호출되고, onchange 이벤트는 근접 센서 값이 변경될 때마다 호출됩니다. 근접 센서값은 event.value를 통해 접근할 수 있습니다. 이 값을 기반으로 원하는 동작을 구현할 수 있습니다.

결론

JavaScript를 사용하여 모바일 디바이스의 근접 센서 데이터를 활용하는 방법에 대해 알아보았습니다. 근접 센서 값을 활용하여 사용자와 디바이스 사이의 거리에 따라 동작을 제어할 수 있습니다. 모바일 애플리케이션 개발을 할 때 근접 센서를 활용하면 사용자 경험을 향상시킬 수 있습니다.

더 자세한 사항은 다음 참고 자료를 확인해보세요.

참고 자료:

MDN Web Docs