3 cách để làm điều này trong câu trả lời này:
- Nhận vị trí chính xác GPS yêu cầu người dùng cho phép truy cập API của trình duyệt
- Nhận một vị trí gần đúng [quốc gia, thành phố, khu vực] bằng cách sử dụng dịch vụ địa lý bên ngoài
- Nhận một vị trí gần đúng [quốc gia, thành phố, khu vực] bằng dịch vụ CDN
Yêu cầu người dùng cho phép truy cập API của trình duyệt
Bạn có thể nhận được vị trí của máy khách bằng các tính năng HTML5. Điều này sẽ giúp bạn có vị trí chính xác của người dùng nếu nó được thực hiện từ một thiết bị có GPS hoặc vị trí gần đúng. Sau khi người dùng chấp thuận để chia sẻ vị trí của mình, bạn sẽ nhận được nó mà không cần chấp thuận nữa. Giải pháp này sử dụng định vị địa lý.getCurrentPocation []. Nó được yêu cầu cho hầu hết các trường hợp để thực hiện điều này trong giao thức HTTPS.
Nếu bạn đang vội, đây là một bản mã với giải pháp này: //codepen.io/sebastienfi/pen/pqnxea
Click the button to get your coordinates:
Try It
var x = document.getElementById["demo"];
function getLocation[] {
if [navigator.geolocation] {
navigator.geolocation.getCurrentPosition[
// Success function
showPosition,
// Error function
null,
// Options. See MDN for details.
{
enableHighAccuracy: true,
timeout: 5000,
maximumAge: 0
}];
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition[position] {
x.innerHTML="Latitude: " + position.coords.latitude +
"
Longitude: " + position.coords.longitude;
}
Xử lý lỗi và từ chối tham số thứ hai của phương thức GetCienPocation [] được sử dụng để xử lý các lỗi. Nó chỉ định một chức năng để chạy nếu nó không nhận được vị trí của người dùng: The second parameter of the getCurrentPosition[] method is used to handle errors. It specifies a function to run if it fails to get the user's location:
function showError[error] {
switch[error.code] {
case error.PERMISSION_DENIED:
x.innerHTML = "User denied the request for Geolocation."
break;
case error.POSITION_UNAVAILABLE:
x.innerHTML = "Location information is unavailable."
break;
case error.TIMEOUT:
x.innerHTML = "The request to get user location timed out."
break;
case error.UNKNOWN_ERROR:
x.innerHTML = "An unknown error occurred."
break;
}
}
Hiển thị kết quả trong bản đồ
function showPosition[position] {
var latlon = position.coords.latitude + "," + position.coords.longitude;
var img_url = "//maps.googleapis.com/maps/api/staticmap?center=
"+latlon+"&zoom=14&size=400x300&sensor=false";
document.getElementById["mapholder"].innerHTML = "";
}
Geoip
Nếu giải pháp trên không hoạt động trong kịch bản của bạn, bạn có thể có được vị trí gần đúng bằng vị trí của IP. Bạn sẽ không nhất thiết có được vị trí chính xác của người dùng, nhưng có thể kết thúc với vị trí của nút Internet gần nhất trong khu vực điểm kết nối của người dùng, có thể đủ gần với 99% các trường hợp sử dụng [quốc gia, thành phố, khu vực] .
Vì điều này không chính xác nhưng không yêu cầu sự chấp thuận của người dùng, điều này cũng có thể đáp ứng các yêu cầu của bạn.
Tìm dưới 2 cách để làm điều đó. Tôi sẽ khuyên bạn nên làm điều này bằng cách sử dụng giải pháp CDN vì nó nhanh hơn và vâng, tốc độ rất quan trọng.
Nhận một vị trí gần đúng [quốc gia, thành phố, khu vực] bằng cách sử dụng dịch vụ địa lý bên ngoài
Nhận một vị trí gần đúng [quốc gia, thành phố, khu vực] bằng dịch vụ CDN
Yêu cầu người dùng cho phép truy cập API của trình duyệt
Get web visitor's location
if[google.loader.ClientLocation]
{
visitor_lat = google.loader.ClientLocation.latitude;
visitor_lon = google.loader.ClientLocation.longitude;
visitor_city = google.loader.ClientLocation.address.city;
visitor_region = google.loader.ClientLocation.address.region;
visitor_country = google.loader.ClientLocation.address.country;
visitor_countrycode = google.loader.ClientLocation.address.country_code;
document.getElementById['yourinfo'].innerHTML = 'Lat/Lon: ' + visitor_lat + ' / ' + visitor_lon + '
Location: ' + visitor_city + ', ' + visitor_region + ', ' + visitor_country + ' [' + visitor_countrycode + ']
';
}
else
{
document.getElementById['yourinfo'].innerHTML = 'Whoops!
';
}
Nhận một vị trí gần đúng [quốc gia, thành phố, khu vực] bằng dịch vụ CDN
Yêu cầu người dùng cho phép truy cập API của trình duyệt
Bạn có thể nhận được vị trí của máy khách bằng các tính năng HTML5. Điều này sẽ giúp bạn có vị trí chính xác của người dùng nếu nó được thực hiện từ một thiết bị có GPS hoặc vị trí gần đúng. Sau khi người dùng chấp thuận để chia sẻ vị trí của mình, bạn sẽ nhận được nó mà không cần chấp thuận nữa. Giải pháp này sử dụng định vị địa lý.getCurrentPocation []. Nó được yêu cầu cho hầu hết các trường hợp để thực hiện điều này trong giao thức HTTPS.
Nếu bạn đang vội, đây là một bản mã với giải pháp này: //codepen.io/sebastienfi/pen/pqnxea