الموقع الجغرافي للمستخدم

تتيح لك واجهة برمجة التطبيقات Geolocation API معرفة الموقع الجغرافي للمستخدم، وذلك بعد الحصول على موافقته.

Paul Kinlan

تتيح لك واجهة برمجة التطبيقات Geolocation API معرفة الموقع الجغرافي للمستخدم بعد الحصول على موافقته. يمكنك استخدام هذه الوظيفة لإجراء إجراءات مثل توجيه المستخدم إلى وجهته والإشارة إلى الموقع الجغرافي للمحتوى الذي أنشأه المستخدم، على سبيل المثال، وضع علامة على مكان التقاط صورة.

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

يجب الانتباه إلى العديد من الأمور عند استخدام واجهة برمجة التطبيقات Geolocation API. يرشدك هذا الدليل إلى حالات الاستخدام والحلول الشائعة.

ملخّص

• استخدِم ميزة رصد الموقع الجغرافي عندما تعود بالفائدة على المستخدم.
• اطلب الإذن كردّ واضح على إيماءة المستخدم.
• استخدِم ميزة "رصد الميزات" في حال عدم توفّر الموقع الجغرافي في متصفّح المستخدم.
• لا تكتفِ بمعرفة كيفية تنفيذ ميزة رصد الموقع الجغرافي، بل تعرَّف أيضًا على أفضل طريقة لاستخدامها.
• اختبِر الموقع الجغرافي باستخدام موقعك الإلكتروني.

حالات استخدام ميزة "رصد الموقع الجغرافي"

• يمكنك معرفة أقرب موقع جغرافي للمستخدم إلى موقع جغرافي محدّد من أجل تخصيص تجربة المستخدم.
• تخصيص المعلومات (مثل الأخبار) حسب الموقع الجغرافي للمستخدم
• عرض موضع مستخدم على خريطة
• إضافة علامة جغرافية إلى البيانات التي تم إنشاؤها داخل تطبيقك باستخدام الموقع الجغرافي للمستخدم (أي إضافة علامة جغرافية إلى صورة)

طلب الإذن بشكل مسؤول

أظهرت دراسات المستخدمين الحديثة أنّ المستخدمين لا يثقون بالمواقع الإلكترونية التي تطلب منهم ببساطة الإفصاح عن موقعهم عند تحميل الصفحة. ما هي أفضل الممارسات؟

افترض أنّ المستخدمين لن يقدّموا لك معلومات عن موقعهم الجغرافي.

لن يقدّم لك العديد من المستخدمين موقعهم الجغرافي، لذا عليك اتّباع أسلوب تطوير دفاعي.

1. عليك معالجة جميع الأخطاء من واجهة برمجة التطبيقات لتحديد الموقع الجغرافي حتى تتمكّن من تكييف موقعك الإلكتروني مع هذه الحالة.
2. يجب أن تكون واضحًا وصريحًا بشأن حاجتك إلى الموقع الجغرافي.
3. استخدِم حلًا احتياطيًا إذا لزم الأمر.

استخدام عنصر احتياطي إذا كان رصد الموقع الجغرافي مطلوبًا

ننصحك بعدم اشتراط وصول موقعك الإلكتروني أو تطبيقك إلى الموقع الجغرافي الحالي للمستخدم. ومع ذلك، إذا كان موقعك الإلكتروني أو تطبيقك يحتاجان إلى معرفة الموقع الجغرافي الحالي للمستخدم، تتوفّر حلول تابعة لجهات خارجية تتيح لك الحصول على أفضل تخمين لمكان المستخدم الحالي.

وتعمل هذه الحلول غالبًا من خلال الاطّلاع على عنوان IP للمستخدم وربطه بالعناوين الجغرافية المسجّلة في قاعدة بيانات RIPE. وغالبًا ما تكون هذه المواقع الجغرافية غير دقيقة جدًا، حيث تعرِض عادةً موقع مركز الاتصالات السلكية واللاسلكية أو برج الهاتف الجوّال الأقرب إلى المستخدم. وفي العديد من الحالات، قد لا تكون هذه المعلومات دقيقة، خاصةً إذا كان المستخدم يستخدم شبكة VPN أو خدمة خادم وكيل آخر.

طلب الوصول إلى الموقع الجغرافي دائمًا عند إجراء المستخدم إيماءة

تأكَّد من أنّ المستخدمين يفهمون سبب طلبك لمواقعهم الجغرافية، واطلاعهم على الفوائد التي ستعود عليهم. يؤدي طلبها على الفور على الصفحة الرئيسية أثناء loadingتحميل الموقع الإلكتروني إلى تقديم تجربة سيئة للمستخدم.

