本文主要是介绍音乐播放器javaweb项目近日总结，用js，css，HTML，servlet，mybatis来写注册登录忘记密码（还没写好），希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！
这几天学了js，css，HTML，servlet，mybatis，还有axios，目前axios还没有用到，学的比较慢因为那个servlet，axios我看不懂，可能看懂了然后不会用，之后给我们上了一节课，感觉每一个东西单独拆开好像学过，但是放在一起听的很懵，今天我就到处翻博客反复看了点代码，终于知道了一点前后端交互就赶紧写了点。
因为是小白所以写的有些感觉没必要写的比较详细方便自己记忆
1.前端界面代码
html文件：（css，和js就省略了）
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>注册页面</title><link rel="stylesheet" href="RjLnFt.css">
</head>
<body>
<div class="container"><h1>注册</h1><form action="/register" method="POST"><div class="form-group"><label for="username">用户名</label><input type="text" id="username" name="username" placeholder="请输入用户名" required></div><div class="form-group"><label for="email">邮箱</label><input type="email" id="email" name="email" placeholder="请输入邮箱" required><ul><li id="EE">邮箱无效！</li></ul></div><div class="form-group"><label for="password">密码</label><input type="password" id="password" name="password" placeholder="请输入密码" required><ul><li id="length-tip">密码必须至少8位。</li><li id="letter-tip">密码必须包含字母。</li><li id="number-tip">密码必须包含数字。</li></ul></div><div class="form-group"><label for="verification-code">验证码</label><div class="input-group"><input type="text" id="verification-code" name="verification-code" placeholder="请输入验证码" required><button type="button">获取验证码</button></div></div><div class="form-group1"><button type="submit" class="submit-button">注册</button></div></form><p class="login-link">已有账号？<a href="SongLogin.html">登录</a></p>
</div>
<script src="fun.js"></script>
</body>
</html>
代码解释：
- 使用了
<form>标签，将所有表单元素包裹起来。 - 设置了
action="/register"，指定了表单提交的目标 URL。 - 设置了
method="POST"，指定了提交的 HTTP 方法。 - 为每个输入字段添加
name属性，以便在服务器端能够识别表单数据。
action属性指定了表单数据提交到 /register URL，method属性指定了使用POST方法提交数据。
URL是指在web应用程序中定义的请求路径。
eg：（反射和注解通俗来讲就是 反射来找注解再找类）
我在web.xml中配置了一个Servlet映射，将/register路径映射到RegisterServlet,其中的/register就是URL，看代码：
<!-- 配置Servlet--><servlet><servlet-name>RegisterServlet</servlet-name><servlet-class>com.example.servlet.RegisterServlet</servlet-class></servlet><servlet-mapping><servlet-name> RegisterServlet</servlet-name><url-pattern> /register</url-pattern></servlet-mapping>
2.后端代码
RegisterServlet需要处理 POST 请求，从请求中提取表单数据，并与数据库进行交互。
当用户通过 POST 方法向 /register 发送请求时 RegisterServlet 的 doPost 方法将会被调用。
@WebServlet("/register") // 定义Servlet的URL映射
public class RegisterServlet extends HttpServlet {//这个是序列化机制的一部分，一般都写在这，不用很管他private static final long serialVersionUID = 1L;// 处理POST请求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");从表单获取数据后，再加入数据库
3.加入数据库部分
我用的是mybatis
1.先配置环境：
<!--mybatis 依赖--><dependency><groupId>org.mybatis</groupId><artifactId>mybatis</artifactId><version>3.5.16</version></dependency><!--mysql 驱动--><dependency><groupId>mysql</groupId><artifactId>mysql-connector-java</artifactId><version>5.1.46</version></dependency>
2.封装一个user类用来到时候用
直接将数据封装到user里面传过去，后续调用mapper
我下面的代码不全，而且也不是我写song项目的user只是学习mybatis测试用的
public class User {
//alt+鼠标左键可以列编辑private Integer id;private String username;private String password;private String gender;private String addr;public User() {}public Integer getId() {return id;}
3.写mapper部分
这是一个接口，可以把操作数据库所有的方法都写在这里面，后面方便调用
public interface UserMapper {//查询所有List<User> selectAll();//根据id查询User selectById(int id);//条件查询//1散装参数：如果方法中有多个参数，需要使用@Param("SQL参数占位符名称")//2.对象参数：对象的属性名称要和参数占位符名称一致//3.map集合参数List<User> selectByCondition(@Param("username") String username,@Param("gender") String gender);List<User> selectByCondition(User user);List<User> selectByCondition(Map map);/*** 单条件动态查询* @param user* @return*/List<User> selectByConditionSingle(User user);/*** 添加*/void add(User user);/*** 修改*/int update(User user);/*** 根据id删除*/void deleteByid(int id);}
这是对应xml文件的sql语句：
<!-- 添加--><insert id="add" useGeneratedKeys="true" keyProperty="id">insert into tb_user (username,password,gender,addr)values (#{username},#{password},#{gender},#{addr});</insert>
4.将数据加入数据库
然后表单加入的数据就可以调用这个法加入了
//1.获取SqlSessionFactory//1.加载mybatis的核心配置文件，获取SqlSessionFaxtoryString resource = "mybatis-config.xml";InputStream inputStream = Resources.getResourceAsStream(resource);SqlSessionFactory sqlSessionFactory = new SqlSessionFactoryBuilder().build(inputStream);//2.获取SqlSession 对象，用它来执行sqlSqlSession sqlSession = sqlSessionFactory.openSession();//在这里面其实是可以写true或者false的没写为f表示要手动提交//3.1获取UserMapper接口的代理对象UserMapper userMapper = sqlSession.getMapper((UserMapper.class));userMapper.add(user2);//提交事务sqlSession.commit();//5.释放资源sqlSession.close();这篇关于音乐播放器javaweb项目近日总结，用js，css，HTML，servlet，mybatis来写注册登录忘记密码（还没写好）的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！
