उपयोगकर्ता की जगह की जानकारी

Geolocation API की मदद से, उपयोगकर्ता की सहमति मिलने पर उसकी जगह की जानकारी का पता लगाया जा सकता है.

जियोलोकेशन एपीआई की मदद से, उपयोगकर्ता की सहमति से उसकी जगह की जानकारी का पता लगाया जा सकता है. इस सुविधा का इस्तेमाल, उपयोगकर्ता को उसकी मंज़िल तक पहुंचाने और उसके बनाए गए कॉन्टेंट को जियो-टैग करने के लिए किया जा सकता है. उदाहरण के लिए, यह मार्क करना कि फ़ोटो कहां ली गई थी.

जियोलोकेशन एपीआई की मदद से, यह भी देखा जा सकता है कि उपयोगकर्ता कहां है. साथ ही, उपयोगकर्ता की सहमति से, उसके इधर-उधर जाने पर भी नज़र रखी जा सकती है. हालांकि, ऐसा सिर्फ़ तब किया जा सकता है, जब पेज खुला हो. इससे कई दिलचस्प इस्तेमाल के उदाहरण मिलते हैं. जैसे, बैकएंड सिस्टम के साथ इंटिग्रेट करना, ताकि अगर उपयोगकर्ता आस-पास हो, तो कलेक्शन के लिए ऑर्डर तैयार किया जा सके.

Geolocation API का इस्तेमाल करते समय, आपको कई बातों का ध्यान रखना होगा. इस गाइड में, इस्तेमाल के सामान्य उदाहरण और समाधान बताए गए हैं.

खास जानकारी

  • उपयोगकर्ता को फ़ायदा होने पर, जियोलोकेशन का इस्तेमाल करें.
  • उपयोगकर्ता के जेस्चर के जवाब में, साफ़ तौर पर अनुमति मांगें.
  • अगर किसी उपयोगकर्ता का ब्राउज़र, जगह की जानकारी की सुविधा के साथ काम नहीं करता है, तो सुविधा की पहचान करने की सुविधा का इस्तेमाल करें.
  • सिर्फ़ जियोलोकेशन को लागू करने का तरीका न सीखें, बल्कि इसे इस्तेमाल करने का सबसे सही तरीका भी जानें.
  • अपनी साइट पर भौगोलिक जगह की जानकारी की सुविधा को टेस्ट करें.

जियोलोकेशन का इस्तेमाल कब करना चाहिए

  • उपयोगकर्ता के अनुभव को बेहतर बनाने के लिए, यह पता लगाएं कि उपयोगकर्ता किसी जगह के कितने करीब है.
  • उपयोगकर्ता की जगह के हिसाब से जानकारी (जैसे, समाचार) देना.
  • मैप पर उपयोगकर्ता की जगह की जानकारी दिखाना.
  • उपयोगकर्ता की जगह की जानकारी के साथ, आपके ऐप्लिकेशन में बनाए गए डेटा को टैग करना (जैसे, किसी फ़ोटो को जियो-टैग करना).

ज़िम्मेदारी के साथ अनुमति मांगना

हाल ही में की गई यूज़र स्टडी से पता चला है कि उपयोगकर्ता उन साइटों पर भरोसा नहीं करते जो पेज लोड होने पर, उपयोगकर्ता से उनकी जगह की जानकारी देने के लिए कहती हैं. तो सबसे सही तरीके क्या हैं?

यह मानकर चलें कि उपयोगकर्ता आपको अपनी जगह की जानकारी नहीं देंगे

आपके कई उपयोगकर्ता आपको अपनी जगह की जानकारी नहीं देना चाहेंगे. इसलिए, आपको डेवलपमेंट का ऐसा तरीका अपनाना होगा जिससे उपयोगकर्ताओं की निजता बनी रहे.

  1. जियोलोकेशन एपीआई से जुड़ी सभी गड़बड़ियों को ठीक करें, ताकि आपकी साइट इस स्थिति के हिसाब से काम कर सके.
  2. जगह की जानकारी की ज़रूरत के बारे में साफ़ तौर पर बताएं.
  3. ज़रूरत पड़ने पर, फ़ॉलबैक समाधान का इस्तेमाल करें.

