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


Posted in PHP onNovember 14, 2017

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

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

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方法请求数据,所以这时候还要加上一个请求文件头

xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");这是固定写法直接记下来就可以了。<br><br>上面的是测试代码,创建一个json格式的字符串并用SEND方法传入PHP:

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

        xhr.send("user="+user);<br><br>这时候要注意了,在构建JSON字符串传输的时候user里面的字符串外面要用单引,里面用双引,不然php那边是不认为你这是JSON 不能正确的进行解析。<br><br><br>这时候看看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所以接收到的只是一个文本格式的字符串<br>这时候我们还要用eval();函数将其转换成JSON格式

* 使用eval()函数进行转换
         使用"()"将其包裹,eval()函数强制将其转换为JSON格式(javascript代码)
         不使用"()"将其包裹,eval()函数将其识别为一个空的代码块

总结

以上所述是小编给大家介绍的Ajax中的JSON格式与php传输过程全面解析,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

PHP 相关文章推荐
php简单封装了一些常用JS操作
Feb 25 PHP
php 无限极分类
Mar 27 PHP
PHPMailer邮件类利用smtp.163.com发送邮件方法
Sep 11 PHP
php 购物车的例子
May 04 PHP
PHP下编码转换函数mb_convert_encoding与iconv的使用说明
Dec 16 PHP
PHP中的array数组类型分析说明
Jul 27 PHP
Laravel中扩展Memcached缓存驱动实现使用阿里云OCS缓存
Feb 10 PHP
php计算指定目录下文件占用空间的方法
Mar 13 PHP
php基于dom实现读取图书xml格式数据的方法
Feb 03 PHP
PHP实现大数(浮点数)取余的方法
Feb 18 PHP
详解php中的implements 使用
Jun 13 PHP
PHP上传文件及图片到七牛的方法
Jul 25 PHP
PHP基于imagick扩展实现合成图片的两种方法【附imagick扩展下载】
Nov 14 #PHP
Laravel Intervention/image图片处理扩展包的安装、使用与可能遇到的坑详解
Nov 14 #PHP
PHP中递归的实现实例详解
Nov 14 #PHP
利用Homestead快速运行一个Laravel项目的方法详解
Nov 14 #PHP
PHP对称加密算法(DES/AES)类的实现代码
Nov 14 #PHP
浅谈PHP中如何实现Hook机制
Nov 14 #PHP
PHP实现将几张照片拼接到一起的合成图片功能【便于整体打印输出】
Nov 14 #PHP
You might like
PHP5.2下chunk_split()函数整数溢出漏洞 分析
2007/06/06 PHP
php 正则表达式小结
2009/08/31 PHP
php中使用PHPExcel读写excel(xls)文件的方法
2014/09/15 PHP
高质量PHP代码的50个实用技巧必备(上)
2016/01/22 PHP
PHP5.5迭代生成器用法实例详解
2016/03/16 PHP
PHP获取指定时间段之间的 年,月,天,时,分,秒
2016/06/05 PHP
php使用file函数、fseek函数读取大文件效率对比分析
2016/11/04 PHP
不能再简单的无闪刷新验证码原理很简单
2007/11/05 Javascript
通过event对象的fromElement属性解决热区设置主实体的一个bug
2008/12/22 Javascript
理解 JavaScript 预解析
2009/10/25 Javascript
Javascript中的迭代、归并方法详解
2016/06/14 Javascript
ionic实现带字的toggle滑动组件
2016/08/27 Javascript
详解springmvc 接收json对象的两种方式
2016/12/06 Javascript
纯js实现倒计时功能
2017/01/06 Javascript
jQuery实现简单弹窗遮罩效果
2017/02/27 Javascript
angularjs过滤器--filter与ng-repeat配合有奇效
2017/04/20 Javascript
node.js实现的装饰者模式示例
2017/09/06 Javascript
禁止弹窗中蒙层底部页面跟随滚动的几种方法
2017/12/07 Javascript
js中let和var定义变量的区别
2018/02/08 Javascript
webpack4之如何编写loader的方法步骤
2019/06/06 Javascript
python判断、获取一张图片主色调的2个实例
2014/04/10 Python
Python获取服务器信息的最简单实现方法
2015/03/05 Python
对pandas的层次索引与取值的新方法详解
2018/11/06 Python
Python正则匹配判断手机号是否合法的方法
2020/12/09 Python
Python通过文本和图片生成词云图
2020/05/21 Python
python3代码输出嵌套式对象实例详解
2020/12/03 Python
python中slice参数过长的处理方法及实例
2020/12/15 Python
matplotlib交互式数据光标mpldatacursor的实现
2021/02/03 Python
CSS3实现渐变背景兼容问题
2020/05/06 HTML / CSS
html5实现多文件的上传示例代码
2014/02/13 HTML / CSS
eHarmony英国:全球领先的认真恋爱约会平台之一
2020/11/16 全球购物
运动会广播稿80字
2014/01/23 职场文书
运动会口号大全
2014/06/07 职场文书
领导干部个人对照检查材料(群众路线)
2014/09/26 职场文书
分享一个vue实现的记事本功能案例
2022/04/11 Vue.js
python计算列表元素与乘积详情
2022/08/05 Python