ขอปรึกษาการใช้ HTML5 เพื่อดึงข้อมูล Geolocation บน web server แต่ละแบบ
geolocation มันเป็น js รันบนเบราเซอร์ ไม่ว่าจะวางไว้ที่ไหนมันก็รันได้เหมือนกันไม่เกี่ยวกับ web server
Date :
2017-10-05 00:38:22
By :
mr.v
มันไม่มีอะไรที่เป็น server side สักนิดเดียวเลยแล้วจะไปเกี่ยวกับ web server ได้ยังไงครับ
คุณไม่ไล่ดูไฟล์ที่โหลดล่ะว่ามันมี 404 อันไหนหรือเปล่า พวก .js ทั้งหลายแหล่
Date :
2017-10-06 00:53:07
By :
mr.v
Code (JavaScript)
<!DOCTYPE html>
<html>
<body>
<p>Click the button to get your coordinates.</p>
<button onclick="getLocation()">Try It</button>
<p id="demo"></p>
<script>
var x = document.getElementById("demo");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
}
</script>
</body>
</html>
credit:https://www.w3schools.com/html/html5_geolocation.asp
ผมใช้ code จาก www.w3schools.com ซึ่งเป็น js ปกติ ไม่ได้มีการ include js เข้ามา
มาลองทดสอบ ก็เป็นแบบเดียวกันครับ
Date :
2017-10-11 18:56:06
By :
iieszz
ตอนนี้ หาวิธีแก้ปัญหานี้ได้แล้วนะครับ
โดยใช้ jQuery ajax ไปขอใช้ข้อมูลในรูปแบบ json จาก https://geoip-db.com/ มาใช้งานครับ(ตำแหน่งอาจจะไม่ตรงมาก แต่ก็พอใช้ได้)
ส่วน code จาก w3cschool
web server ต้องมี ssl อย่างที่พี่วิน แนะนำไว้ครับ
Code (PHP)
<!DOCTYPE html>
<html>
<head>
<title>GEOIP DB - jQuery example</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<div>Country: <span id="country"></span>
<div>State: <span id="state"></span>
<div>City: <span id="city"></span>
<div>Latitude: <span id="latitude"></span>
<div>Longitude: <span id="longitude"></span>
<div>IP: <span id="ip"></span>
<script>
$.ajax({
url: "https://geoip-db.com/jsonp",
jsonpCallback: "callback",
dataType: "jsonp",
success: function( location ) {
$('#country').html(location.country_name);
$('#state').html(location.state);
$('#city').html(location.city);
$('#latitude').html(location.latitude);
$('#longitude').html(location.longitude);
$('#ip').html(location.IPv4);
}
});
</script>
</body>
</html>
ประวัติการแก้ไข 2017-10-23 16:31:02 2017-10-23 17:45:13 2017-10-23 17:46:07
Date :
2017-10-23 16:26:09
By :
iieszz
Code (JavaScript)
var apiGeolocationSuccess = function(position) {
alert("API geolocation success!\n\nlat = " + position.coords.latitude + "\nlng = " + position.coords.longitude);
};
var tryAPIGeolocation = function() {
jQuery.post( "https://www.googleapis.com/geolocation/v1/geolocate?key=AIzaSyDCa1LUe1vOczX1hO_iGYgyo8p_jYuGOPU", function(success) {
apiGeolocationSuccess({coords: {latitude: success.location.lat, longitude: success.location.lng}});
})
.fail(function(err) {
alert("API Geolocation error! \n\n"+err);
});
};
var browserGeolocationSuccess = function(position) {
alert("Browser geolocation success!\n\nlat = " + position.coords.latitude + "\nlng = " + position.coords.longitude);
};
var browserGeolocationFail = function(error) {
switch (error.code) {
case error.TIMEOUT:
alert("Browser geolocation error !\n\nTimeout.");
break;
case error.PERMISSION_DENIED:
if(error.message.indexOf("Only secure origins are allowed") == 0) {
tryAPIGeolocation();
}
break;
case error.POSITION_UNAVAILABLE:
alert("Browser geolocation error !\n\nPosition unavailable.");
break;
}
};
var tryGeolocation = function() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(
browserGeolocationSuccess,
browserGeolocationFail,
{maximumAge: 50000, timeout: 20000, enableHighAccuracy: true});
}
};
tryGeolocation();
https://stackoverflow.com/questions/39366758/geolocation-without-ssl-connection
Date :
2017-10-24 03:34:33
By :
mr.v
Load balance : Server 02