अगर जियोलोकेशन की ज़रूरत है, तो फ़ॉलबैक का इस्तेमाल करें

हमारा सुझाव है कि आपकी साइट या ऐप्लिकेशन को उपयोगकर्ता की मौजूदा जगह की जानकारी ऐक्सेस करने की ज़रूरत न पड़े. हालांकि, अगर आपकी साइट या ऐप्लिकेशन को उपयोगकर्ता की मौजूदा जगह की जानकारी चाहिए, तो तीसरे पक्ष के ऐसे समाधान मौजूद हैं जिनकी मदद से, उपयोगकर्ता की मौजूदा जगह की जानकारी का बेहतर अनुमान लगाया जा सकता है.

ये समाधान अक्सर उपयोगकर्ता के आईपी पते को देखकर और उसे RIPE डेटाबेस में रजिस्टर किए गए पतों से मैप करके काम करते हैं. ये जगहें अक्सर बहुत सटीक नहीं होती हैं. आम तौर पर, ये आपको उपयोगकर्ता के सबसे नज़दीक मौजूद टेलीकम्यूनिकेशन हब या सेल फ़ोन टावर की जगह की जानकारी देती हैं. कई मामलों में, हो सकता है कि ये सटीक न हों. खास तौर पर, तब जब उपयोगकर्ता वीपीएन या किसी अन्य प्रॉक्सी सेवा का इस्तेमाल कर रहा हो.

उपयोगकर्ता के जेस्चर पर, जगह की जानकारी के ऐक्सेस का अनुरोध हमेशा करें

पक्का करें कि उपयोगकर्ताओं को यह पता हो कि आपने उनकी जगह की जानकारी क्यों मांगी है और इससे उन्हें क्या फ़ायदा होगा. साइट लोड होते ही होम पेज पर तुरंत अनुमति मांगने से, उपयोगकर्ता अनुभव खराब होता है.

स्टोर खोजने वाले पेज पर अनुमति का अनुरोध करने वाली साइट.
क्या करें: उपयोगकर्ता के जेस्चर पर, हमेशा जगह की जानकारी ऐक्सेस करने का अनुरोध करें.
होम पेज पर अनुमति का अनुरोध करने वाली साइट.
ऐसा न करें: साइट लोड होने पर, होम पेज पर ही अनुमति न मांगें. इससे उपयोगकर्ता को खराब अनुभव मिलता है.

इसके बजाय, उपयोगकर्ता को साफ़ तौर पर कॉल-टू-ऐक्शन दें या बताएं कि किसी कार्रवाई के लिए, उसकी जगह की जानकारी का ऐक्सेस ज़रूरी है. इसके बाद, उपयोगकर्ता ऐक्सेस के लिए सिस्टम प्रॉम्प्ट को, अभी-अभी शुरू की गई कार्रवाई से ज़्यादा आसानी से जोड़ सकता है.

साफ़ तौर पर बताएं कि किसी कार्रवाई के लिए, उनकी जगह की जानकारी का अनुरोध किया जाएगा

Google Ads टीम की एक स्टडी में, जब एक उपयोगकर्ता से बोस्टन में होने वाली एक कॉन्फ़्रेंस के लिए, होटल की एक खास साइट पर कमरा बुक करने के लिए कहा गया, तो होम पेज पर "खोजें और बुक करें" कॉल-टू-ऐक्शन पर टैप करने के तुरंत बाद, उसे अपनी जीपीएस लोकेशन शेयर करने के लिए कहा गया.

