用户注册功能的实现(前后端交互)

js文件

// 引入模块
const express=require('express')
// 创建服务器
const app=express()
// 设置端口
app.listen(3000,()=>{
    console.log('启动成功');
})
// 使用插件  将post传参转对象
app.use(express.urlencoded({
    extended:true
}))
// 创建路由
app.get('/reg',(req,res)=>{
    res.sendFile(__dirname+'/03.html')
})
// 监听按钮提交的请求
app.post('/myreg',(req,res)=>{
    console.log(req.body);
    res.send('注册成功')
})

html文件

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <form action="myreg" method="post">
            <input type="text" placeho

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
首先,我们需要了解MVC三层架构的概念。MVC是指Model、View、Controller三个组件,分别代表数据模型、用户界面和控制器,是一种经典的软件架构模式。MVC将应用程序分为三个部分,使其易于维护和修改。 在MVC架构中,用户界面(View)和数据模型(Model)是分离的,它们之间通过控制器(Controller)进行交互。当用户与应用程序交互时,控制器接收请求并将其转发给相应的模型和视图。 接下来,我们将通过MVC三层架构实现用户注册功能。 1. Model层: 在这个例子中,我们使用MySQL数据库来存储用户注册信息。我们首先需要创建一个User类来表示用户信息: ```java public class User { private String username; private String password; private String email; // 构造方法和getter/setter方法省略 } ``` 然后,我们需要创建一个UserDao类来完成对用户信息的增删改查操作: ```java public class UserDao { // 连接数据库 private Connection conn = DBUtil.getConnection(); // 添加用户 public boolean addUser(User user) { try { String sql = "INSERT INTO user(username, password, email) VALUES (?, ?, ?)"; PreparedStatement ps = conn.prepareStatement(sql); ps.setString(1, user.getUsername()); ps.setString(2, user.getPassword()); ps.setString(3, user.getEmail()); int result = ps.executeUpdate(); if (result > 0) { return true; } } catch (SQLException e) { e.printStackTrace(); } return false; } // 根据用户名查询用户信息 public User getUserByUsername(String username) { User user = null; try { String sql = "SELECT * FROM user WHERE username=?"; PreparedStatement ps = conn.prepareStatement(sql); ps.setString(1, username); ResultSet rs = ps.executeQuery(); if (rs.next()) { user = new User(); user.setUsername(rs.getString("username")); user.setPassword(rs.getString("password")); user.setEmail(rs.getString("email")); } } catch (SQLException e) { e.printStackTrace(); } return user; } } ``` 2. View层: 在这个例子中,我们使用JSP页面来实现用户注册界面。我们创建一个register.jsp页面,包含以下代码: ```jsp <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>用户注册</title> </head> <body> <h1>用户注册</h1> <form action="register.do" method="post"> <p> 用户名:<input type="text" name="username" required> </p> <p> 密码:<input type="password" name="password" required> </p> <p> 邮箱:<input type="email" name="email" required> </p> <p> <input type="submit" value="注册"> </p> </form> </body> </html> ``` 3. Controller层: 在这个例子中,我们使用Servlet来完成控制器的工作。我们创建一个RegisterServlet类,处理用户注册请求。 ```java public class RegisterServlet extends HttpServlet { private static final long serialVersionUID = 1L; private UserDao userDao = new UserDao(); protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String username = request.getParameter("username"); String password = request.getParameter("password"); String email = request.getParameter("email"); User user = new User(); user.setUsername(username); user.setPassword(password); user.setEmail(email); boolean result = userDao.addUser(user); if (result) { // 注册成功,跳转到登录页面 response.sendRedirect("login.jsp"); } else { // 注册失败,返回注册页面并显示错误信息 request.setAttribute("error", "注册失败,请重新注册!"); request.getRequestDispatcher("register.jsp").forward(request, response); } } } ``` 4. 部署和测试: 将以上代码打包成war包,部署到Tomcat服务器上。访问http://localhost:8080/register.jsp,即可进入用户注册界面。在注册界面输入用户名、密码和邮箱,点击注册按钮,即可完成用户注册操作。 以上就是使用MVC三层架构实现用户注册功能的完整代码。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值