ব্যবহারকারীর লোকেশন

ব্যবহারকারীর সম্মতি থাকলে, Geolocation API আপনাকে তার লোকেশন খুঁজে পেতে সাহায্য করে।

ব্যবহারকারীর সম্মতি নিয়ে Geolocation API আপনাকে ব্যবহারকারীর লোকেশন খুঁজে পেতে সাহায্য করে। আপনি এই কার্যকারিতা ব্যবহার করে ব্যবহারকারীকে তার গন্তব্যে পৌঁছাতে সাহায্য করতে পারেন এবং ব্যবহারকারীর তৈরি করা কন্টেন্ট জিও-ট্যাগ করতে পারেন; যেমন, কোনও ফটো কোথায় তোলা হয়েছে তা চিহ্নিত করা।

এছাড়াও, Geolocation API-এর সাহায্যে আপনি ব্যবহারকারীর লোকেশন দেখতে এবং তিনি এক জায়গা থেকে অন্য জায়গায় গেলে তার উপর নজর রাখতে পারবেন, তবে এর জন্য ব্যবহারকারীর সম্মতি প্রয়োজন (এবং শুধুমাত্র পৃষ্ঠা খোলা থাকাকালীন)। এর ফলে অনেক আকর্ষণীয় ব্যবহারের সুযোগ তৈরি হয়, যেমন ব্যবহারকারী কাছাকাছি থাকলে ব্যাকএন্ড সিস্টেমের সাথে ইন্টিগ্রেট করে অর্ডার সংগ্রহ করার জন্য প্রস্তুত করা।

Geolocation API ব্যবহার করার সময় আপনাকে অনেক কিছু সম্পর্কে সচেতন থাকতে হবে। এই নির্দেশিকা আপনাকে সাধারণ ব্যবহারের উদাহরণ ও সমাধান সম্পর্কে জানাবে।

সারাংশ

  • ব্যবহারকারীর সুবিধা হলে তবেই ভৌগোলিক অবস্থান ব্যবহার করুন।
  • ইউজার জেসচারের স্পষ্ট উত্তর হিসেবে অনুমতি চান।
  • ব্যবহারকারীর ব্রাউজারে জিওলোকেশন কাজ না করলে ফিচার শনাক্তকরণ ব্যবহার করুন।
  • শুধু জিওলোকেশন কীভাবে প্রয়োগ করতে হয় তা জানলেই হবে না; জিওলোকেশন ব্যবহার করার সেরা উপায়ও জানতে হবে।
  • আপনার সাইটের সাথে ভৌগোলিক লোকেশন পরীক্ষা করুন।

জিওলোকেশন কখন ব্যবহার করতে হয়

  • ব্যবহারকারীর অভিজ্ঞতা কাস্টমাইজ করতে, ব্যবহারকারী কোনও নির্দিষ্ট ফিজিক্যাল লোকেশনের কতটা কাছাকাছি আছেন তা খুঁজে বের করুন।
  • ব্যবহারকারীর লোকেশন অনুযায়ী তথ্য (যেমন খবর) কাস্টমাইজ করা।
  • ম্যাপে ব্যবহারকারীর অবস্থান দেখান।
  • ব্যবহারকারীর লোকেশন সহ আপনার অ্যাপ্লিকেশনের মধ্যে তৈরি করা ডেটা ট্যাগ করুন (অর্থাৎ, কোনও ছবি জিও-ট্যাগ করুন)।

দায়িত্ব সহকারে অনুমতি চাওয়া

ব্যবহারকারী সম্পর্কিত সাম্প্রতিক তথ্য থেকে জানা গেছে যে, যেসব সাইট পৃষ্ঠা লোড হওয়ার সাথে সাথেই ব্যবহারকারীকে তার লোকেশন শেয়ার করার জন্য প্রম্পট করে, ব্যবহারকারীরা সেইসব সাইটকে বিশ্বাস করেন না। তাহলে, পেশাদার পদ্ধতিগুলি কী কী?

