PHP文件数据传输用jQuery-ajax进行浏览器->服务器->数据文件->服务器->浏览器的数据传输($_POST,$_GET,json_encode(数组数据回应),json数据解析)

淩亂°似流年 2022-09-23 13:52 130阅读 0赞

1.ajax.html浏览器页面

<!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>请求</title>
        <script src="../jquery-3.0.0.min.js"></script>
    </head>
    <body>
    <button οnclick="getInfo()">点击get请求</button>
    <button οnclick="postInfo()">点击post请求</button>
    </body>
    <script type="text/javascript">
        function getInfo() {
            $.ajax({
                url: "print_get_post.php?name=GETwangyang请求",
    //get请求两个部分(?属性名=值；data{})都会作为明请求
                type: "get",
                data: {},
                success: function (data) {
                    var r = eval("(" + data + ")");
                    alert(r.name);
                }
            });
        }
        function postInfo() {
            $.ajax({
     //?name=YANG_POST请求如果请求数据写在这个里边,里边的部分就会变成get请求；
    //下边的data里边的数据依然是post请求。
                url: "print_get_post.php",//服务器路径
                type: "post",//数据包的暗请求
                data: {
                    "code": "123POST请求",
                    "id": 100,
                    "user": "wangyang汪洋"
                },
                success: function (data) {
                    alert(data);
                    //解析数据
                    var result = eval("(" + data + ")");
                    //eval()转化回应值的unicode编码为此文中的编码，并以数组存储数据。
                      alert(result);//弹出来[object Object]
                   //alert(result.code);//弹出code值123POST请求                         //Object {code: "123POST请求", id: "100", user: "wangyang汪洋"}                console.log(result);
                    console.log(result.code);//弹出code值123POST请求//单个数组
    
                 //   console.log(result.imageUrl);
    //                console.log(result.detail);
    //                console.log(result.priceN);
    //                console.log(result.priceO);
    //                console.log(result.number);   
    
                 
    //服务器端接收的数据底层为数组套数组
    //                console.log(result[0].imageUrl);                
                      var x;//x为数组内的下标为x的数组。                
                      for (x in result) {                    
                         console.log(result[x].imageUrl);                    
                         console.log(result[x].detail);                    
                         console.log(result[x].priceN);                    
                         console.log(result[x].priceO);                    
                         console.log(result[x].number);
                      }
                }
        });    
     }
    </script>
    </html>

2.服务器php文件print\_get\_post.php

<?php
    
    header("Content-type:text/html;charset=utf-8");
    
    //echo "get请求：";
    //$_GET以关联数组形式存储传递过来的数据.
    //print_r($_GET);
    
    //当使用php自带的json_encode对数据进行编码时，中文都会变成unicode，导致不可读。
    //如：对字符串”厦门“进行json_encode后，输出的是"\u53a6\u95e8"。
    //就需要在接收数据的ajax中前边用eval()方法。
    //echo json_encode($_GET);
    
    //echo "post请求：";
    //$_POST以关联数组形式存储传递过来的数据.
    //Array([code] => 123POST请求 [id] => 100 [user] => wangyang汪洋)
    //print_r($_POST);
    
    //当使用php自带的json_encode对数据进行编码时，中文都会变成unicode，导致不可读。
    //传递出来的格式：{"code":"123POST\u8bf7\u6c42","id":"100",
    //"user":"wangyang\u6c6a\u6d0b"}
    //如：对字符串”厦门“进行json_encode后，输出的是"\u53a6\u95e8"。
    //就需要在接收数据的ajax中前边用eval()方法按照最原始传递的数据格式接收。
    //echo json_encode($_POST);
    
    //一维数据数组的值回应：
    //客户端-》服务器端-》客户端的请求的过程。
    //if ($_POST["id"] == 100 && $_POST["user"] == "wangyang汪洋") {
    //    $myArr = array("code" => "成功", "mes" => "success");
    //    echo json_encode($myArr);
    //} else {
    //    echo json_encode(array("code" => "失败"));
    //}
    
    
    //数据文件中数据的数组写入数组的情况：
    include "data.php";
    if ($_POST["id"] == 100 && $_POST["user"] == "wangyang汪洋") {
    //    echo json_encode($hotScale_01);//单个数组的
        echo json_encode($hot);//数组套数组
    } else {
        echo json_encode(array("code" => "失败"));
    }

3.数据文件data.php

<?php
    
    $hotScale_01 = array("imageUrl" => "../jquery_百姓商城_首页images/bx_本周热销01.png",
     "detail" => "【优选松木】卧室四件套", "priceN" => "1638", "priceO" => "5240", 
    "number" => "199");
    $hotScale_02 = array("imageUrl" => "../jquery_百姓商城_首页images/bx_本周热销02.png",
     "detail" => "【优选松木】卧室四件套", "priceN" => "1638", "priceO" => "5240", 
    "number" => "199");
    $hotScale_03 = array("imageUrl" => "../jquery_百姓商城_首页images/bx_本周热销03.png",
     "detail" => "【优选松木】卧室四件套", "priceN" => "1638", "priceO" => "5240", 
    "number" => "199");
    $hotScale_04 = array("imageUrl" => "../jquery_百姓商城_首页images/bx_本周热销04.png",
     "detail" => "【优选松木】卧室四件套", "priceN" => "1638", "priceO" => "5240", 
    "number" => "199");
    $hotScale_05 = array("imageUrl" => "../jquery_百姓商城_首页images/bx_本周热销05.png",
     "detail" => "【优选松木】卧室四件套", "priceN" => "1638", "priceO" => "5240", 
    "number" => "199");
    $hotScale_06 = array("imageUrl" => "../jquery_百姓商城_首页images/bx_本周热销06.png",
     "detail" => "【优选松木】卧室四件套", "priceN" => "1638", "priceO" => "5240", 
    "number" => "199");
    $hotScale_07 = array("imageUrl" => "../jquery_百姓商城_首页images/bx_本周热销07.png",
     "detail" => "【优选松木】卧室四件套", "priceN" => "1638", "priceO" => "5240", 
    "number" => "199");
    $hotScale_08 = array("imageUrl" => "../jquery_百姓商城_首页images/bx_本周热销08.png",
     "detail" => "【优选松木】卧室四件套", "priceN" => "1638", "priceO" => "5240", 
    "number" => "199");
    
    $hot = array($hotScale_01, $hotScale_02, $hotScale_03, $hotScale_04, 
    $hotScale_05, $hotScale_06, $hotScale_07, $hotScale_08);