当前位置: 首页 > news >正文

代码:前端与数据库交互的登陆界面

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>登录</title>

</head>

<body>

    

<p>账号:<input type="text" id="user"></p>

<p>密码:<input type="text" id="pass"></p>

<button id="login">登录</button>

<button id="add">注册</button>

 

<script src="ajax.js"></script>

<!-- 

    接口文档

method: get

url: './data/user.php'

参数:

    type = login  登录

           add    注册 

    user = 用户名

    pass = 用户密码

返回:

    {err:0,msg:'登录成功'} 

-->

<script>

var login = document.querySelector('#login');

var add = document.querySelector('#add');

var user = document.querySelector('#user');

var pass = document.querySelector('#pass');

 

login.onclick = function (){

    ajax({

        type: 'get',

        url: './data/user.php',

        data: {

            type: 'login',

            user: user.value,

            pass: pass.value

        },

        success: function (data){

            var json = JSON.parse(data);

            if (json.err == 0){

                alert(json.msg);

            }

        }

    });

}

 

add.onclick = function (){

    ajax({

        type: 'get',

        url: './data/user.php',

        data: {

            type: 'add',

            user: user.value,

            pass: pass.value

        },

        success: function (data){

            var json = JSON.parse(data);

            if (json.err == 0){

                alert(json.msg);

            }

        }

    });

}

</script>

 

<?php

/* 

接口文档

method: get

url: './data/user.php'

参数:

    type = login  登录

           add    注册 

    user = 用户名

    pass = 用户密码

返回:

    {err:0,msg:'登录成功'}

*/

 

header('Content-Type:text/html;charset=utf-8');

 

$type = $_GET['type'];

$user = $_GET['user'];

$pass = $_GET['pass'];

 

if ($type && $user && $pass) {

    //连接数据库 

    $link = mysqli_connect('localhost','root','xiaoming','userlist');

    if(!$link){

        die('连接失败:'.mysqli_connect_error());

    }

    //设置编码

    mysqli_set_charset($link,'utf8');

 

    //判断要登录还是要注册 

    // 执行sql语句

    if ($type === 'login'){

        $login_sql = "select * from user where username='$user' and password='$pass'";

        $login_res = mysqli_query($link,$login_sql);

        $login_arr = mysqli_fetch_all($login_res);

        if (count($login_arr) > 0){

            echo '{"err":0,"msg":"登录成功"}';

        } else {

            echo '{"err":-3,"msg":"账号或密码错误"}';

        }

    } else if($type === 'add') {

        $select_sql = "select * from user where username='$user'";

        $select_res = mysqli_query($link,$select_sql);

        // print_r($select_res );

        // die();

        $select_arr = mysqli_fetch_all($select_res);

        

        if(count($select_arr) > 0){

            die('{"err":-1,"msg":"用户名已被占用"}');

        } else {

            $insert_sql = "insert into user (username,password) values ('$user','$pass')";

            $insert_res = mysqli_query($link,$insert_sql);

            if ($insert_res){

                echo '{"err":0,"msg":"注册成功"}';

            } else {

                echo '{"err":-2,"msg":"注册失败"}';

            }

        }

    } else {

        die('{"err":-9,"msg":"参数错误"}');

    }

    mysqli_close($link);

} else {

    echo '{"err":-9,"msg":"参数错误"}';

}

?>

 

10bc7091f3af40f59cdbcf905cd703a2.png

 

http://www.lryc.cn/news/404458.html

相关文章:

  • 发电机基础知识:负载组
  • 内网安全:各类密码的抓取
  • 前端面试题汇总2
  • 分布式服务框架zookeeper+消息队列kafka
  • 服务攻防-应用协议cve
  • Springcloud之gateway的使用详解
  • 中望CAD 建筑 v2024 解锁版下载、安装教程 (超强的CAD三维制图)
  • windows edge自带的pdf分割工具(功能)
  • HTML5实现好看的天气预报网站源码
  • 比较(八)利用python绘制指示器
  • 【体外诊断】ARM/X86+FPGA嵌入式计算机在医疗CT机中的应用
  • 力扣 28找到字符串中第一个匹配项的下标 KMP算法
  • JavaScript(10)——匿名函数
  • 图片上传成功却无法显示:静态资源路径配置问题解析
  • 【转盘案例-弹框-修改Bug-完成 Objective-C语言】
  • Perl 基础语法
  • 【嵌入式开发之标准I/O】二进制文件的读写及实验
  • Arduino学习笔记1——IDE安装与起步
  • 一个注解解决重复提交问题
  • 在qt的c++程序嵌入一个qml窗口
  • Vue的依赖注入:组件树中的共享数据与功能
  • softmax 函数的多种实现方式 包括纯C语言、C++版本、Eigen版本等
  • R语言学习笔记11-读取csv-xlsx-txt-json-pdf-lua格式文件
  • Vue的计算属性和方法有什么区别
  • 学生成绩管理系统(C语言)
  • C语言 通讯录管理 完整代码
  • 2024北京国际智能工厂及自动化展览会亮点前瞻
  • 《网络安全等级保护制度详解》
  • 使用Wanderboat AI 来规划到巴黎的旅行计划
  • 基于YOLO8的目标检测系统:开启智能视觉识别之旅