Kullanıcının Bulunduğu Yer

Coğrafi Konum API'si, kullanıcının iznini aldıktan sonra kullanıcının konumunu keşfetmenize olanak tanır.

Coğrafi Konum API'si, kullanıcının izniyle kullanıcının konumunu keşfetmenize olanak tanır. Bu işlevi, kullanıcıyı hedefine yönlendirmek ve kullanıcı tarafından oluşturulan içeriği coğrafi etiketlemek (ör. bir fotoğrafın çekildiği yeri işaretlemek) gibi işlemler için kullanabilirsiniz.

Coğrafi Konum API'si, kullanıcının nerede olduğunu görmenize ve hareket ederken onu takip etmenize de olanak tanır. Bu işlemler her zaman kullanıcının izniyle (ve yalnızca sayfa açıkken) yapılır. Bu, kullanıcı yakınlardaysa siparişi teslim almaya hazır hale getirmek için arka uç sistemlerle entegrasyon gibi birçok ilginç kullanım alanı oluşturur.

Coğrafi Konum API'yi kullanırken birçok noktayı göz önünde bulundurmanız gerekir. Bu kılavuzda, yaygın kullanım alanları ve çözümler açıklanmaktadır.

Özet

  • Kullanıcıya fayda sağlayacağı durumlarda coğrafi konum bilgisini kullanın.
  • Kullanıcı hareketine net bir yanıt olarak izin isteyin.
  • Kullanıcının tarayıcısı coğrafi konumu desteklemiyorsa özellik algılama özelliğini kullanın.
  • Coğrafi konum özelliğini nasıl uygulayacağınızı değil, en iyi şekilde nasıl kullanacağınızı öğrenin.
  • Coğrafi konumu sitenizle test edin.

Coğrafi konum ne zaman kullanılır?

  • Kullanıcı deneyimini özelleştirmek için kullanıcının belirli bir fiziksel konuma en yakın olduğu yeri bulun.
  • Bilgileri (ör. haberler) kullanıcının konumuna göre uyarlama
  • Kullanıcının haritadaki konumunu gösterme
  • Uygulamanızda oluşturulan verileri kullanıcının konumuyla etiketleyin (yani bir resme coğrafi etiket ekleyin).

Sorumluluk bilinciyle izin isteyin

Son kullanıcı çalışmaları, kullanıcıların sayfa yüklenirken konumlarını paylaşmalarını isteyen sitelere güvenmediğini göstermiştir. Peki en iyi uygulamalar nelerdir?

Kullanıcıların size konumlarını vermeyeceğini varsayın

Kullanıcılarınızın çoğu konum bilgisini paylaşmak istemez. Bu nedenle, savunmacı bir geliştirme stili benimsemeniz gerekir.

  1. Sitenizi bu duruma uyarlayabilmek için coğrafi konum API'sindeki tüm hataları ele alın.
  2. Konum için ihtiyacınız konusunda net ve açık olun.
  3. Gerekirse yedek bir çözüm kullanın.

Coğrafi konum bilgisi gerekliyse yedek yöntem kullanın

Sitenizin veya uygulamanızın, kullanıcının mevcut konumuna erişmesini gerektirmemesini öneririz. Ancak siteniz veya uygulamanız için kullanıcının mevcut konum bilgisi gerekiyorsa kullanıcının şu anda nerede olduğuna dair en iyi tahmini almanızı sağlayan üçüncü taraf çözümler vardır.

Bu çözümler genellikle kullanıcının IP adresine bakarak ve bu adresi RIPE veritabanına kayıtlı fiziksel adreslerle eşleştirerek çalışır. Bu konumlar genellikle çok doğru değildir ve genellikle kullanıcıya en yakın telekomünikasyon merkezinin veya cep telefonu kulesinin konumunu gösterir. Birçok durumda, özellikle kullanıcı VPN veya başka bir proxy hizmeti kullanıyorsa bu bilgiler o kadar da doğru olmayabilir.

Kullanıcı hareketi sırasında her zaman konuma erişim isteğinde bulunma

Kullanıcıların konumlarını neden istediğinizi ve bu durumdan nasıl faydalanacaklarını anladığından emin olun. Site yüklenirken ana sayfada hemen isteğinde bulunmak, kullanıcı deneyimini olumsuz etkiler.

Mağaza bulucu sayfasında izin isteyen bir site.
UYGULAYIN: Her zaman kullanıcı hareketi üzerinden konuma erişim isteyin.
Ana sayfada izin isteyen bir site.
YAPMAYIN: Site yüklenirken ana sayfada istek istemek, kullanıcı deneyimini olumsuz etkiler.