بدلاً من ذلك، امنح المستخدم عبارة واضحة للحث على اتّخاذ إجراء أو إشارة إلى أنّه سيتطلب تنفيذ عملية الوصول إلى موقعه الجغرافي. ويمكن للمستخدم بعد ذلك ربط طلب النظام بالوصول إلى الإجراء الذي بدأه للتو بسهولة أكبر.

تقديم إشارة واضحة إلى أنّ الإجراء سيطلب الموقع الجغرافي

في دراسة أجراها فريق "إعلانات Google"، عندما طُلب من أحد المستخدِمين حجز غرفة في فندق في بيروت لحضور مؤتمر قادم على موقع إلكتروني معيّن للفنادق، طُلب منه مشاركة موقعه الجغرافي وفقًا لنظام تحديد المواقع العالمي (GPS) بعد النقر مباشرةً على عبارة "العثور على فندق وحجزه" في الصفحة الرئيسية.

في بعض الحالات، شعر المستخدم بالإحباط لأنّه لم يفهم سبب ظهور فنادق في دبي عندما أراد حجز غرفة في القاهرة.

لتوفير تجربة أفضل، احرص على أن يفهم المستخدمون سبب طلب ملموقعهم الجغرافي. أضِف رمزًا معروفًا شائعًا على الأجهزة، مثل أداة قياس المسافة، أو عبارة واضحة للحثّ على اتّخاذ إجراء، مثل "العثور على مكان قريب مني".

حثّ المستخدمين بلطف على منح الإذن بالوصول إلى موقعهم الجغرافي

لا يمكنك الوصول إلى أيّ من الإجراءات التي يتّخذها المستخدمون. يمكنك معرفة متى منع المستخدمون الوصول إلى مواقعهم الجغرافية بالضبط، ولكن لا يمكنك معرفة متى منحونك الإذن بالوصول، ولن تعرف أنّك حصلت على الإذن إلا عند ظهور النتائج.

من الممارسات الجيدة "حثّ" المستخدمين على اتّخاذ إجراء إذا كنت بحاجة إلى إكماله.

ننصحك بما يلي:

1. اضبط موقّتًا يتم تفعيله بعد فترة قصيرة، و5 ثوانٍ هي قيمة جيدة.
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.');
}

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

توفّر واجهة برمجة التطبيقات Geolocation API طريقة بسيطة "لمرة واحدة" للحصول على الموقع الجغرافي للمستخدم: 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().

إذا كنت تريد مراقبة الموقع الجغرافي للمستخدم باستمرار، استخدِم 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 لإيقاف أنظمة تحديد الموقع الجغرافي.

التعامل مع الأخطاء بشكلٍ آمن

لا تنجح بعض عمليات البحث عن المواقع الجغرافية. ربما يتعذّر تحديد موقع جهاز GPS أو أوقف المستخدم عمليات البحث عن الموقع الجغرافي فجأة. في حال حدوث خطأ، يتمّ استدعاء وسيطة اختيارية ثانية في 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 لإعلام المتصفّح باستخدام نتيجة الموقع الجغرافي التي تم الحصول عليها مؤخرًا. لا يؤدي ذلك إلى عرض البيانات بشكل أسرع إذا طلبها المستخدم من قبل فحسب، بل يمنع المتصفّح أيضًا من بدء واجهات الأجهزة الخاصة بالموقع الجغرافي، مثل تحديد الموقع الجغرافي بالاستناد إلى شبكة Wi-Fi أو نظام تحديد المواقع العالمي (GPS).

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"

بعد الانتهاء من إعداد الموقع الجغرافي، عليك إجراء ما يلي:

• اختبِر أداء تطبيقك في مواقع جغرافية مختلفة.
• تأكَّد من أنّ تطبيقك ينخفض أداءه بشكل سلس عندما لا يكون رصد الموقع الجغرافي متاحًا.

يمكنك إجراء كلا الأمرين من خلال "أدوات مطوّري البرامج في Chrome".

1. افتح "أدوات مطوّري البرامج في Chrome".
2. اضغط على Esc لفتح أدراج وحدة التحكّم.
3. افتح قائمة "درج وحدة التحكّم".
4. انقر على الخيار أجهزة الاستشعار لعرض علامة التبويب "أجهزة الاستشعار".

من هنا، يمكنك إلغاء الموقع الجغرافي وضبطه على مدينة رئيسية محدّدة مسبقًا، أو إدخال موقع جغرافي مخصّص، أو إيقاف الموقع الجغرافي من خلال ضبط الإعدادات على الموقع الجغرافي غير متوفّر.

ملاحظات