美文网首页php基础知识
AJAX get() 和 post() 方法

AJAX get() 和 post() 方法

作者: heson_ajax | 来源:发表于2018-10-20 00:22 被阅读0次
    • GET - 从指定的资源请求数据
    • POST - 向指定的资源提交要处理的数据

    GET 基本上用于从服务器获得(取回)数据。注释:GET 方法可能返回缓存数据。

    POST 也可用于从服务器获取数据。不过,POST 方法不会缓存数据,并且常用于连同请求一起发送数据。

    ajax_GET发起请求步骤

    1、实例化AJAX对象

    var ajaxObj = new XMLHttpRequest();

    2、第二步:设置发送请求的参数
      //参数1:发送请求的方式
            //参数2:发送请求的url(包括数据)
            //参数3:异步(true)/同步(false)
            ajaxObj.open("GET","1ajax_get.php?name=sfk&age=不知道",true);
    
    3、发送请求

    ajaxobj.send();

    4、监听ajax状态变化
            ajaxObj.onreadystatechange = function () {
                //第五步:判断是否成功
                //(1)网络状态值,成功为4
                //0——(未初始化)还没有调用send()
                //1——(正在载入)已经调用send(),正在发送请求
                //2——(载入完成)已经接收全部内容
                //3——(交互)解析内容
                //4——(完成)内容解析完成,可以返回数据
    
                //(2)状态码,成功为200
                if(ajaxObj.readyState == 4 && ajaxObj.status == 200){
                    //第六步:接收返回数据
                    // console.log(JSON.parse(ajaxObj.responseText));
                    console.log(ajaxObj.responseText);
                    //JSON.parse:字符串转json
                    //JSON.stringify:json转字符串
    
                    // var newDiv =  document.createElement("div");
                    // newDiv.innerHTML = ajaxObj.responseText;
                    // document.body.appendChild(newDiv);
                }
            }
    

    后台php代码

    //超级全局变量$_GET是系统提供的一个关联数组
    //用于放 前端通过get请求传递过来的数据
    $userName = $_GET["name"];
    $userAge = $_GET["age"];
    //json_encode:数组转json格式的字符串
    //json_decode:json格式的字符串转数组
    echo json_encode(array(
        "n"=>$userName,
        "a"=>$userAge
    ));
    
    注意:get请求传递数据的方式,在请求的url后拼接?数据&数据
    

    ajax_POST发起请求步骤

    POST请求与GET请求相比多了个请求头,参数的发送方式也不同

            var ajaxObj = new XMLHttpRequest();
            ajaxObj.open("POST","2ajax_post.php",true);
            //设置请求头
            //注意:需要设置在open和send中间
            //application/x-www-form-urlencoded:被编码为名称/值对。这是标准的编码格式
            //multipart/form-data:被编码为一条消息
            //text/plain:以纯文本形式编码
            ajaxObj.setRequestHeader("CONTENT-TYPE","application/x-www-form-urlencoded");
            ajaxObj.send("name=gg&address=地球");
            ajaxObj.onreadystatechange = function () {
                if(ajaxObj.readyState == 4 && ajaxObj.status == 200){
                    console.log(JSON.parse(ajaxObj.responseText));
                }
            }
            //POST传参:在send中进行传递参数
    

    后台php代码

    //超级全局变量  $_POST
    //接收post请求传递的参数
    $userName = $_POST["name"];
    $userAddress = $_POST["address"];
    
    //返回给前端json格式的字符串
    echo json_encode(array(
        "n"=>$userName,
        "a"=>$userAddress
    ));
    

    相关文章

      网友评论

        本文标题:AJAX get() 和 post() 方法

        本文链接:https://www.haomeiwen.com/subject/cjlpzftx.html