Bunun yerine, kullanıcıya net bir harekete geçirici mesaj veya bir işlemin konumuna erişmesi gerekeceğini belirten bir gösterge verin. Kullanıcı, erişim istemi için sistem istemiyle yeni başlatılan işlemi daha kolay ilişkilendirebilir.

Bir işlemde konumlarının isteneceğini net bir şekilde belirtin

Google Ads ekibi tarafından yapılan bir çalışmada, kullanıcıdan yaklaşan bir konferans için belirli bir otel sitesinde Boston'da otel odası rezervasyonu yapması istendiğinde, ana sayfada "Bul ve Rezervasyon Yap" harekete geçirici mesajına dokunduktan hemen sonra GPS konumunu paylaşması istendi.

Bazı durumlarda kullanıcı, Boston'da oda rezervasyonu yapmak istediği halde neden San Francisco'daki otellerin gösterildiğini anlamadığı için rahatsız oluyordu.

Kullanıcıların konumlarını neden istediğinizi anladığından emin olmak, daha iyi bir deneyim sunmanıza yardımcı olur. Cihazlar arasında yaygın olarak kullanılan iyi bilinen bir işaretçi (ör. menzil bulucu) veya "Yakınımda Bul" gibi açık bir harekete geçirici mesaj ekleyin.

Mesafe ölçer.
Mesafe bulucu kullanın
"Yakınımdakileri bul" düğmesi içeren bir form.
Yakınımda bulmak için belirli bir harekete geçirici mesaj

Kullanıcıları konum izni vermeye nazikçe teşvik etme

Kullanıcıların yaptığı hiçbir şeye erişiminiz yoktur. Kullanıcıların konumlarına erişime ne zaman izin verdiğini tam olarak bilirsiniz ancak ne zaman erişim izni verdiklerini bilemezsiniz. Erişim iznini yalnızca sonuçlar göründüğünde almış olursunuz.

Kullanıcıların işlemi tamamlamasını istiyorsanız onları işlem yapmaya "yönlendirmek" iyi bir uygulamadır.

Önerilerimiz:

  1. Kısa bir süre sonra tetiklenecek bir zamanlayıcı ayarlayın. 5 saniye iyi bir değerdir.
  2. Hata mesajı alırsanız kullanıcıya bir mesaj gösterin.
  3. Olumlu bir yanıt alırsanız zamanlayıcıyı devre dışı bırakın ve sonuçları işleyin.
  4. Zaman aşımı sona erdikten sonra olumlu bir yanıt alamazsanız kullanıcıya bir bildirim gösterin.
  5. Yanıt daha sonra gelirse ve bildirim hâlâ ekrandaysa bildirimi ekrandan kaldırın.
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);
};

Tarayıcı desteği

Tarayıcılarının çoğu artık Coğrafi Konum API'yi destekliyor olsa da herhangi bir işlem yapmadan önce desteği kontrol etmek her zaman iyi bir uygulamadır.

Coğrafi konum nesnesinin varlığını test ederek uyumluluğu kolayca kontrol edebilirsiniz:

// check for Geolocation support
if (navigator.geolocation) {
  console.log('Geolocation is supported!');
} else {
  console.log('Geolocation is not supported for this Browser/OS.');
}

Kullanıcının mevcut konumunu belirleme

Geolocation API, kullanıcının konumunu almak için basit ve "tek seferlik" bir yöntem sunar: getCurrentPosition(). Bu yöntemin çağrısı, kullanıcının mevcut konumunu ayarsız olarak bildirir.

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);
};

Bu alandaki bir uygulamanın izin istemesi ilk kezse tarayıcı genellikle kullanıcı iznini kontrol eder. Tarayıcıya bağlı olarak, izin aramalarına her zaman izin verme veya izin vermeme tercihleri de olabilir. Bu durumda onay süreci atlanır.

Tarayıcınızın kullandığı konum cihazına bağlı olarak, konum nesnesi yalnızca enlem ve boylamdan çok daha fazlasını içerebilir. Örneğin, rakım veya yön içerebilir. Konum sistemi, verileri gerçekten döndürene kadar hangi ek bilgileri kullandığını bilemezsiniz.

Kullanıcının konumunu izleme

Geolocation API, getCurrentPosition() çağrısıyla tek bir işlemde kullanıcının konumunu (kullanıcı izniyle) almanıza olanak tanır.

Kullanıcının konumunu sürekli olarak izlemek istiyorsanız watchPosition() coğrafi konum API yöntemini kullanın. getCurrentPosition()'e benzer şekilde çalışır ancak yerleşim yazılımı olarak birden çok kez tetiklenir:

  1. Kullanıcıyı daha doğru bir şekilde kilitler.
  2. Kullanıcının konumunun değiştiğini belirler.
