מדריך HTML5 – שימוש ב-Geolocation

תכונה מאד שימושית של HTML 5 היא Geolocation API. מדובר ב-API נוח שאפשר להשתמש בו ב-JavaScript על מנת לקבל מידע על מיקומו הגיאוגרפי המשוער של הגולש. מחד גיסא, מדובר בפיצ'ר שימושי מאד במיוחד עבור אתרים או אפליקציות שמי שמשתמש בהן הם גולשים מהתקנים ניידים. מאידך גיסא, יכולת הדיוק של ה-API הזה מבעיתה למדי. במיוחד בהתחשב בכך ש-Geolocation לאו דווקא משתמש בהתקן GPS אלא בשיטות אחרות כגון חישוב ה-IP ושם ה-wi-fi שדרכו אתה מחובר.

כיוון שמדובר במידע רגיש, שימו לב שאם אתם מבצעים קריאה ל-Geolocation, המשתמש יצטרך לאשר שהוא מוכן למסור לכם את המידע. בנוסף כדאי מאד להזהר עם המידע הזה ולהקדיש תשומת לב מיוחדת בנוגע לאבטחתו.

חמושים בזהירות המתבקשת, אנו ניגש ל-API הפשוט למדי. על מנת לקבל את המידע על מיקום המשתמש, אני צריך לבצע קריאה למתודת getCurrentPosition שנמצאת באובייקט-geolocation ולפרט פונקציה שרצה במקרה של success:

<script>
    navigator.geolocation.getCurrentPosition(showPosition);
</script>

מה שיש לנו כאן היא קריאה למתודת getCurrentPosition שמקבלת פרמטר חובה של שם הפונקציה שתרוץ במידה של הצלחה (במקרה הזה שמה הוא showPosition). כלומר, ברגע שהקריאה מקבלת את אישור המשתמש ומצליחה, הפונקציה showPosition תרוץ.

בואו ונכתוב את showPosition:

<script> 
    navigator.geolocation.getCurrentPosition(showPosition);
    
    function showPosition(position) {
        alert(
            position.coords.latitude 
            + " " +
            position.coords.longitude
        );
        }
</script>

קל לראות שמדובר בפונקציה מאד פשוטה. מועבר לתוכה האובייקט position באופן אוטומטי שממנו אפשר לחלץ את הגובה ואת האורך. את הגובה ואת האורך האלו אפשר להעביר ל-API של מפות או לעשות בהם איזה שימוש שאנו רוצים.

לא לשכוח שברגע שהסקריפט הזה רץ, המשתמש צריך לאשר את הבקשה. באינטרנט אקספלורר 9 יקפוץ למשתמש חלון צהוב קטן בתחתית המסך:

במידה והמשתמש לא אישר, אנו יכולים להגדיר פונקציה שתרוץ ותציג למשל למשתמש הודעה שהשירות לא זמין בגלל שהוא לא אישר. עושים את זה כך:

<script> 
    navigator.geolocation.getCurrentPosition(showPosition,failAccess);
    
    function showPosition(position) {
        alert(
            position.coords.latitude 
            + " " +
            position.coords.longitude
        );
        }
    function failAccess() {
      alert('לא אישרת את הבקשה');
    }
</script>

בהתקנים ניידים, המשתמש יכול גם לזוז ולשנות את מיקומו תוך כדי השימוש באפליקציה שלנו. אנו יכולים לכתוב מתודה שתריץ פונקציה כלשהי במידה ויש שינוי במיקום. כך למשל, אני יכול לקרוא שוב לפונקציה showPosition כדי שתקפיץ לי alert על המיקום. עושים זאת כך:

navigator.geolocation.watchPosition(showPosition);

בכל פעם שיערך שינוי במיקום, פונקצית showPosition תרוץ עם המיקום החדש – קל מאד ופשוט מאד לעשות את זה.