ধরে নিন যে ব্যবহারকারীরা আপনাকে তাদের লোকেশন জানাবেন না

আপনার অনেক ব্যবহারকারীই তাদের লোকেশন আপনাকে জানাতে চাইবেন না, তাই আপনাকে রক্ষণাত্মক ডেভেলপমেন্ট স্টাইল গ্রহণ করতে হবে।

  1. জিওলোকেশন API-এর বাইরে সব সমস্যার সমাধান করুন যাতে আপনি এই পরিস্থিতিতে আপনার সাইটকে মানিয়ে নিতে পারেন।
  2. লোকেশন অ্যাক্সেস করার প্রয়োজনীয়তা সম্পর্কে স্পষ্ট ও বিস্তারিত তথ্য দিন।
  3. প্রয়োজন হলে, ফলব্যাক সমাধান ব্যবহার করুন।

জিওলোকেশন প্রয়োজন হলে ফলব্যাক ব্যবহার করুন

আমরা সাজেস্ট করি যে আপনার সাইট বা অ্যাপ্লিকেশনের জন্য ব্যবহারকারীর বর্তমান লোকেশন অ্যাক্সেস করার প্রয়োজন নেই। তবে, আপনার সাইট বা অ্যাপ্লিকেশনের জন্য ব্যবহারকারীর বর্তমান লোকেশন প্রয়োজন হলে, থার্ড-পার্টি সমাধান আছে যা আপনাকে ব্যক্তির বর্তমান লোকেশন সম্পর্কে সবচেয়ে সঠিক অনুমান করতে দেয়।

এইসব সমাধান প্রায়শই ব্যবহারকারীর IP অ্যাড্রেস দেখে এবং RIPE ডেটাবেসে রেজিস্টার করা ফিজিক্যাল অ্যাড্রেসের সাথে সেটি ম্যাপ করে কাজ করে। এইসব লোকেশন সাধারণত খুব একটা সঠিক হয় না, সাধারণত ব্যবহারকারীর সবচেয়ে কাছাকাছি থাকা টেলিকমিউনিকেশন হাব বা সেল ফোন টাওয়ারের লোকেশন দেখায়। অনেক ক্ষেত্রে, সেগুলি সঠিক নাও হতে পারে, বিশেষ করে ব্যবহারকারী VPN বা অন্য কোনও প্রক্সি পরিষেবা ব্যবহার করলে।

ইউজার জেসচারের মাধ্যমে লোকেশন অ্যাক্সেস করার জন্য সবসময় অনুরোধ করুন

ব্যবহারকারীরা যাতে বুঝতে পারেন যে আপনি কেন তাদের লোকেশন জানতে চাইছেন এবং এতে তাদের কী সুবিধা হবে, তা নিশ্চিত করুন। সাইট লোড হওয়ার সাথে সাথে হোমপেজে অবিলম্বে এটি চাইলে ব্যবহারকারীর অভিজ্ঞতা খারাপ হয়।

স্টোর খোঁজার পৃষ্ঠায় কোনও সাইট অনুমতি চাইছে।
করণীয়: ইউজার জেসচারের মাধ্যমে সবসময় লোকেশন অ্যাক্সেস করার অনুরোধ করুন।
হোমপেজে অনুমতি চাইছে এমন একটি সাইট।
করবেন না: সাইট লোড হওয়ার সময় হোমপেজে এটি চাইবেন না; এর ফলে ব্যবহারকারীর অভিজ্ঞতা খারাপ হয়।

এর পরিবর্তে, ব্যবহারকারীকে স্পষ্ট কল টু অ্যাকশন বা ইঙ্গিত দিন যে কোনও অপারেশন করতে তার লোকেশন অ্যাক্সেস করতে হবে। ব্যবহারকারী তখন আরও সহজে অ্যাক্সেসের জন্য সিস্টেম প্রম্পটকে অ্যাকশনের সাথে যুক্ত করতে পারেন যা সবেমাত্র শুরু হয়েছে।