var watchId = navigator.geolocation.watchPosition(function (position) {
  document.getElementById('currentLat').innerHTML = position.coords.latitude;
  document.getElementById('currentLon').innerHTML = position.coords.longitude;
});

Kullanıcının konumunu izlemek için coğrafi konum ne zaman kullanılır?

  • Kullanıcı konumunu daha hassas bir şekilde kilitlemek istiyorsanız
  • Uygulamanızın, kullanıcı arayüzünü yeni konum bilgilerine göre güncellemesi gerekir.
  • Kullanıcı belirli bir bölgeye girdiğinde uygulamanızın iş mantığını güncellemesi gerekir.

Coğrafi konum özelliğini kullanmayla ilgili en iyi uygulamalar

Her zaman temizleyin ve pili tasarruf edin

Coğrafi konumdaki değişiklikleri izlemek ücretsiz bir işlem değildir. İşletim sistemleri, uygulamaların coğrafi alt sisteme bağlanmasına olanak tanıyan platform özellikleri sunsa da web geliştiricisi olarak kullanıcının cihazının kullanıcının konumunu izlemek için ne tür bir destek sunduğunu bilemezsiniz. Ayrıca, bir konumu izlerken cihazı çok fazla ek işleme tabi tutarsınız.

Kullanıcının konumunu izlemeniz gerekmediğinde coğrafi konum sistemlerini kapatmak için clearWatch'ü arayın.

Hataları sorunsuz şekilde ele alın

Maalesef tüm konum aramaları başarılı olmaz. GPS bulunamamış veya kullanıcı aniden konum aramalarını devre dışı bırakmış olabilir. Hata durumunda, geri çağırma içinde kullanıcıyı bilgilendirebilmeniz için getCurrentPosition() için ikinci bir isteğe bağlı bağımsız değişken çağrılır:

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);
};

Coğrafi konum donanımının başlatılması ihtiyacını azaltma

Birçok kullanım alanında, kullanıcının en güncel konumuna değil, kabaca bir tahmine ihtiyacınız vardır.

Tarayıcıya yakın zamanda elde edilen bir coğrafi konum sonucunu kullanmasını söylemek için maximumAge isteğe bağlı mülkünü kullanın. Bu, kullanıcının verileri daha önce istemiş olması durumunda yalnızca daha hızlı yanıt vermekle kalmaz, aynı zamanda tarayıcının kablosuz üçgenleme veya GPS gibi coğrafi konum donanım arayüzlerini başlatmasını da önler.

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);
};

Kullanıcıyı bekletmeyin, zaman aşımı ayarlayın

Zaman aşımı ayarlamazsanız mevcut konum isteğiniz hiçbir zaman yanıtlanmayabilir.

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);
};

Ayrıntılı konum yerine yaklaşık konumu tercih edin

Bir kullanıcıya en yakın mağazayı bulmak istiyorsanız 1 metre hassasiyete ihtiyacınız yoktur. API, mümkün olduğunca hızlı bir şekilde kaba bir konum bilgisi döndürecek şekilde tasarlanmıştır.

Yüksek düzeyde hassasiyete ihtiyacınız varsa varsayılan ayarı enableHighAccuracy seçeneğiyle geçersiz kılabilirsiniz. Bu seçeneği dikkatli kullanın: Çözümü daha yavaştır ve daha fazla pil kullanır.

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 Geliştirici Araçları ile coğrafi konumu taklit etme

Geliştirici Araçları'ndaki sensör sekmesi.

Coğrafi konumu ayarladıktan sonra şunları yapmanız gerekir:

  • Uygulamanızın farklı coğrafi konumlarda nasıl çalıştığını test edin.
  • Coğrafi konum kullanılamadığında uygulamanızın sorunsuz bir şekilde performansını düşürdüğünü doğrulayın.

Her iki işlemi de Chrome Geliştirici Araçları'ndan yapabilirsiniz.

  1. Chrome Geliştirici Araçları'nı açın.
  2. Konsol çekmecesini açmak için Esc tuşuna basın.
  3. Console çekmece menüsünü açma
  4. Sensörler sekmesini göstermek için Sensörler seçeneğini tıklayın.

Buradan, konumu önceden ayarlanmış büyük bir şehirle geçersiz kılabilir, özel bir konum girebilir veya geçersiz kılma ayarını Konum kullanılamıyor olarak ayarlayarak coğrafi konumu devre dışı bırakabilirsiniz.

Geri bildirim