الحصول على الموقع الجغرافي للمستخدم في تطبيقات الويب

 الحصول على الموقع الجغرافي للمستخدم في تطبيقات الويب

يُعد دمج خدمة تحديد الموقع الجغرافي للمستخدم أمراً مهماً في العديد من تطبيقات الويب الحديثة، مثل خرائط الويب، تطبيقات الطقس، أو خدمات التوصيل. لحسن الحظ، توفّر متصفحات الويب واجهة برمجية (API) سهلة الاستخدام لهذا الغرض.

الطريقة البرمجية الأساسية

يمكن الوصول إلى هذه الميزة عبر الكائن navigator.geolocation الموجود ضمن بيئة المتصفح. الوظيفة الأساسية التي نستخدمها هي getCurrentPosition().

كيفية عمل getCurrentPosition():

تقبل هذه الدالة مُعاملَين رئيسيَّين (على الأقل)، وهما دالتان رديفتان (Callback Functions):

1. دالة النجاح (successCallback): تُستدعى عند نجاح عملية الحصول على الموقع، وتتلقى كائناً (Position) يحتوي على الإحداثيات (coordinates) معلومات أخرى.

2. دالة الفشل (errorCallback): تُستدعى عند فشل العملية، وتتلقى كائناً (PositionError) يحتوي على رمز الخطأ (code) ووصفه (message).

مثال على كود مبسط:

Javascript:
////////////

if ("geolocation" in navigator) {

    navigator.geolocation.getCurrentPosition(

        (position) => {

            console.log("الإحداثيات:", position.coords.latitude, position.coords.longitude);

        },

        (error) => {

            console.error("حدث خطأ:", error.message);

        }

    );

} else {

    console.log("المتصفح لا يدعم تحديد الموقع.");

}

مشكلة شائعة وحلّها

قد تواجهك مشكلة شائعة عند تجربة الكود أعلاه، حتى لو كان صحيحاً من الناحية التركيبية. فبدلاً من الحصول على الاحداثيات، قد يظهر الخطأ التالي في وحدة تحكم المتصفح (Console):

{code: 2, message: "Network location provider at 'https://www.googleapis.com/...' : ERR_HTTP_RESPONSE_CODE_FAILURE"}

سبب المشكلة:

هذا الخطأ ناتج عن سياسة أمان تتبعها جوجل (معظم المتصفحات الحديثة مثل Chrome و Firefox). تمنع هذه السياسة المواقع غير المؤمَّنة (التي تستخدم بروتوكول HTTP) من الوصول إلى خدمة تحديد الموقع الجغرافي عالي الدقة، وذلك لحماية خصوصية المستخدم.

الحل الوحيد:

يجب أن يكون موقعك أو تطبيقك الخاص بك مُتاحاً عبر بروتوكول HTTPS (النسخة الآمنة من HTTP).

• في الإنتاج (Production): تأكد من نشر تطبيقك على خادم يدعم HTTPS ويحتوي على شهادة SSL صالحة.

• أثناء التطوير (Development):

-يمكن لبعض المتصفحات معاملة localhost (عنوان التطوير المحلي) كموقع آمن والسماح باستخدام Geolocation عليه.

-إذا لم يعمل مع localhost، يمكنك إنشاء شهادة SSL محلية (self-signed certificate) لتشغيل خادم تطويرك عبر HTTPS.

مراجع للاستزادة

للتعلّم المتعمق حول Geolocation API وخياراتها الإضافية (مثل watchPosition)، يمكنك الرجوع إلى الوثائق الرسمية على موقع مُطوّري ويب موزيلا (MDN):

-رابط الوثائق: 

https://developer.mozilla.org/en-US/docs/Web/API/Geolocation/getCurrentPosition

باستخدام HTTPS والكود الصحيح، يمكنك بسهولة دمج ميزة الموقع الجغرافي لتطوير تطبيقات ويب أكثر تفاعلية ذات صلة بالمستخدم.