কোনও অ্যাকশন তাদের লোকেশন জানতে চাইলে, সেই বিষয়ে স্পষ্ট ইঙ্গিত দিন

Google Ads টিমের করা একটি সমীক্ষায়, আসন্ন কনফারেন্সের জন্য বোস্টনে হোটেল রুম বুক করার জন্য কোনও ব্যবহারকারীকে একটি নির্দিষ্ট হোটেলের সাইটে বলা হলে, হোমপেজে "খুঁজুন ও বুক করুন" কল টু অ্যাকশনে ট্যাপ করার সাথে সাথেই তাকে জিপিএস লোকেশন শেয়ার করার জন্য প্রম্পট করা হয়।

কিছু ক্ষেত্রে, ব্যবহারকারী হতাশ হয়ে পড়েন কারণ তিনি বুঝতে পারেন না যে বোস্টনে রুম বুক করতে চাইলেও কেন তাকে সান ফ্রান্সিসকোর হোটেল দেখানো হচ্ছে।

ব্যবহারকারীদের থেকে লোকেশন চাওয়ার কারণ তাদের বুঝিয়ে বলাটা আরও ভালো অভিজ্ঞতা প্রদান করে। বিভিন্ন ডিভাইসে সাধারণত ব্যবহার করা হয় এমন পরিচিত চিহ্ন যোগ করুন, যেমন রেঞ্জ ফাইন্ডার বা “আমার কাছাকাছি খুঁজুন”-এর মতো স্পষ্ট কল টু অ্যাকশন।

একটি রেঞ্জ ফাইন্ডার।
রেঞ্জ ফাইন্ডার ব্যবহার করুন
আমার কাছাকাছি খুঁজুন বোতাম সহ একটি ফর্ম।
আমার কাছাকাছি খুঁজতে নির্দিষ্ট কল টু অ্যাকশন

ব্যবহারকারীদের তাদের লোকেশন অ্যাক্সেস করার অনুমতি দিতে অনুরোধ করুন

ব্যবহারকারীরা যা করছেন তার কোনও কিছুতেই আপনার অ্যাক্সেস নেই। ব্যবহারকারী কখন তার লোকেশন অ্যাক্সেস করার অনুমতি দেননি তা আপনি ঠিকভাবে জানেন, কিন্তু কখন তিনি আপনাকে অ্যাক্সেস দিয়েছেন তা আপনি জানেন না; ফলাফল দেখা গেলে আপনি শুধু জানতে পারেন যে আপনি অ্যাক্সেস পেয়েছেন।

ব্যবহারকারীকে দিয়ে কোনও অ্যাকশন সম্পূর্ণ করাতে চাইলে, তাকে "নাজ" করা একটি ভালো অভ্যাস।

আমরা সাজেস্ট করি:

  1. এমন একটি টাইমার সেট-আপ করুন যা অল্প সময়ের পরে ট্রিগার করে; ৫ সেকেন্ড হল একটি ভালো ভ্যালু।
  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);
};

ব্রাউজার সহায়তা

অধিকাংশ ব্রাউজার এখন জিওলোকেশন 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);
};

এই ডোমেনে কোনও অ্যাপ্লিকেশন যদি প্রথমবার অনুমতির জন্য অনুরোধ করে, তাহলে ব্রাউজার সাধারণত ব্যবহারকারীর সম্মতি চেক করে। ব্রাউজারের উপর নির্ভর করে, অনুমতি লুকআপ সবসময় অনুমোদন—বা বাতিল—করার জন্য পছন্দও থাকতে পারে, যেক্ষেত্রে কনফার্মেশন প্রসেস বাইপাস করা হয়।

