HTML जियोलोकेशन API: उपयोगकर्ता की वास्तविक स्थिति प्राप्त करना

HTML जियोलोकेशन का उपयोग उपयोगकर्ता की वास्तविक भौगोलिक स्थिति प्राप्त करने के लिए किया जाता है, केवल तभी जब वे इसकी अनुमति दें। इसका उपयोग विभिन्न कारणों के लिए किया जा सकता है। यह अक्षांश (latitude) और देशांतर (longitude) प्राप्त करने के लिए जावास्क्रिप्ट का उपयोग करता है।

नोट: गूगल क्रोम 50 से पहले, जियोलोकेशन अनुरोध HTTP पर स्वीकृत हो सकते थे, लेकिन क्रोम 50 के बाद केवल HTTPS के माध्यम से अनुरोध स्वीकृत होते हैं और HTTP अनुरोध अनदेखे किए जाते हैं।

सिंटैक्स

navigator.geolocation.getCurrentPosition()

वापस किए गए ऑब्जेक्ट के गुण

उदाहरण: त्रुटि प्रबंधन के साथ जियोलोकेशन

<!DOCTYPE html>
<html>
<head>
  <title>HTML जियोलोकेशन</title>
  <style>
    * { padding: 2px; margin: 5px; }
    form { width: 70%; margin: 0 auto; text-align: center; }
    input[type="button"] { border-radius: 10px; }
  </style>
</head>
<body>
  <form>
    <fieldset>
      <legend>HTML-जियोलोकेशन</legend>
      <input type="button" value="स्थान अपडेट करें" onclick="updateLocation()">
      <input type="button" value="खोजें" onclick="searchLoc()">
      <div id="divDisplay">वर्तमान स्थान:</div>
      <div>
        <span id="latitude">अक्षांश: 42.9177901</span>
        <span id="longitude">देशांतर: -75.8114698</span>
      </div>
    </fieldset>
  </form>
  <script>
    var latObj = document.getElementById("latitude");
    var longObj = document.getElementById("longitude");
    var divDisplay = document.getElementById("divDisplay");
    function searchLoc() {
      var lat = latObj.textContent.split(": ")[1];
      var long = longObj.textContent.split(": ")[1];
      var url = "https://www.google.com/maps/@" + lat + "," + long + ",8.58z";
      browseWindow = window.open(url, "browseWindow", "width=400, height=200");
    }
    function updateLocation() {
      browseWindow.close();
      var user = navigator.geolocation;
      if (user)
        user.getCurrentPosition(updatePosition, errorHandler);
      else
        divDisplay.textContent = "इस ब्राउज़र में जियोलोकेशन समर्थित नहीं है";
    }
    function updatePosition(position) {
      divDisplay.innerHTML = 'स्थान अपडेट किया गया<br>वर्तमान स्थान:';
      latObj.textContent = 'अक्षांश: ' + position.coords.latitude;
      longObj.textContent = 'देशांतर: ' + position.coords.longitude;
    }
    function errorHandler(error) {
      switch (error.code) {
        case error.PERMISSION_DENIED:
          divDisplay.textContent = "आपने जियोलोकेशन प्राप्त करने के अनुरोध को अस्वीकार कर दिया";
          break;
        case error.POSITION_UNAVAILABLE:
          divDisplay.textContent = "आपकी स्थान जानकारी अनुपलब्ध है";
          break;
        case error.TIMEOUT:
          divDisplay.textContent = "आपका स्थान प्राप्त करने का अनुरोध टाइम आउट हो गया";
          break;
        case error.UNKNOWN_ERROR:
          divDisplay.textContent = "अज्ञात त्रुटि हुई";
          break;
      }
    }
  </script>
</body>
</html>

आउटपुट परिदृश्य

1. कोई बटन क्लिक करने से पहले: डिफ़ॉल्ट निर्दांक दिखाता है
2. 'खोजें' क्लिक: गूगल मैप्स में डिफ़ॉल्ट स्थान खोलता है
3. 'स्थान अपडेट करें' क्लिक: ब्राउज़र अनुमति मांगता है
4. अनुमति देने के बाद: वास्तविक स्थान दिखाता है, मैप अपडेट होता है
5. अनुमति अस्वीकार करने पर: "आपने जियोलोकेशन प्राप्त करने के अनुरोध को अस्वीकार कर दिया"

जियोलोकेशन के अन्य मेथड्स

गोपनीयता और सर्वोत्तम अभ्यास

• हमेशा HTTPS पर उपयोग करें
• उपयोगकर्ता को स्पष्ट रूप से बताएं कि स्थान क्यों चाहिए
• अनुमति अस्वीकृत होने पर ग्रेसफुल फॉलबैक प्रदान करें
• लगातार ट्रैकिंग के लिए watchPosition बैटरी खत्म कर सकता है