React Native (5-1: 플랫폼 API - GetLocation)

React Native 를 활용하여 스마트폰의 카메라롤, 위치, 영속되는 저장소 등을 쉽게 사용할 수 있다. 이러한 플랫폼 특유의 API 는 React Native 에 내장된 모듈을 통해 사용하기 편리한 비동기 자바스크립트 인터페이스로 제공된다고 한다. 간단하게 사용할 수 있는 API 들의 사용법을 하나씩 알아보았다. 이번에는 지리적 위치정보를 사용하는 방법에 대해서 알아보았다.

 

 

 

모바일 앱에서는 사용자의 위치를 안다는 것이 매우 중요하다. 사용자의 위치에 기반하여 정보를 제공, 상호작용을 할 수 있다. 우선 아래와 같은 코드를 사용하여 간단하게 사용자의 위치를 얻어올 수 있다고 한다.

 

 

 

    GetLocation.getCurrentPosition({
      enableHighAccuracy: true,
      timeout: 15000,
      })
      .then(location => {
          console.log(location);
      })
      .catch(error => {
          const { code, message } = error;
          console.warn(code, message);
      })

 

 

우선 yarn add react-native-get-location 으로 필요한 패키지를 설치해준다. 그 후 AndroidManifest.xml 파일에 위치정보 접근 허용을 받아야 한다. 아래와 같이 적어 넣는다.

 

 

 

<!-- Define ACCESS_FINE_LOCATION if you will use enableHighAccuracy=true  -->
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION"/>

<!-- Define ACCESS_COARSE_LOCATION if you will use enableHighAccuracy=false  -->
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION"/>

 

 

 

위 코드에서 사용된 Location 오브젝트는 latitude, longitude, altitude, accuracy, speed 등 다양한 정보를 지닌다. 위 코드는 아래 링크를 참조하였다.

 

링크: https://www.npmjs.com/package/react-native-get-location

react-native-get-location

 

 

 

 

 

 

Reference:

빠른 모바일 앱 개발을 위한 React Native