আপনার ব্রাউজার যে লোকেশন ডিভাইস ব্যবহার করছে তার উপর নির্ভর করে, পজিশন অবজেক্টে আসলে অক্ষাংশ এবং দ্রাঘিমাংশের চেয়ে অনেক বেশি কিছু থাকতে পারে; যেমন, এতে উচ্চতা বা দিকনির্দেশ অন্তর্ভুক্ত থাকতে পারে। লোকেশন সিস্টেমটি আসলে ডেটা ফেরত না দেওয়া পর্যন্ত আপনি বলতে পারবেন না যে এটি কী অতিরিক্ত তথ্য ব্যবহার করে।

ব্যবহারকারীর লোকেশন দেখা হচ্ছে

জিওলোকেশন API আপনাকে getCurrentPosition()-এ একটি কল করে ব্যবহারকারীর লোকেশন (ব্যবহারকারীর সম্মতি সহ) পেতে দেয়।

আপনি যদি ব্যবহারকারীর লোকেশন ক্রমাগত মনিটর করতে চান, তাহলে Geolocation API পদ্ধতি, 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 কল করুন।

সমস্যা আরও ভালোভাবে ম্যানেজ করা

সব লোকেশন লুকআপ সফল হয়নি। হয়ত জিপিএস লোকেশন খুঁজে পাওয়া যায়নি অথবা ব্যবহারকারী হঠাৎ লোকেশন লুকআপ বন্ধ করে দিয়েছেন। কোনও সমস্যা হলে, 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 ঐচ্ছিক প্রপার্টি ব্যবহার করুন। ব্যবহারকারী আগে ডেটার জন্য অনুরোধ করে থাকলে, এটি শুধু দ্রুত ফলাফলই দেখায় না, বরং ব্রাউজারকে ওয়াই-ফাই ট্রায়াঙ্গুলেশন বা জিপিএসের মতো জিওলোকেশন হার্ডওয়্যার ইন্টারফেস চালু করা থেকেও বিরত রাখে।

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

সুনির্দিষ্ট লোকেশনের পরিবর্তে আনুমানিক লোকেশন বেছে নিন

আপনি যদি কোনও ব্যবহারকারীর সবচেয়ে কাছের স্টোর খুঁজতে চান, তাহলে ১-মিটারের নির্ভুলতা প্রয়োজন হওয়ার সম্ভাবনা কম। API এমনভাবে ডিজাইন করা হয়েছে যাতে এটি আনুমানিক লোকেশন প্রদান করে এবং যত দ্রুত সম্ভব ফলাফল দেখায়।

আপনার যদি উচ্চ স্তরের নির্ভুলতার প্রয়োজন হয়, তাহলে 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 DevTools-এর মাধ্যমে ভৌগোলিক অবস্থান এমুলেট করা

DevTools-এ সেন্সর ট্যাব।

আপনি জিওলোকেশন সেট-আপ করে নিলে, আপনি এগুলি করতে চাইবেন:

  • বিভিন্ন ভৌগোলিক লোকেশনে আপনার অ্যাপ কীভাবে কাজ করে তা পরীক্ষা করে দেখুন।
  • জিওলোকেশন উপলভ্য না থাকলে আপনার অ্যাপের পারফর্ম্যান্স যে ধীরে ধীরে কমে যায় তা যাচাই করুন।

আপনি Chrome DevTools থেকে দুটিই করতে পারবেন।

  1. Chrome DevTools খুলুন।
  2. Console ড্রয়ার খুলতে Esc প্রেস করুন।
  3. কনসোল ড্রয়ার মেনু খুলুন
  4. 'সেন্সর' ট্যাব দেখতে সেন্সর বিকল্পে ক্লিক করুন।

এখান থেকে আপনি লোকেশন ওভাররাইড করে আগে থেকে সেট করা কোনও বড় শহর বেছে নিতে পারেন, কাস্টম লোকেশন লিখতে পারেন অথবা ওভাররাইড লোকেশন উপলভ্য নেই হিসেবে সেট করে জিওলোকেশন বন্ধ করতে পারেন।

মতামত