कुछ मामलों में, उपयोगकर्ता को परेशानी हुई, क्योंकि उसे समझ नहीं आया कि बोस्टन में कमरा बुक करने के लिए, उसे सैन फ़्रांसिस्को के होटल क्यों दिखाए जा रहे हैं.

बेहतर अनुभव देने के लिए, पक्का करें कि उपयोगकर्ताओं को यह पता हो कि उनसे उनकी जगह की जानकारी क्यों मांगी जा रही है. कोई ऐसा जाना-पहचाना सिग्निफ़ायर जोड़ें जो सभी डिवाइसों पर आम तौर पर इस्तेमाल किया जाता है. जैसे, रेंज फ़ाइंडर या साफ़ तौर पर दिखने वाला कॉल-टू-ऐक्शन, जैसे कि “मेरे आस-पास खोजें.”

रेंज फ़ाइंडर.
रेंज फ़ाइंडर का इस्तेमाल करें
एक फ़ॉर्म, जिसमें 'मेरे आस-पास खोजें' बटन है.
मेरे आस-पास मौजूद स्टोर ढूंढने के लिए, खास कॉल-टू-ऐक्शन

उपयोगकर्ताओं को जगह की जानकारी ऐक्सेस करने की अनुमति देने के लिए कहें

आपके पास उपयोगकर्ताओं की किसी भी गतिविधि का ऐक्सेस नहीं होता. आपको ठीक से पता होता है कि उपयोगकर्ता अपनी जगह की जानकारी का ऐक्सेस कब नहीं देते. हालांकि, आपको यह नहीं पता होता कि वे आपको ऐक्सेस कब देते हैं. आपको ऐक्सेस मिलने का पता सिर्फ़ तब चलता है, जब नतीजे दिखते हैं.

अगर आपको उपयोगकर्ताओं से कोई कार्रवाई पूरी करानी है, तो उन्हें "नज" करना एक अच्छा तरीका है.

हमारा सुझाव है कि:

  1. एक ऐसा टाइमर सेट अप करें जो कुछ समय बाद ट्रिगर हो. इसके लिए, पांच सेकंड की वैल्यू सही है.
  2. अगर आपको गड़बड़ी का कोई मैसेज मिलता है, तो उपयोगकर्ता को एक मैसेज दिखाएं.
  3. अगर आपको पॉज़िटिव रिस्पॉन्स मिलता है, तो टाइमर को बंद करें और नतीजों को प्रोसेस करें.
  4. अगर टाइम आउट के बाद भी आपको कोई जवाब नहीं मिलता है, तो उपयोगकर्ता को एक सूचना दिखाएं.
  5. अगर जवाब बाद में आता है और सूचना अब भी दिख रही है, तो उसे स्क्रीन से हटा दें.
button.onclick = function () {
  var startPos;
  var nudge = document.getElementById('nudge');

  var showNudgeBanner = function () {
    nudge.style.display = 'block';
  };

  var hideNudgeBanner = function () {
    nudge.style.display = 'none';
  };

  var nudgeTimeoutId = setTimeout(showNudgeBanner, 5000);

  var geoSuccess = function (position) {
    hideNudgeBanner();
    // We have the location, don't display banner
    clearTimeout(nudgeTimeoutId);

    // Do magic with location
    startPos = position;
    document.getElementById('startLat').innerHTML = startPos.coords.latitude;
    document.getElementById('startLon').innerHTML = startPos.coords.longitude;
  };
  var geoError = function (error) {
    switch (error.code) {
      case error.TIMEOUT:
        // The user didn't accept the callout
        showNudgeBanner();
        break;
    }
  };

  navigator.geolocation.getCurrentPosition(geoSuccess, geoError);
};

ब्राउज़र समर्थन

ज़्यादातर ब्राउज़र अब Geolocation API के साथ काम करते हैं. हालांकि, कुछ भी करने से पहले, यह देख लेना चाहिए कि ब्राउज़र इस एपीआई के साथ काम करता है या नहीं.

