{"id":3225,"date":"2020-09-04T04:22:54","date_gmt":"2020-09-04T04:22:54","guid":{"rendered":"https:\/\/studysection.com\/blog\/?p=3225"},"modified":"2021-01-20T04:59:47","modified_gmt":"2021-01-20T04:59:47","slug":"user-location-detection-with-javascript","status":"publish","type":"post","link":"https:\/\/studysection.com\/blog\/user-location-detection-with-javascript\/","title":{"rendered":"User Location Detection With Javascript"},"content":{"rendered":"

Detect location(Coordinates\/Country) of your website visitors using Javascript<\/h2>\n

The location detection can be useful for you in a variety of scenarios like to show your website\u2019s content in different languages depending upon different countries, or to display targeted information to visitors from different locations.<\/p>\n

We have two ways to do this:<\/p>\n

    \n
  1. The Geolocation API <\/li>\n
  2. IP address lookup<\/li>\n<\/ol>\n

    The Geolocation API<\/h3>\n

    This is a new HTML5 feature. It allows a visitor to share their location with you by prompting if they\u2019d like to share their location with your site when you try to retrieve the location using this API. <\/p>\n

    This is the pop-up you often see when you visit a website using Geolocation API.<\/p>\n

    \"google\"<\/p>\n

    Here is the code for this:<\/p>\n

    if (\u201cgeolocation\u201d in navigator) {
    \n \/\/ check if geolocation is enabled on current browser
    \n navigator.geolocation.getCurrentPosition(
    \n function success(position) {
    \n \t console.log(\u2018latitude\u2019,position.coords.latitude,\u2019longitude\u2019,position.coords.longitude);
    \n },
    \n function error(error_message) {
    \n console.error(\u2018Error occured while retrieving location\u2019, error_message)
    \n }
    \n );
    \n} else {
    \n \/\/ if geolocation is not supported
    \n console.log(\u2018geolocation is not enabled on this browser\u2019)
    \n}
    \n<\/em><\/code><\/p>\n

    Output:<\/strong>(run in my browser console)
    \nlatitude 30.683182199999994 longitude 76.71986989999999<\/p>\n

    There are some drawbacks to using this method:<\/p>\n