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

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

Paul Kinlan

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

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

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

ملخّص

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

في دراسة أجراها فريق "إعلانات 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. انقر على الخيار أجهزة الاستشعار لعرض علامة التبويب "أجهزة الاستشعار".

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

ملاحظات