जियोलोकेशन ऑब्जेक्ट की मौजूदगी की जांच करके, यह आसानी से पता लगाया जा सकता है कि आपका ब्राउज़र इस सुविधा के साथ काम करता है या नहीं:

// check for Geolocation support
if (navigator.geolocation) {
  console.log('Geolocation is supported!');
} else {
  console.log('Geolocation is not supported for this Browser/OS.');
}

उपयोगकर्ता की मौजूदा जगह की जानकारी का पता लगाना

जियोलोकेशन एपीआई, उपयोगकर्ता की जगह की जानकारी पाने के लिए, "एक बार में" काम करने वाला आसान तरीका उपलब्ध कराता है: getCurrentPosition(). इस तरीके को कॉल करने पर, उपयोगकर्ता की मौजूदा जगह की जानकारी एसिंक्रोनस तरीके से रिपोर्ट की जाती है.

window.onload = function () {
  var startPos;
  var geoSuccess = function (position) {
    startPos = position;
    document.getElementById('startLat').innerHTML = startPos.coords.latitude;
    document.getElementById('startLon').innerHTML = startPos.coords.longitude;
  };
  navigator.geolocation.getCurrentPosition(geoSuccess);
};

अगर इस डोमेन पर मौजूद किसी ऐप्लिकेशन ने पहली बार अनुमतियों का अनुरोध किया है, तो आम तौर पर ब्राउज़र, उपयोगकर्ता की सहमति की जांच करता है. ब्राउज़र के हिसाब से, अनुमति की जानकारी देखने की सुविधा को हमेशा के लिए चालू या बंद करने की सेटिंग भी हो सकती है. ऐसा होने पर, पुष्टि करने की प्रोसेस को बायपास कर दिया जाता है.

आपका ब्राउज़र जिस डिवाइस की जगह की जानकारी का इस्तेमाल कर रहा है उसके आधार पर, पोज़िशन ऑब्जेक्ट में अक्षांश और देशांतर के अलावा और भी बहुत कुछ हो सकता है. उदाहरण के लिए, इसमें ऊंचाई या दिशा शामिल हो सकती है. यह नहीं बताया जा सकता कि जगह की जानकारी देने वाला सिस्टम, किस अतिरिक्त जानकारी का इस्तेमाल करता है. यह जानकारी, डेटा मिलने के बाद ही पता चलती है.

उपयोगकर्ता की जगह की जानकारी देखना

Geolocation API की मदद से, उपयोगकर्ता की सहमति से उसकी जगह की जानकारी हासिल की जा सकती है. इसके लिए, getCurrentPosition() को एक कॉल करना होता है.

अगर आपको उपयोगकर्ता की जगह की जानकारी पर लगातार नज़र रखनी है, तो Geolocation API के तरीके watchPosition() का इस्तेमाल करें. यह getCurrentPosition() की तरह ही काम करता है. हालांकि, यह पोज़िशनिंग सॉफ़्टवेयर के तौर पर कई बार ट्रिगर होता है:

  1. इससे उपयोगकर्ता की जगह की ज़्यादा सटीक जानकारी मिलती है.
  2. इससे पता चलता है कि उपयोगकर्ता की पोज़िशन बदल रही है.
var watchId = navigator.geolocation.watchPosition(function (position) {
  document.getElementById('currentLat').innerHTML = position.coords.latitude;
  document.getElementById('currentLon').innerHTML = position.coords.longitude;
});

उपयोगकर्ता की जगह की जानकारी देखने के लिए, जियोलोकेशन का इस्तेमाल कब करना चाहिए

  • आपको उपयोगकर्ता की जगह की ज़्यादा सटीक जानकारी चाहिए.
  • आपके ऐप्लिकेशन को जगह की नई जानकारी के आधार पर, यूज़र इंटरफ़ेस को अपडेट करना होगा.
  • जब उपयोगकर्ता किसी तय ज़ोन में दाखिल होता है, तो आपके ऐप्लिकेशन को कारोबारी नियम अपडेट करने की ज़रूरत होती है.

