expo-location 설정

import * as Location from "expo-location";

const [location, setlocation] = useState({
    region: "",
  });
  const [ok, setOk] = useState(true);
  const ask = async () => {
    const { granted } = await Location.requestForegroundPermissionsAsync();
    if (granted) {
      setOk(true);
    } else {
      setOk(false);
    }
    const {
      coords: { latitude, longitude },
    } = await Location.getCurrentPositionAsync({ accuracy: 5 });
   
    if (latitude && longitude) {
      console.log(latitude, longitude);
      const currentLocation = await Location.reverseGeocodeAsync(
        {
          latitude,
          longitude,
        },
        {
          useGoogleMaps: true,
        }
      );
      console.log(currentLocation);
      setlocation(currentLocation[0]);
    }
  };

{
  useGoogleMaps: true,
}

useGoogleMaps를 사용하지 않을 경우 위치 정보가 잘 나올 때도 있지만 안나올 때가 더 많았다. (빈 배열을 return) , 따라서 useGoogleMaps를 사용할 수 밖에 없었다. 그런데 문제가 생겼다.

Google Cloud Maps

useGoogleMaps를 사용하기 위해선 api key가 필요했다. 따라서 Google Maps Platform에 가입하고 api key를 발급 받자

아무 설정 없이 API key를 발급 받고 setGoogleApiKey에 적용해주었더니 다음과 같은 에러가 발생했다.

this api project is not authorized to use this api.

이 프로젝트가 해당 API를 사용하도록 허용되지 않았다는건데 설정을 해주도록 하자

Google Maps Platform ⇒ API ⇒ 추가 API에서 나는

Geocoding API Geolocation API Maps JavaScript API Maps SDK for Android Places API

이렇게 API를 추가해주었고 기존에 사용하던 API가 아닌 새로 API를 발급받아서 적용했더니 위치정보를 가져올 수 있었다.

import * as Location from "expo-location";

const [location, setlocation] = useState({
    region: "",
  });
  const [ok, setOk] = useState(true);
  const ask = async () => {
    const { granted } = await Location.requestForegroundPermissionsAsync();
    if (granted) {
      setOk(true);
    } else {
      setOk(false);
    }
    const {
      coords: { latitude, longitude },
    } = await Location.getCurrentPositionAsync({ accuracy: 5 });

   Location.setGoogleApiKey("your api key");

    if (latitude && longitude) {
      console.log(latitude, longitude);
      const currentLocation = await Location.reverseGeocodeAsync(
        {
          latitude,
          longitude,
        },
        {
          useGoogleMaps: true,
        }
      );
      console.log(currentLocation);
      setlocation(currentLocation[0]);
    }
  };