三层C/S结构登陆注册使用数据库

一、数据库设计

1. 用户表

- id: 用户ID
- username: 用户名
- password: 密码
- email: 邮箱
- create_time: 注册时间

2. 登录日志表

- id: 日志ID
- user_id: 用户ID
- login_time: 登录时间
- login_ip: 登录IP地址

二、后端代码实现

1. 注册

用户注册时，需要将用户输入的信息插入到用户表中，并返回注册成功的消息。

import pymysql

def register(username, password, email):
    # 连接数据库
    conn = pymysql.connect(host='localhost', user='root', password='123456', database='test', charset='utf8')
    # 获取游标
    cursor = conn.cursor()
    # 插入数据
    sql = "INSERT INTO user(username, password, email, create_time) VALUES (%s, %s, %s, NOW())"
    cursor.execute(sql, (username, password, email))
    # 提交事务
    conn.commit()
    # 关闭游标和连接
    cursor.close()
    conn.close()
    # 返回注册成功的消息
    return {'code': 0, 'msg': '注册成功'}

2. 登录

用户登录时，需要查询用户表中是否存在该用户，并记录登录日志。

import pymysql

def login(username, password, ip):
    # 连接数据库
    conn = pymysql.connect(host='localhost', user='root', password='123456', database='test', charset='utf8')
    # 获取游标
    cursor = conn.cursor()
    # 查询用户是否存在
    sql = "SELECT id, username, password FROM user WHERE username=%s AND password=%s"
    cursor.execute(sql, (username, password))
    user = cursor.fetchone()
    # 如果用户存在，则记录登录日志
    if user:
        user_id = user[0]
        # 插入数据
        sql = "INSERT INTO login_log(user_id, login_time, login_ip) VALUES (%s, NOW(), %s)"
        cursor.execute(sql, (user_id, ip))
        # 提交事务
        conn.commit()
        # 返回登录成功的消息
        return {'code': 0, 'msg': '登录成功'}
    else:
        # 返回登录失败的消息
        return {'code': 1, 'msg': '用户名或密码错误'}

三、前端代码实现

1. 注册

用户注册时，需要将用户输入的信息传递给后端，接收后端返回的消息，并给出相应的提示。

<form onsubmit="register(); return false;">
  <input type="text" name="username" required placeholder="请输入用户名"><br>
  <input type="password" name="password" required placeholder="请输入密码"><br>
  <input type="email" name="email" required placeholder="请输入邮箱"><br>
  <button type="submit">注册</button>
</form>

<script>
  function register() {
    var form = document.forms[0];
    var data = new FormData(form);
    var xhr = new XMLHttpRequest();
    xhr.open('POST', '/register');
    xhr.onload = function() {
      var result = JSON.parse(xhr.responseText);
      alert(result.msg);
      if (result.code === 0) {
        form.reset();
      }
    };
    xhr.send(data);
  }
</script>

2. 登录

用户登录时，需要将用户输入的信息传递给后端，接收后端返回的消息，并给出相应的提示。

<form onsubmit="login(); return false;">
  <input type="text" name="username" required placeholder="请输入用户名"><br>
  <input type="password" name="password" required placeholder="请输入密码"><br>
  <button type="submit">登录</button>
</form>

<script>
  function login() {
    var form = document.forms[0];
    var data = new FormData(form);
    var xhr = new XMLHttpRequest();
    xhr.open('POST', '/login');
    xhr.onload = function() {
      var result = JSON.parse(xhr.responseText);
      alert(result.msg);
      if (result.code === 0) {
        form.reset();
      }
    };
    xhr.send(data);
  }
</script>