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

<!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":"参数错误"}';

}

?>

相关推荐
仟濹17 分钟前
算法打卡day2 (2026-02-07 周五) | 算法: DFS | 3_卡码网99_计数孤岛_DFS
算法·深度优先
2501_9436953320 分钟前
大专市场调查与统计分析专业,怎么辨别企业招聘的“画饼”岗位?
大数据
驭渊的小故事20 分钟前
简单模板笔记
数据结构·笔记·算法
七夜zippoe24 分钟前
CANN Runtime跨进程通信 共享设备上下文的IPC实现
大数据·cann
威胁猎人31 分钟前
【黑产大数据】2025年全球电商业务欺诈风险研究报告
大数据
YuTaoShao35 分钟前
【LeetCode 每日一题】1653. 使字符串平衡的最少删除次数——(解法一)前后缀分解
算法·leetcode·职场和发展
VT.馒头41 分钟前
【力扣】2727. 判断对象是否为空
javascript·数据结构·算法·leetcode·职场和发展
goodluckyaa1 小时前
LCR 006. 两数之和 II - 输入有序数组
算法
L543414461 小时前
告别代码堆砌匠厂架构让你的系统吞吐量翻倍提升
大数据·人工智能·架构·自动化·rpa
孤狼warrior1 小时前
YOLO目标检测 一千字解析yolo最初的摸样 模型下载,数据集构建及模型训练代码
人工智能·python·深度学习·算法·yolo·目标检测·目标跟踪