जियोलोकेशन का इस्तेमाल करने के सबसे सही तरीके

हमेशा साफ़-साफ़ दिखना और बैटरी बचाना

किसी जगह की जानकारी में होने वाले बदलावों पर नज़र रखने के लिए, शुल्क देना पड़ता है. ऑपरेटिंग सिस्टम, प्लैटफ़ॉर्म की ऐसी सुविधाएं पेश कर सकते हैं जिनसे ऐप्लिकेशन, जियो सबसिस्टम से जुड़ सकें. हालांकि, एक वेब डेवलपर के तौर पर, आपको यह नहीं पता होता कि उपयोगकर्ता की जगह की जानकारी को मॉनिटर करने के लिए, उसके डिवाइस में किस तरह की सुविधा मौजूद है. साथ ही, किसी जगह की जानकारी को मॉनिटर करने के दौरान, डिवाइस को बहुत ज़्यादा प्रोसेसिंग करनी पड़ती है.

जब आपको उपयोगकर्ता की जगह की जानकारी को ट्रैक करने की ज़रूरत न हो, तो जियोलोकेशन सिस्टम को बंद करने के लिए, clearWatch को कॉल करें.

गड़बड़ियों को आसानी से ठीक करना

हालांकि, ऐसा हो सकता है कि कुछ मामलों में जगह की जानकारी न मिले. ऐसा हो सकता है कि जीपीएस की मदद से जगह की जानकारी न मिल पाई हो या उपयोगकर्ता ने अचानक जगह की जानकारी देखने की सुविधा बंद कर दी हो. किसी गड़बड़ी के मामले में, getCurrentPosition() के लिए दूसरा वैकल्पिक आर्ग्युमेंट कॉल किया जाता है, ताकि आप कॉलबैक के अंदर उपयोगकर्ता को सूचना दे सकें:

window.onload = function () {
  var startPos;
  var geoSuccess = function (position) {
    startPos = position;
    document.getElementById('startLat').innerHTML = startPos.coords.latitude;
    document.getElementById('startLon').innerHTML = startPos.coords.longitude;
  };
  var geoError = function (error) {
    console.log('Error occurred. Error code: ' + error.code);
    // error.code can be:
    //   0: unknown error
    //   1: permission denied
    //   2: position unavailable (error response from location provider)
    //   3: timed out
  };
  navigator.geolocation.getCurrentPosition(geoSuccess, geoError);
};

जियोलोकेशन हार्डवेयर को चालू करने की ज़रूरत कम करना

कई मामलों में, आपको उपयोगकर्ता की जगह की अप-टू-डेट जानकारी की ज़रूरत नहीं होती. आपको सिर्फ़ अनुमानित जानकारी की ज़रूरत होती है.

maximumAge वैकल्पिक प्रॉपर्टी का इस्तेमाल करके, ब्राउज़र को हाल ही में मिली जगह की जानकारी के नतीजे का इस्तेमाल करने के लिए कहें. अगर उपयोगकर्ता ने पहले डेटा का अनुरोध किया है, तो इससे न सिर्फ़ डेटा तेज़ी से मिलता है, बल्कि ब्राउज़र को वाई-फ़ाई ट्रायंगुलेशन या जीपीएस जैसे जियोलोकेशन हार्डवेयर इंटरफ़ेस शुरू करने से भी रोका जाता है.

window.onload = function () {
  var startPos;
  var geoOptions = {
    maximumAge: 5 * 60 * 1000,
  };

  var geoSuccess = function (position) {
    startPos = position;
    document.getElementById('startLat').innerHTML = startPos.coords.latitude;
    document.getElementById('startLon').innerHTML = startPos.coords.longitude;
  };
  var geoError = function (error) {
    console.log('Error occurred. Error code: ' + error.code);
    // error.code can be:
    //   0: unknown error
    //   1: permission denied
    //   2: position unavailable (error response from location provider)
    //   3: timed out
  };

  navigator.geolocation.getCurrentPosition(geoSuccess, geoError, geoOptions);
};

