php,mysql登录(session，无加密版，js)

朱雀 2022-06-02 21:16 157阅读 0赞

<!DOCTYPE html>
    <html lang="en">
    <head>
    	<meta charset="UTF-8">
    	<title>Document</title>
    	<style>
    		#wel{
    			display: none;
    		}
    	</style>
    </head>
    <body>
    	<div id="login">
    		<input type="text" id="uname" placeholder="用户名"><br/>
    		<input type="text" id="upwd" placeholder="密码"><br/>
    		<input type="button" id="btn_login" value="登录"><br/>
    		<span id="login_tip"></span>
    	</div>
    	<div id="wel">
    		<span>欢迎：</span>
    		<span id="welUname"></span>
    		<a id="logout">退出</a>
    	</div>
    
    	<script src="js/ajax.js"></script>
    	<script src="js/login.js"></script>
    </body>
    </html>

ajax.js:

//封装适合各种情况的简化版ajax函数
    function ajax({//利用解构，获取将来参数对象中每个属性值
      type,//请求类型: "get"||"post"
      url,//请求的url地址: "xxx.php"
      data,//请求携带的参数: "变量1=值&..."
      dataType,//服务器端返回值类型: "json"||"text"
    }){
      //服务器端返回值类型默认为text
      dataType=dataType||"text";
      //只要远程请求，必有延迟，只要延迟，比用promise等待完成后，才执行后续操作
      return new Promise(function(resolve){//.then()
        //AJAX 4步/5步:
        var xhr=new XMLHttpRequest();//1.获得xhr对象
        //如果是get请求，且传入了data参数，才需要拼接url和data为get请求的完整地址
        if(type.toLowerCase()=="get"&&data!==undefined)
          url+="?"+data;
        xhr.open(type,url,true);//2. 建立连接
        //3. 设置请求状态回调函数
        xhr.onreadystatechange=function(){
          //如果请求完成，且成功!
          if(xhr.readyState==4&&xhr.status==200){
            //如果服务器端响应类型不是json，则调用后续resolve操作，并传入原始responseText，做后续处理
            if(dataType.toLowerCase()!="json")
              resolve(xhr.responseText);
            else//如果服务器端响应类型是json，则自动调用JSON.parse转为js对象，再交给resolve函数做后续处理
              resolve(JSON.parse(xhr.responseText));
          }
        }
        //只有type为post，才需要设置请求头
        if(type.toLowerCase()=="post")
          xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
        //只有type为post，才需要send时，传入参数
        xhr.send(type.toLowerCase()=="post"?data:null);
      })
    }

init.php:

<?php 
    
    	$conn= mysqli_connect("127.0.0.1","root","","login",3306);
    	$sql="SET NAMES UTF8";
    	mysqli_query($conn,$sql);
    ?>

isLogin.php

<?php
    header("Content-Type:application/json");
    require_once("init.php");
    session_start();
    @$uid=$_SESSION["uid"];
    if($uid){
      $sql="select uname from login_users where uid=$uid";
      $uname=
        mysqli_fetch_row(mysqli_query($conn,$sql))[0];
      echo json_encode(["ok"=>1,"uname"=>$uname]);
    }else
      echo json_encode(["ok"=>0]);

<?php
    header("Content-Type:application/json");
    require_once("init.php");
    @$uname=$_REQUEST["uname"];
    @$upwd=$_REQUEST["upwd"];
    if($uname&&$upwd){
      $sql="select uid from login_users where uname='$uname' and binary upwd='$upwd'";
      $row=mysqli_fetch_row(mysqli_query($conn,$sql));
      if($row){
        session_start();
        $_SESSION["uid"]=$row[0];
        echo json_encode(["ok"=>1]);
      }else
        echo json_encode(["ok"=>0,"msg"=>"用户名或密码错误"]);
    }

logout.php:

<?php
    	session_start();
    	session_unset();
    	session_destroy();
    ?>