HTML जियोलोकेशन
In this page:
navigator.geolocation.getCurrentPosition(
(position) => { /* position.coords */ },
(error) => { /* handle error */ }
);
Geolocation को समझना
Geolocation API वेब एप्लिकेशन्स को यूज़र के भौगोलिक निर्देशांक (coordinates) माँगने देती है। ब्राउज़र आपकी पोज़िशन पता करने के लिए सेल टावर, Wi-Fi नेटवर्क्स और GPS सेंसर्स का उपयोग करता है।
उदाहरण: Understanding Geolocation
<script>
if (navigator.geolocation) {
console.log('Geolocation is supported');
}
</script>
मौजूदा पोज़िशन प्राप्त करना
यूज़र के सटीक निर्देशांक पता करने के लिए, आप getCurrentPosition मेथड का उपयोग करते हैं। यह मेथड यूज़र की लोकेशन माँगता है और सफल होने पर उनके latitude और longitude निर्देशांक लौटाता है।
उदाहरण: Getting the Current Position
<script>
navigator.geolocation.getCurrentPosition(function (position) {
console.log(position.coords.latitude, position.coords.longitude);
});
</script>
परमिशन डिनायल को संभालना
चूंकि geolocation एक प्राइवेट API है, इसलिए यूज़र लोकेशन रिक्वेस्ट को ब्लॉक कर सकते हैं। आपकी स्क्रिप्ट्स को परमिशन डिनायल को संभालना चाहिए और बिना क्रैश हुए ग्रेसफुली फॉलबैक करना चाहिए।
उदाहरण: Handling Permission Denials
<script>
navigator.geolocation.getCurrentPosition(
function (position) { console.log(position.coords); },
function (error) { console.log('Location access denied:', error.message); }
);
</script>
रीयल-टाइम पोज़िशन ट्रैकिंग
अगर आप कोई इंटरैक्टिव मैप या नेविगेशन ऐप बना रहे हैं, तो आपको यूज़र के मूव करते समय उनकी लोकेशन ट्रैक करने की ज़रूरत होती है। आप उनके निर्देशांकों को रीयल-टाइम में मॉनिटर और अपडेट करने के लिए watchPosition मेथड का उपयोग कर सकते हैं।
उदाहरण: Real-Time Position Tracking
<script>
const watchId = navigator.geolocation.watchPosition(function (position) {
console.log(position.coords.latitude, position.coords.longitude);
});
navigator.geolocation.clearWatch(watchId);
</script>
लोकेशन एक्युरेसी को मैनेज करना
डिफ़ॉल्ट रूप से, ब्राउज़र सटीकता से ज़्यादा स्पीड को प्राथमिकता देते हैं। आप अपनी पोज़िशन पता करने के लिए ब्राउज़र को हाई-प्रिसिज़न GPS सेंसर्स इस्तेमाल करने पर मजबूर करने के लिए कॉन्फ़िगरेशन विकल्प (जैसे enableHighAccuracy) पास कर सकते हैं।
उदाहरण: Managing Location Accuracy
<script>
navigator.geolocation.getCurrentPosition(
function (position) { console.log(position.coords); },
function (error) { console.log(error); },
{ enableHighAccuracy: true }
);
</script>
watchPosition बनाम getCurrentPosition
getCurrentPosition यूज़र की लोकेशन सिर्फ एक बार माँगता है और रुक जाता है। watchPosition लगातार मॉनिटर करता रहता है और जब भी यूज़र की लोकेशन बदलती है, आपके कॉलबैक फंक्शन को बार-बार कॉल करता है, जो कि लाइव ट्रैकिंग फीचर्स जैसे चलती हुई डिलीवरी दिखाने वाले मैप के लिए ज़रूरी होता है।
उदाहरण: watchPosition vs getCurrentPosition
<script>
navigator.geolocation.getCurrentPosition(pos => console.log('Once:', pos.coords));
const id = navigator.geolocation.watchPosition(pos => console.log('Updated:', pos.coords));
</script>
प्राइवेसी संबंधी बातें
लोकेशन डेटा बेहद संवेदनशील निजी जानकारी होती है, इसलिए ब्राउज़र इसे शेयर करने से पहले हमेशा स्पष्ट यूज़र परमिशन माँगते हैं, और उस परमिशन को कभी भी वापस लिया जा सकता है।
साइट्स को लोकेशन तभी माँगनी चाहिए जब उसका कोई स्पष्ट, समझ में आने वाला कारण हो, जैसे नज़दीकी दुकानें दिखाना।
उदाहरण: Privacy Considerations
<button onclick="navigator.geolocation.getCurrentPosition(pos => console.log(pos))">
Show nearby stores
</button>
- insecure HTTP domains पर geolocation test करने की कोशिश करना, जिससे browsers API को block कर देते हैं।
- permission denials handle न करना, जो users के location requests block करने पर आपके scripts को freeze कर सकता है।
- watchPosition tracking को रोकना भूल जाना, जो mobile device की battery drain करता है।
- Geolocation API web applications को securely HTTPS पर user coordinates request करने देता है।
- coordinates एक बार find करने के लिए getCurrentPosition, और real-time में movement track करने के लिए watchPosition इस्तेमाल करें।
- अपने scripts को smoothly चलाने के लिए हमेशा permission denials handle करें और timeout options configure करें।
standard Geolocation API features सभी modern web browsers द्वारा natively supported हैं।
Chapter Quiz — Complete all 11 topics to unlock
0/11 topics done
Complete these topics first: