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

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

Paul Kinlan

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

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

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

ध्यान दें: Chrome 50 के बाद से, Geolocation API सिर्फ़ सुरक्षित कॉन्टेक्स्ट (एचटीटीपीएस) पर काम करता है. अगर आपकी साइट को किसी असुरक्षित ऑरिजिन (जैसे, HTTP) पर होस्ट किया गया है, तो उपयोगकर्ता की जगह की जानकारी के लिए किए गए किसी भी अनुरोध का जवाब अब नहीं दिया जाएगा.

खास जानकारी

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

जगह की जानकारी का इस्तेमाल कब करना चाहिए

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

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

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

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

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

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);
};

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

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

जगह की जानकारी वाले ऑब्जेक्ट की मौजूदगी की जांच करके, आसानी से यह पता लगाया जा सकता है कि आपका ऐप्लिकेशन,

// 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);
};

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

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

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

जियोलोकेशन एपीआई की मदद से, getCurrentPosition() को एक बार कॉल करके, उपयोगकर्ता की सहमति के साथ उसकी जगह की जानकारी हासिल की जा सकती है.

अगर आपको उपयोगकर्ता की जगह की जानकारी पर लगातार नज़र बनाए रखनी है, तो जियोलोकेशन एपीआई तरीके 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);
};

जगह की सटीक जानकारी के बजाय, अनुमानित जगह की जानकारी का इस्तेमाल करना

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

अगर आपको ज़्यादा सटीक जानकारी की ज़रूरत है, तो 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 की मदद से जियोलोकेशन को एम्युलेट करें

भौगोलिक स्थान सेट अप कर लेने के बाद, आपको ये काम करने होंगे:

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

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

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

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

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