使用 AJAX 从传单映射中获取数据

Question

我的网站上有一张传单地图。我想做的是从用户放置的标记中获取位置数据，并通过会话将其传输到我的数据库。我无法让它工作，我的数据库用户 Pos 没有更新。你能解释一下我做错了什么吗？(数据库连接.php已经工作，经过测试(

这是我的主页.php地图所在的文件：

<?php
ob_start();
session_start();
require_once 'dbconnect.php';
if( !isset($_SESSION['user']) ) {
header("Location: index.php");
exit;
}
$res=mysqli_query($conn,"SELECT * FROM `users` WHERE userId=".$_SESSION['user']);
$userRow[]=mysqli_fetch_array($res);
echo json_encode($userRow);
?>
<script>
$(document).ready(function(){
var mymap = L.map('map').setView([51.505, -0.09], 13);
L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=xxx', {
attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://mapbox.com">Mapbox</a>',
maxZoom: 18,
id: 'mapbox.streets',
accessToken: 'xxx'
}).addTo(mymap);
var marker;
mymap.on('click', function (e) {
if (marker) {
mymap.removeLayer(marker);
}
marker = new L.Marker(e.latlng).addTo(mymap);
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp = new XMLHttpRequest();
} else {
// code for IE6, IE5
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
var user = <?php echo json_encode($userRow['userId']); ?>;
xmlhttp.open("GET","homemappositions.php?q="+ e.latlng + "&r=" + user, true);
xmlhttp.send();
});
});
</script>

这是主图位置.php ：

<?php
include_once('dbconnect.php');
$r = $_GET['r'];
$q = $_GET['q'];
$query2 = mysqli_query($conn,"UPDATE users SET userPos =". $q ."WHERE userId=". $r ); 
echo "succesfull" ;
?>

Answer 1

我希望以下内容可能会有所帮助 - 由于原始代码容易受到SQL注入的影响，因此以下使用prepared statements来缓解该威胁。更新语句不使用%wilcard，因为我觉得这可能是更新失败的原因 - 尽管您的最后一条评论让我认为还有另一个问题。

ajax 函数不一定需要回调函数，但如果有回调函数，它将有助于调试 - 在下面的代码中，它只是一个简单的alert语句，但可以/应该更复杂。

<?php
ob_start();
session_start();
require_once 'dbconnect.php';
if( !empty( $_SESSION['user'] ) ){
exit( header('Location: index.php') );
}
$uid=false;
$user=$_SESSION['user'];
/* The only column used later is userid so only select that column */
$sql='select `userid` from `users` where userid=?';
/* Prepare the sql */
$stmt=$conn->prepare( $sql );
if( $stmt ){
/* Bind the parameters to the sql statement */
$stmt->bind_param( 's', $user );
$res=$conn->execute();
/* Assign retrieved results */
if( $res && $stmt->num_rows==1 ){
$stmt->bind_result( $uid );
$stmt->fetch();
$stmt->free_result();
$stmt->close();
}
}
?>
<script>
$(document).ready(function(){
var mymap = L.map('map').setView([51.505, -0.09], 13);
L.tileLayer( 'https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=xxx', {
attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://mapbox.com">Mapbox</a>',
maxZoom: 18,
id: 'mapbox.streets',
accessToken: 'xxx'
}).addTo( mymap );
var marker;
mymap.on( 'click', function(e) {
if( marker ) {
mymap.removeLayer( marker );
}
marker = new L.Marker(e.latlng).addTo(mymap);
<?php
echo "var user='$uid';";
?>
var xmlhttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');
xmlhttp.onload=function(){
alert( this.response );
};
xmlhttp.onerror=function( err ){
alert( err );
};
xmlhttp.open( 'GET', 'homemappositions.php?q='+e.latlng+'&r='+user, true );
xmlhttp.send();
});
});
</script>



<?php
include 'dbconnect.php';
$r = !empty( $_GET['r'] ) ? $_GET['r'] : false;
$q = !empty( $_GET['q'] ) ? $_GET['q'] : false;
if( $r && $q ){
$sql='update `users` set `userpos`=? where `userid`=?';
$stmt=$conn->prepare( $sql );
if( $stmt ){
$stmt->bind_param( 'ss', $q, $r );
$result=$stmt->execute();
echo $result ? 'good' : 'bad'; //ugly
}
} else {
exit('Bad Foo - two parameters are required');
}
?>