首页分享电商网站搭建（一）

电商网站搭建（一）

来源：花匠小妙招时间：2024-12-03 17:57

电商网站搭建（一）

此次综合实验是完成能实现基本流程的电商网站的搭建，本次实验将功能实现和页面美化分开，以便更清晰的记录下实验过程。

实验环境：
tomcat-9.0.26
jdk-13
MySQL 8.0.24
MySQL Workbench 8.0 CE
mysql-connector-java-8.0.18.jar

1 注册页面设计

1.1 初始设计

首先完成注册页面的功能实现，这里先搭起 register.jsp 的框架。

<h1>这里是注册页面.</h1> <form action="">用户名：<input type="text" name="username" /><br />密码：<input type="passward" name="passward" /><br /><input type="hidden" name="flag" value="ok" /><input type="submit" value="注册"/> </form> 123456789101112

其中有一句 <input type="hidden" name="flag" value="ok" /> 代码，是为了从其他页面跳转到注册页面时不直接执行以下 Java 程序片中的程序。

String usr = request.getParameter("username"); String pwd = request.getParameter("passward"); String flg = request.getParameter("flag"); if(usr==null || usr.length()==0){usr = ""; } if(pwd==null || pwd.length()==0){pwd = ""; } if(flg==null || flg.length()==0){flg = ""; } out.println("<p>如果你不提交表单，你就只能看见我这一句</p>"); if(flg.equals("ok")){out.println("<p>你提交表单之后就能看到我了！</p>"); }

123456789101112131415161718192021

以上代码完成的基本功能是，只有当表单提交时才触发一些功能的实现。

如下图为 url 地址为 http://localhost:8080/shopping/register.jsp 的显示页面。

在这里插入图片描述

此时如果我填入用户名密码并提交就会出现下图情况，且 url 地址变为 http://localhost:8080/shopping/register.jsp?username=liuqichuan&passward=123456&flag=ok。

在这里插入图片描述

1.2 连接数据库

由于注册页面要实现将新用户的用户名密码信息存入数据库的表中，因此要在数据库中建立表 user_info 存入用户信息。

首先连接数据库，打开命令行输入 mysql -u root -p 。

接着打开 MySQL Workbench 利用图形界面创建数据库 shopping 。

在该数据库中建立用户信息表 userInfo ，同时插入管理员用户名和密码（管理员无需注册，系统内置），代码如下：

create database shopping; use shopping; create table userInfo( usrid int PRIMARY KEY AUTO_INCREMENT, usrname varchar(100) character SET GB2312 NOT NULL UNIQUE, usrpwd varchar(20) NOT NULL ); insert into userInfo(usrname,usrpwd) values('admin','lqcadmin'); select * from userInfo; 1234567891011

接下来新建页面 trydb.jsp尝试连接数据库，以下为连接数据库的 Java 程序片代码。

Connection con = null; Statement sql; ResultSet rs; String url = "jdbc:mysql://localhost:3306/shopping?"+ "useSSL=false&serverTimezone=CST&characterEncoding=utf-8"; String user ="root"; String password = "123456"; //加载JDBC-MySQL8.0连接器 try{ Class.forName("com.mysql.cj.jdbc.Driver"); } catch(Exception e){ out.print("<h1>"+e); } // 查询结果 try{ con = DriverManager.getConnection(url, user, password); sql = con.createStatement(); String SQL = "SELECT * FROM userInfo";// 查询语句 rs = sql.executeQuery(SQL); while(rs.next()) { out.print("<p>" + "序号：" + rs.getString(1) + "</p>"); out.print("<p>" + "用户名：" + rs.getString(2) + "</p>"); out.print("<p>" + "密码：" + rs.getString(3) + "</p>"); } con.close(); } catch(SQLException e) { out.print("<h1>"+e); }

123456789101112131415161718192021222324252627282930313233343536

其中要注意，在 jsp 页面最前面要先引入 Mysql 驱动：<%@ page import="java.sql.*" %> 。

显示结果如下：

在这里插入图片描述

现在将成功连接数据库的代码写进注册页面，连接数据库的条件为“当表单提交时”，也就是一开始在表单中设置 flag 隐藏域的原因，将以上 Java 代码加入以下 if 语句中：

if(flg.equals("ok")){ // 以上代码 } 123

再将查询语句直接改成插入语句即可。

String insertSQL = "insert into userInfo(usrname,usrpwd)" + "values('" + usr + "','" + pwd + "');"; int ok = sql.executeUpdate(insertSQL); 12

尝试注册一个用户名为用户001 ，密码为 1234 的用户（表单输入信息后提交）。

注册成功后查看表中数据如下：

mysql> select * from userInfo; +-------+-----------+----------+ | usrid | usrname | usrpwd | +-------+-----------+----------+ | 1 | admin | lqcadmin | | 3 | 用户001 | 1234 | +-------+-----------+----------+ 2 rows in set (0.00 sec) 12345678 这里 usrid 为 3 是因为之前注册过一个用户已经被我删除了，因为该列使用自增，删除之后不能实现序号重排。