ajax前后端简单配合使用
json简介
json可作为前后端通信的载体,可将数组或对象封装成json,进行信息传递。
json数据示例:
数组:["hello",12]
对象:{"Name":"jack","age":12}
注意在php中:
由于javascript不支持关联数组,所以json_encode()只将索引数组(indexed array)转为数组格式,而将关联数组(associative array)转为对象格式。
前端ajax使用
前端利用jQuery的ajax来实现异步传输:
<script>
$(function () {
$.ajax({
type: "GET",
async: false,
url: "http://localhost:63342/be/info.php",
data: {info: 1},
dataType: "json",
success: function (data) {
//此处所得到的data是已被解析,可当做对象直接使用
for(var i=0;i<data.length;i++)
{
$(".title").eq(i).html(data[i].Name);
}
}
});
});
</script>
后端处理json
首先php需要接受前端所传输过来的json数据,这里在实验中存在一个问题:
在使用GET方式,php中使用$_GET[‘para’]
是没有问题的,但使用POST方式时,php中使用$_POST
去无法获取到参数,不明确具体原因,但利用$info=file_get_contents("php://input")
是可以获取到原始请求数据的,$info
为一字符串,内容为类似于info=1&&page=12
。
后端处理数据示例:
<?php
require("DatabaseManager.php");
$so = new DatabaseManager();
$content= $so->query("select * from emuGame;");
$info=[];
while($row = mysqli_fetch_array($content))
{
array_push($info,$row);
}
echo json_encode($row);//将数组打包成json
注意事项
- js利用ajax通信时,应在同一域名下,如果跨域名,会无法获取到返回的数据,搞了很久才发现。如果需要跨域,网上说php中可以加上
header('Access-Control-Allow-Origin:*');