谷歌地图+Ajax+Mysql答案

【问题标题】：Google Map + Ajax + Mysql谷歌地图+Ajax+Mysql
【发布时间】：2018-01-27 16:37:36
【问题描述】：

我想获取变量 location、location1、location2 并将它们放到我在 mysql 中的基础上。我有问题编辑谷歌脚本。我的目标是在客户想要找到位置时保存 3 个变量。
我在互联网上寻找一些建议或代码。我是初学者，很抱歉基本代码。链接http://mikozniak.nazwa.pl/dzis/lok.php 这是我的代码：

google.maps.event.addDomListener(window, 'load', intilize);
function intilize() {
    var autocomplete = new google.maps.places.Autocomplete(document.getElementById("txtautocomplete"));

    google.maps.event.addListener(autocomplete, 'place_changed', function () {



    var place = autocomplete.getPlace();

    var location = place.formatted_address;
    var location1 = place.geometry.location.lat();
    var location2 = place.geometry.location.lng();

    document.getElementById('lblresult').innerHTML = location
    document.getElementById('lblresult1').innerHTML = location1
    document.getElementById('lblresult2').innerHTML = location2
    });

};



     function ajaxFunction() {
        var ajaxRequest;  // The variable that makes Ajax possible!

        try {        
           // Opera 8.0+, Firefox, Safari
           ajaxRequest = new XMLHttpRequest();
        } catch (e) {

           // Internet Explorer Browsers
           try {
              ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
           } catch (e) {

              try {
                 ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
              } catch (e) {
                 // Something went wrong
                 alert("Your browser broke!");
                 return false;
              }
           }
        }

        // Create a function that will receive data
        // sent from the server and will update
        // div section in the same page.
        ajaxRequest.onreadystatechange = function() {

           if(ajaxRequest.readyState == 4) {
              var ajaxDisplay = document.getElementById('ajaxDiv');
              ajaxDisplay.innerHTML = ajaxRequest.responseText;
           }
        }

        // Now get the value from user and pass it to
        // server script.
        var location = document.getElementById('lblresult').value;
        var location1 = document.getElementById('lblresult1').value;
        var location2 = document.getElementById('lblresult2').value;


        queryString +=  "&location = " + location + "&location1 = " + location1 + "&location2 = " + location2;
        ajaxRequest.open("GET", "ajax-example.php" + queryString, true);
        ajaxRequest.send(null); 
     }









</script>


<span>Miejsce:</span><input type="text" id="txtautocomplete" style="width:200px" placeholder="wpisz miejsce"/>

<label id="lblresult"></label>
<label id="lblresult1"></label>
<label id="lblresult2"></label>
 <div id = 'ajaxDiv'>Your result will display here</div>

 <?php
$dbhost = "mikozniak.nazwa.pl";
$dbuser ="user";
$dbpass = "password";
$dbname =  "name";

//Connect to MySQL Server
mysql_connect($dbhost, $dbuser, $dbpass);

//Select Database
mysql_select_db($dbname) or die(mysql_error());

// Retrieve data from Query String
$loc = $_GET['location'];
$loc1 = $_GET['location1'];
$loc2 = $_GET['location2'];

// Escape User Input to help prevent SQL Injection
$loc = mysql_real_escape_string($loc);
$loc1 = mysql_real_escape_string($loc1);
$loc2 = mysql_real_escape_string($loc2);

//build query
$query = "INSERT INTO `miejsca`(`idm`, `dl`, `szr`) VALUES (NULL,$loc1,$loc2)";

//if(is_numeric($age))
  // $query .= " AND age <= $age";

//if(is_numeric($wpm))
  // $query .= " AND wpm <= $wpm";

//Execute query
$qry_result = mysql_query($query) or die(mysql_error());
/*
//Build Result String
$display_string = "<table>";
$display_string .= "<tr>";
$display_string .= "<th>Name</th>";
$display_string .= "<th>Age</th>";
$display_string .= "<th>Sex</th>";
$display_string .= "<th>WPM</th>";
$display_string .= "</tr>";

// Insert a new row in the table for each person returned
while($row = mysql_fetch_array($qry_result)) {
   $display_string .= "<tr>";
   $display_string .= "<td>$row[name]</td>";
   $display_string .= "<td>$row[age]</td>";
   $display_string .= "<td>$row[sex]</td>";
   $display_string .= "<td>$row[wpm]</td>";
   $display_string .= "</tr>";
}

echo "Query: " . $query . "<br />";
$display_string .= "</table>";

echo $display_string;
*/
?>

【问题讨论】：

您的查询不安全，不会受到注入攻击。请使用占位符实现 mysqli 准备语句，以确保安全性和稳定性。

标签： php mysql ajax google-maps

【解决方案1】：

您应该在函数intilize() 中使用Ajax 请求。将您的请求链接到您的 PHP 脚本，将您的变量（location、location1 和 location2）传递到 Ajax 请求的数据参数中，并将它们处理到您的 PHP 脚本中以将它们保存在您的数据库中。

类似的东西：

$.ajax({
   url: '/script.php',  // Your script
   type: 'POST',
   dataType: 'json',
   data: { location: location, location1: location1, location2: location2 }
});

然后，在script.php 中，您将能够使用$_POST["location"] 访问位置、位置1 和位置2。

【讨论】：