Geolocation API is not working with Vue.js

Question

I am trying to grab geolocation for my app. Geolocation should be grabbed on created hook.

if (navigator.geolocation) {
  navigator.geolocation.getCurrentPosition(displayLocationInfo);
}

function displayLocationInfo(position) {
  const lng = position.coords.longitude;
  const lat = position.coords.latitude;

  console.log(`longitude: ${ lng } | latitude: ${ lat }`);
}

But my console is empty.

Answer 1

The real way to use Geolocation API is to check the availability of it on your device/browser before using it, so just add an else block to your existing code. Hope it'll help :) See more at MDN

if ("geolocation" in navigator) {
  /* geolocation is available */
  navigator.geolocation.getCurrentPosition(displayLocationInfo);
  
  function displayLocationInfo(position) {
    const lng = position.coords.longitude;
    const lat = position.coords.latitude;

    console.log(`longitude: ${ lng } | latitude: ${ lat }`);
  }
} else {
  /* geolocation IS NOT available  */
  console.log('geolocation IS NOT available on your browser');
}