• 前端html,后端php,数据库mysql 之间的交互


    前端向后端发送数据:ajax方法

       get/post方法:

    <script>

    document.onclick = function(){
    ajax({
    // type:"get", //发送方式,可选,默认get
    url:"http://localhost/ajax/php/index.php", //要请求的地址,必选
    success:function(res){ //请求成功之后的函数,必选
    console.log(res)
    },
    data:{ //要发送的数据,可选,默认不发
    user:"admin",
    pass:13123121123
    },
    // error:function(res){ //请求失败之后的函数,可选,默认不处理
    // console.log(res)
    // },
    // timeout:10 //请求超时的时间,可选,默认2000
    })
    }

    function ajax(options){
    // 1.处理默认参数
    var {type,url,success,error,data,timeout} = options;
    type = type || "get";
    data = data || {};
    timeout = timeout || 2000;

    // 2.解析要发送的数据
    var str = "";
    for(var i in data){
    str += `${i}=${data[i]}&`;
    }

    
    

    // 3.根据方式,决定是否处理url
    if(type == "get"){
    var d = new Date();
    url = url + "?" + str + "__qft=" + d.getTime();
    }

    
    

    // 4.开启ajax
    var xhr = new XMLHttpRequest();
    // 注意:open中的方式
    xhr.open(type,url,true);
    xhr.onreadystatechange = function(){
    if(xhr.readyState == 4 && xhr.status == 200){
    // 5.执行成功之前,先判断是否传入
    success && success(xhr.responseText);
    // 成功之后,不应有失败
    error = null;
    }else if(xhr.readyState == 4 && xhr.status != 200){
    // 6.执行失败之前,先判断是否传入
    error && error(xhr.status);
    // 失败之后,不应有成功
    success = null;
    // 且失败不应多次执行
    error = null;
    }
    }

    
    

    // 7.如果请求超时,执行失败
    setTimeout(() => {
    error && error("timeout");
    // 失败之后,不应有成功
    success = null;
    }, timeout);

    
    

    // 8.最后根据type的方式,决定send的发送内容和格式
    if(type == "post"){
    xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
    xhr.send(str)
    }else{
    xhr.send()
    }
    }

    后台接受数据并返回到前端:php方法

    <?php
    
        $u = @$_REQUEST["user"];
        $p = @$_REQUEST["pass"];
    
        echo "这是前端的ajax发送的数据,现在再还给前端:".$u."-------".$p;
    
    ?>

    在PHP中使用MySQL:

      注意运行的环境,可以在本地服务器上运行

    <?php
        // 1.登录mysql,选择数据库
        $link = @new mysqli("localhost:3306","root","root","test");
        if($link->connect_error){
            echo $link->connect_error;
        }
    
        // 2.$link->query()向mysql发送命令
        //// $q = "INSERT stu (name,sex,age) VALUES('admin','1',16)";
        // $res = $link->query($q);
        // if($res){
        //     echo "insert ok";
        // }else{
        //     echo "insert no ok";
        // }
    
        //// $q = "DELETE FROM stu WHERE id=6";
        // $res = $link->query($q);
        // if($res){
        //     echo "delete ok";
        // }else{
        //     echo "delete no ok";
        // }
    
        //// $q = "UPDATE stu SET name='root' WHERE id=6";
        // $res = $link->query($q);
        // if($res){
        //     echo "update ok";
        // }else{
        //     echo "update no ok";
        // }
    
        //
        $q = "SELECT * FROM stu";
        $res = $link->query($q);
        if($res){
            echo "select ok";
        }else{
            echo "select no ok";
        }
    ?>
  • 相关阅读:
    Linux查看文件被哪个进程占用
    命令行启动rstudio server
    Spring Boot配置文件及多环境配置
    Spring Boot yml配置文件
    js实现自定义概率抽奖算法
    Flutter之adb: failed to install apk的解决方法
    Flutter之不简单的搜索条
    git操作之commit规范
    Flutter之毛玻璃效果的实现
    固定定位下div水平居中
  • 原文地址:https://www.cnblogs.com/hupeng1996/p/11510495.html
Copyright © 2020-2023  润新知