使用 Koa 和 MySQL 实现简单的注册和登录功能

本节课我们来通过koa来完成一个简单的登录,注册功能,后台使用mysql

  1. 初始化项目并安装依赖
  • koa: Koa2框架
  • koa-router: 处理路由的中间件
  • koa-bodyparser: 解析请求体
  • koa-session: 处理用户会话
  • mysql2: MySQL连接
  • bcrypt: 密码哈希
csharp 复制代码
npm -y init
yarn add koa koa-router koa-bodyparser koa-session mysql2 bcrypt
  1. 创建数据库
  • 如果之前没有用docker创建过mysql,进行创建
css 复制代码
docker run --name mysql1 -e MYSQL_ROOT_PASSWORD=123456 -p 3306:3306 -d mysql:5.7.27
  • 我们使用docker启动Mysql,之前有提到过,我们直接启动
sql 复制代码
docker start mysql1
docker exec -it mysql1 bash
mysql -uroot -p123456
  • 运行脚本,来建库建表
sql 复制代码
CREATE DATABASE IF NOT EXISTS MyEnglishLearningApp;
USE MyEnglishLearningApp;
CREATE TABLE IF NOT EXISTS users (
    id INT AUTO_INCREMENT PRIMARY KEY,
    username VARCHAR(255) NOT NULL,
    password VARCHAR(255) NOT NULL
);
  1. 配置数据库连接
  • db.js
php 复制代码
const mysql = require('mysql2');

const pool = mysql.createPool({
  host: 'your_database_host',
  user: 'your_database_user',
  password: 'your_database_password',
  database: 'your_database_name',
  waitForConnections: true,
  connectionLimit: 10,
  queueLimit: 0
});

module.exports = pool.promise();
  1. 实现注册和登录路由
  • 创建一个文件(例如authRoutes.js)来处理注册和登录路由:
js 复制代码
// authRoutes.js

const Router = require('koa-router');
const bcrypt = require('bcrypt');
const db = require('./db');

const router = new Router();

router.post('/register', async (ctx) => {
  const { username, password } = ctx.request.body;

  // Hash the password before saving it
  const hashedPassword = await bcrypt.hash(password, 10);

  try {
    const [result] = await db.query('INSERT INTO users (username, password) VALUES (?, ?)', [username, hashedPassword]);
    ctx.body = { success: true, userId: result.insertId };
  } catch (error) {
    ctx.status = 500;
    ctx.body = { success: false, error: error.message };
  }
});

router.post('/login', async (ctx) => {
  const { username, password } = ctx.request.body;

  try {
    const [rows] = await db.query('SELECT * FROM users WHERE username = ?', [username]);

    if (rows.length === 0) {
      ctx.body = { success: false, error: 'User not found' };
      return;
    }

    const user = rows[0];

    const passwordMatch = await bcrypt.compare(password, user.password);

    if (passwordMatch) {
      ctx.session.userId = user.id;
      ctx.body = { success: true, userId: user.id };
    } else {
      ctx.body = { success: false, error: 'Invalid password' };
    }
  } catch (error) {
    ctx.status = 500;
    ctx.body = { success: false, error: error.message };
  }
});

module.exports = router.routes();
  1. 使用路由
  • 在主应用程序中使用上述路由:
js 复制代码
// app.js

const Koa = require('koa');
const bodyParser = require('koa-bodyparser');
const session = require('koa-session');
const authRoutes = require('./authRoutes');

const app = new Koa();

app.keys = ['your_secret_key']; // Change this to a secure random key

// Session configuration
app.use(session(app));

// Body parser middleware
app.use(bodyParser());

// Use auth routes
app.use(authRoutes);

const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
  console.log(`Server is running on port ${PORT}`);
});
  1. 启动应用
  • node-dev app.js,这样会在修改代码后自动重启
  • 添加.gitignore,提交代码
bash 复制代码
# Node.js
node_modules/

# Logs
logs
*.log
npm-debug.log*

# Environment
.env

# Output
dist/
build/

# OS-generated files
.DS_Store
Thumbs.db

.idea
  1. 使用postman来模拟注册和登录,以及登录mysql验证
  • 注册
  • 登录
  1. 后续需要完善的
  • 统一封装返回状态码
  • 登录成功后增加记录登录状态的方式
相关推荐
漏刻有时19 分钟前
数据可视化Three.js 3D 地图实战:单文件原生实现省域区县拉伸建模
前端
会说话的番茄25 分钟前
AI 满嘴跑火车怎么办?给它配个"小抄"
前端·aigc
计算机魔术师26 分钟前
AI 权力集中辩论实录:从「token 工厂」到「唯一幸存者」
前端
eric-sjq32 分钟前
WanlyFrontend 中文声明式前端语言完全指南:让 0.6B 模型写出漂亮网页
前端
Full Stack Developme35 分钟前
跨站请求伪造 (CSRF) 是什么 设计及工作原理
前端·okhttp·csrf
MoSTChillax43 分钟前
UI规范设计:从视觉到交互的全面指南
前端·ui·产品经理·设计规范·vibecoding
雪碧聊技术1 小时前
Vue + Element Plus 实现文本溢出显示省略号及悬浮提示
前端·javascript·css·vue.js·文本溢出省略
eric-sjq1 小时前
0.6B 前端生成模型本地部署实战:消费级显卡跑通 WanlyFrontend 全流程
前端·本地部署
小妖6662 小时前
设置了 box-sizing: border-box; 不管用,下边框还是被挤压没了
前端·css·html
雪隐3 小时前
个人电脑玩AI-16让5060 Ti给你打工——5060Ti 16G 跑 MiniMax-Music-3:从下载到 60s 出歌的全流程
前端·人工智能·后端