उपयोगकर्ता को इंतज़ार न कराएं, टाइम आउट सेट करें

जब तक टाइम आउट सेट नहीं किया जाता, तब तक हो सकता है कि मौजूदा जगह की जानकारी के लिए किया गया आपका अनुरोध कभी पूरा न हो.

window.onload = function () {
  var startPos;
  var geoOptions = {
    timeout: 10 * 1000,
  };

  var geoSuccess = function (position) {
    startPos = position;
    document.getElementById('startLat').innerHTML = startPos.coords.latitude;
    document.getElementById('startLon').innerHTML = startPos.coords.longitude;
  };
  var geoError = function (error) {
    console.log('Error occurred. Error code: ' + error.code);
    // error.code can be:
    //   0: unknown error
    //   1: permission denied
    //   2: position unavailable (error response from location provider)
    //   3: timed out
  };

  navigator.geolocation.getCurrentPosition(geoSuccess, geoError, geoOptions);
};

जगह की सटीक जानकारी के बजाय, अनुमानित जगह की जानकारी को प्राथमिकता देना

अगर आपको किसी उपयोगकर्ता के लिए सबसे नज़दीकी स्टोर ढूंढना है, तो आपको एक मीटर की सटीक जानकारी की ज़रूरत नहीं है. इस एपीआई को अनुमानित जगह की जानकारी देने के लिए डिज़ाइन किया गया है. यह जानकारी जल्द से जल्द मिलती है.

अगर आपको ज़्यादा सटीक जानकारी चाहिए, तो enableHighAccuracy विकल्प की मदद से, डिफ़ॉल्ट सेटिंग को बदला जा सकता है. इसका इस्तेमाल कम करें: यह धीमा है और ज़्यादा बैटरी खर्च करता है.

window.onload = function () {
  var startPos;
  var geoOptions = {
    enableHighAccuracy: true,
  };

  var geoSuccess = function (position) {
    startPos = position;
    document.getElementById('startLat').innerHTML = startPos.coords.latitude;
    document.getElementById('startLon').innerHTML = startPos.coords.longitude;
  };
  var geoError = function (error) {
    console.log('Error occurred. Error code: ' + error.code);
    // error.code can be:
    //   0: unknown error
    //   1: permission denied
    //   2: position unavailable (error response from location provider)
    //   3: timed out
  };

  navigator.geolocation.getCurrentPosition(geoSuccess, geoError, geoOptions);
};

Chrome DevTools की मदद से, जगह की जानकारी को एम्युलेट करना

DevTools में सेंसर टैब.

जियोलोकेशन सेट अप करने के बाद, आपको ये काम करने होंगे:

  • अलग-अलग जगहों पर अपने ऐप्लिकेशन की परफ़ॉर्मेंस की जांच करें.
  • पुष्टि करें कि जगह की जानकारी उपलब्ध न होने पर, आपका ऐप्लिकेशन सही तरीके से काम करता है.

Chrome DevTools से दोनों काम किए जा सकते हैं.

  1. Chrome DevTools खोलें.
  2. कंसोल पैनल खोलने के लिए, Esc दबाएं.
  3. कंसोल ड्रॉर मेन्यू खोलें
  4. सेंसर टैब देखने के लिए, सेंसर विकल्प पर क्लिक करें.

यहां से, जगह की जानकारी को पहले से सेट किए गए किसी मुख्य शहर में बदला जा सकता है, पसंद के मुताबिक कोई जगह डाली जा सकती है या जगह की जानकारी को ओवरराइड करके, जगह की जानकारी उपलब्ध नहीं है पर सेट करके, जगह की जानकारी को बंद किया जा सकता है.

सुझाव/राय दें या शिकायत करें