JS+MySQL实现邮箱找回密码功能
js加mysql写邮箱找回密码

首页 2025-06-13 07:23:48



使用JavaScript与MySQL实现邮箱找回密码功能 在构建现代Web应用时,用户账户的安全性是至关重要的

    邮箱找回密码功能是一种常见的用户账户安全措施,它允许用户在忘记密码时通过邮箱接收重置密码链接来恢复账户访问权限

    本文将详细介绍如何使用JavaScript(前端)和MySQL(后端数据库)来实现这一功能

     一、功能概述 邮箱找回密码功能通常包括以下几个步骤: 1.用户请求重置密码:用户在登录页面点击“忘记密码”链接,输入注册时使用的邮箱地址,并提交请求

     2.发送重置密码链接:系统接收到请求后,生成一个唯一的重置密码令牌,并将其存储在数据库中,同时生成一个重置密码链接并通过邮箱发送给用户

     3.用户点击重置密码链接:用户打开邮箱中的链接,跳转到重置密码页面

     4.用户重置密码:用户在重置密码页面输入新密码并提交,系统验证令牌有效性后更新用户密码

     二、准备工作 在开始编码之前,确保你的开发环境已经安装了以下工具: - Node.js:用于运行JavaScript服务器

     - MySQL:用于存储用户数据和重置密码令牌

     - 一个邮件发送服务(如Nodemailer配合SMTP服务器,或使用第三方邮件发送API)

     三、数据库设计 首先,创建一个MySQL数据库,并设计一个用户表来存储用户信息

    假设表名为`users`,结构如下: sql CREATE TABLE users( id INT AUTO_INCREMENT PRIMARY KEY, email VARCHAR(255) NOT NULL UNIQUE, password VARCHAR(255) NOT NULL,-- 存储哈希后的密码 reset_token VARCHAR(255),-- 重置密码令牌 token_expires TIMESTAMP --令牌过期时间 ); 四、后端实现(Node.js + Express) 1.初始化Node.js项目: bash mkdir password-reset cd password-reset npm init -y npm install express mysql2 bcryptjs jsonwebtoken nodemailer body-parser 2.创建服务器文件server.js: javascript const express = require(express); const mysql = require(mysql2); const bcrypt = require(bcryptjs); const jwt = require(jsonwebtoken); const nodemailer = require(nodemailer); const bodyParser = require(body-parser); const app = express(); const port =3000; app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: true})); // MySQL连接配置 const db = mysql.createConnection({ host: localhost, user: root, password: yourpassword, database: yourdatabase }); db.connect(err =>{ if(err) throw err; console.log(MySQL connected...); }); //邮件发送配置 const transporter = nodemailer.createTransport({ service: gmail, // 或其他邮件服务 auth:{ user: youremail@gmail.com, pass: yourpassword } }); // 生成重置密码令牌 const generateToken =(user_id) =>{ return jwt.sign({ user_id}, yoursecretkey,{ expiresIn: 1h}); }; //路由:请求重置密码 app.post(/api/forgot-password,(req, res) =>{ const{ email} = req.body; db.query(SELECT - FROM users WHERE email = ?,【email】,(err, results) =>{ if(err) throw err; if(results.length ===0){ return res.status(400).json({ message: Email not found!}); } const user = results【0】; const token = generateToken(user.id); // 更新数据库中的令牌和过期时间 db.query(UPDATE users SET reset_token = ?, token_expires = ? WHERE id = ?,【token, Date.now() +3600000, user.id】,(err, result) =>{ if(err) throw err; const mailOptions ={ from: youremail@gmail.com, to: email, subject: Password Reset, text:`Please click the link to reset your password: http://localhost:3000/reset-password?token=${token}` }; transporter.sendMail(mailOptions,(error, info) =>{ if(error){ return res.status(500).json({ message: Failed to send email!}); } res.status(200).json({ message: Password reset email sent!}); }); }); }); }); //路由:重置密码 app.post(/api/reset-password,(req, res) =>{ const{ token, newPassword} = req.body; jwt.verify(token, yoursecretkey,(err, decoded) =>{ if(err){ return res.status(400).json({ message: Invalid or expired token!}); } const user_id = decoded.user_id; db.query(SELECT - FROM users WHERE id = ? AND token_expires > ?,【user_id, Date.now()】,(err, results) =>{ if(err) throw err; if(results.length ===0){ return res.status(400).json({ message: Token is invalid or has expired!}); } const user = results【0】; bcrypt.hash(newPassword,10,(err, hashedPassword) =>{ if(err) throw err; db.query(UPDATE users SET password = ?, reset_token = NULL, token_expires = NULL WHERE id = ?,【hashedPassword, user.id】,(err, result) =>{ if(err) throw err; res.status(200).json({ message: Password successfully reset!}); }); }); }); }); }); app.listen(port,() =>{ console.log(`Server is running on port${port}`); }); 五、前端实现 前端使用HTML和JavaScript来处理用户交互

    假设我们有一个简单的登录页面,其中包含一个“忘记密码”链接

     1.登录页面login.html: html

MySQL连接就这么简单!本地远程、编程语言连接方法一网打尽
还在为MySQL日期计算头疼?这份加一天操作指南能解决90%问题
MySQL日志到底在哪里?Linux/Windows/macOS全平台查找方法在此
MySQL数据库管理工具全景评测:从Workbench到DBeaver的技术选型指南
MySQL密码忘了怎么办?这份重置指南能救急,Windows/Linux/Mac都适用
你的MySQL为什么经常卡死?可能是锁表在作怪!快速排查方法在此
MySQL单表卡爆怎么办?从策略到实战,一文掌握「分表」救命技巧
清空MySQL数据表千万别用错!DELETE和TRUNCATE这个区别可能导致重大事故
你的MySQL中文排序一团糟?记住这几点,轻松实现准确拼音排序!
别再混淆Hive和MySQL了!读懂它们的天壤之别,才算摸到大数据的门道