Ajax中的JSON格式与php传输过程全面解析

前端  /  管理员 发布于 3年前   318

在Ajax中的JSON格式与php传输过程中有哪些要注意的小地方呢？

先来看一下简单通用的JSON与php传输数据的代码</p><p>

HTML文件：

<input type="button" value="Ajax" id="btn"> 

<script>  

var btn = document.getElementById("btn");  

btn.onclick = function(){    

var xhr = getXhr();    

xhr.open("post","测试.php");    

xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");         

var user = '{"name":"zhangwuji","pwd":"123456"}';    

xhr.send("user="+user);    

xhr.onreadystatechange = function(){      

if(xhr.readyState==4&&xhr.status==200){        

var data = xhr.responseText;        

var json = eval("("+data+")");        

console.log(json);      

}    

}  

}  

function getXhr(){    

var xhr = null;    

if(window.XMLHttpRequest){      

xhr = new XMLHttpRequest();    

}else{      

xhr = new ActiveXObject("Microsoft.XMLHttp");    

}    

return xhr;  

} 

</script>

在整个过程中先要获得AJAX对象，然后用POST请求方式与PHP文件连接，这时候用的是POST方法请求数据，所以这时候还要加上一个请求文件头</p>

xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

这是固定写法直接记下来就可以了。

上面的是测试代码，创建一个json格式的字符串并用SEND方法传入PHP：

var user = '{"name":"zhangwuji","pwd":"123456"}';

xhr.send("user="+user);

这时候要注意了，在构建JSON字符串传输的时候user里面的字符串外面要用单引，里面用双引，

不然php那边是不认为你这是JSON 不能正确的进行解析。

这时候看看PHP文件里的代码：

<?php  

// 接收客户端发送的请求数据  

$user = $_POST['user'];  

// 就是一个JSON格式的string字符串  

$json_user = json_decode($user,true);

//对json格式的字符串进行解码，转换成PHP变量格式  

// 

2. 使用json_encode()函数  

echo json_encode($json_user);

//对php变量格式进行编码，转换成JSON格式

json_decode 和json_encode大家从字面的意思都应该可以看出来一点，decode在这这里的作用就是

对json格式的字符串进行解码，转换成PHP变量格式

而encode就是

对php变量格式进行编码，转换成JSON格式在传输回去;

这时候PHP 文件的工作已经结束了，让我们在回到HTML文件看接受数据的onreadystatechange这一块的代码

var data = xhr.responseText;  

虽然PHP文件传输回来的是一个JSON格式，但是我们这里接受用的是respenseText所以接收到的只是一个文本格式的字符串

这时候我们还要用eval()；函数将其转换成JSON格式

使用eval()函数进行转换         

使用"()"将其包裹,eval()函数强制将其转换为JSON格式(javascript代码)         

不使用"()"将其包裹,eval()函数将其识别为一个空的代码块