需要使用的技术:
JSP动态网页
Servlet获得客户端请求、转发请求、跳转到下一个界面
JavaBean 业务Bean (业务逻辑具体实现类),处理业务逻辑
Dao 访问数据库,操作数据库例表 (增删查改)
MySQL 数据库
实现系统以下界面和功能:
登录
我的资料
详细信息查看
更新我的资料
1、Tomcat配置
下载Tomcat安装文件apache-tomcat-8.0.42.tar.gz
下载链接: https://pan.baidu.com/s/1dFwzgXF 密码: s537
解压文件并命名文件夹为Tomcat,将Tomcat文件夹移动到/usr/local/文件目录下。
打开终端,修改文件权限,输入sudochmod 755 /usr/local/Tomcat
在/usr/local/Tomcat/bin 目录下,执行下面的语句
sh startup.sh
结果显示:Tomact started
表示Tomact服务器以及成功打开。
此时打开浏览器输入locolhost:8080验证tomact是否成功打开
出现该页面,表示tomcat以及成功打开了。
2、安装MySQL数据库
下载MySQL数据库安装文件mysql-5.7.17-macos10.12-x86_64.dmg
下载链接: https://pan.baidu.com/s/1nvK5xYp 密码: 9ewg
在Mac上安装MySQl
安装完成后,打开Mac系统便好设置
系统便好设置中出现了MySQL的图标,表示MySQL安装成功
双击MySQL图标,打开MySQL服务,开启后如下图所示:
3、安装MySQL可视化视图工具navicat
下载navicat安装文件navicat112_mysql_cs.dmg
下载链接: https://pan.baidu.com/s/1jILX1wa 密码: 9nrm安装完成后,打开navicat,连接我们刚才安装的MySQL数据库
连接需要输入我们安装MySQL时设置的相关信息,包括密码。
连接建立后,我们便可以看到navicat界面视图中我们刚才建立的localhost连接。
4、Eclipse配置Tomcat
Eclipse下载链接: https://pan.baidu.com/s/1eSqX1Hg 密码: 73m8
1.8Jar下载链接: https://pan.baidu.com/s/1bpEekRt 密码: utnx
打开eclipse,在eclipse便好设置-server-add界面中选中刚才安装的tomcat版本,点击finish。
编辑Tomcat server 运行环境,在空白栏中输入我们安装Tomcat的路径,点击finish。
成功之后,我们看到了下面的视图
在java EE视图下,Servers栏目中新建一个Tomcat服务器
完成后,Servers栏下就会出现一个Tomcat服务器,如下图所示
右键选择start将服务器打开
控制台显示如下,表示服务器以及成功打开。
5、Eclipse连接数据库
打开数据视图,右击database connections,选择新建连接。
选择MySQL,点击next。
输入我们在MySQL可视化工具navicat中创建的数据库连接的相关信息,点击finish,完成eclipse数据库的连接。
6、测试Eclipse和数据库的连通性
我们首先在MySQL可视化工具navicat中新建一个数据库,命名为demo。在demo数据库中新建用户数据表,如下图所示:
建立“数据库源类”,建立数据库连接。具体实现内容如下:
public class DataSource {
private static String url = "jdbc:mysql://localhost:3306/demo"; //连接路径
private static String user = "root"; //用户名
private static String password = "123"; //密码
/*打开并返回数据库连接 */
public static Connection getConnection() {
try {
MysqlDataSource dataSource = new MysqlDataSource();
//设置连接属性
dataSource.setUrl(url);
dataSource.setUser(user);
dataSource.setPassword(password);
//打开并返回连接
return dataSource.getConnection();
} catch (Exception e) {
e.printStackTrace();
}
return null;
}
}
建立“用户数据访问Dao具体实现类”,实现数据库数据各项属性的读取,保存、修改、删除等功能。具体实现内容如下:
public class UserDaoServiceImpl implements IUserDaoService {
@Override
public List<TDemoUser> query() throws Exception {
//获得数据库连接
Connection conn = DataSource.getConnection();
//创建数据库操作的语句对象
Statement stm = conn.createStatement();
//查询数据库返回结果集
ResultSet rs = stm.executeQuery("select * from t_demo_user"
+ " where isdel=0 order by opertime desc");
//创建封装用户数据的集合
List<TDemoUser> list = new ArrayList<>();
//遍历结果集,封装用户数据
while(rs.next()) {
//创建用户对象
TDemoUser user = new TDemoUser();
//封装数据,给属性设值
user.setUserId(rs.getInt("user_id"));
user.setUserName(rs.getString("user_name")); user.setUserPassword(rs.getString("user_password")); user.setUserGender(rs.getString("user_gender")); user.setUserRole(rs.getString("user_role")); user.setUserEmail(rs.getString("user_email")); user.setUserTelphone(rs.getString("user_telphone")); user.setUserBirthday(rs.getDate("user_birthday"));
user.setIsdel(rs.getString("isdel"));
user.setOpertime(rs.getTimestamp("opertime"));
//添加用户对象到集合中
list.add(user);
}
//关闭连接
conn.close();
//返回用户数据的集合
return list;
}
@Override
public List<TDemoUser> query(String userName) throws Exception {
//获得数据库连接
Connection conn = DataSource.getConnection();
//创建数据库操作的语句对象
Statement stm = conn.createStatement();
//查询数据库返回结果集
ResultSet rs = stm.executeQuery("select * from t_demo_user"
+ " where isdel=0 and user_name like '%"+userName+"%' order by opertime desc");
//创建封装用户数据的集合
List<TDemoUser> list = new ArrayList<>();
//遍历结果集,封装用户数据
while(rs.next()) {
//创建用户对象
TDemoUser user = new TDemoUser();
//封装数据,给属性设值
user.setUserId(rs.getInt("user_id"));
user.setUserName(rs.getString("user_name"));
user.setUserPassword(rs.getString("user_password")); user.setUserGender(rs.getString("user_gender")); user.setUserRole(rs.getString("user_role"));
user.setUserEmail(rs.getString("user_email"));
user.setUserTelphone(rs.getString("user_telphone"));
user.setUserBirthday(rs.getDate("user_birthday"));
user.setIsdel(rs.getString("isdel"));
user.setOpertime(rs.getTimestamp("opertime"));
//添加用户对象到集合中
list.add(user);
}
//关闭连接
conn.close();
//返回用户数据的集合
return list;
}
@Override
public TDemoUser getUserById(String id) throws Exception {
//获得数据库连接
Connection conn = DataSource.getConnection();
//创建数据库操作的语句对象
Statement stm = conn.createStatement();
//查询数据库返回结果集
ResultSet rs = stm.executeQuery("select * from t_demo_user"
+ " where isdel=0 and user_id="+id);
//定义用户变量
TDemoUser user = null;
//遍历结果集,封装用户数据
while(rs.next()) {
//创建用户对象
user = new TDemoUser();
//封装数据,给属性设值
user.setUserId(rs.getInt("user_id"));
user.setUserName(rs.getString("user_name"));
user.setUserPassword(rs.getString("user_password"));
user.setUserGender(rs.getString("user_gender")) user.setUserRole(rs.getString("user_role")); user.setUserEmail(rs.getString("user_email")); user.setUserTelphone(rs.getString("user_telphone")); user.setUserBirthday(rs.getDate("user_birthday"));
user.setIsdel(rs.getString("isdel"));
user.setOpertime(rs.getTimestamp("opertime"));
}
//关闭连接
conn.close();
//返回用户数据的集合
return user;
}
@Override
public TDemoUser find(String userName, String password) throws Exception {
//获得数据库连接
Connection conn = DataSource.getConnection();
//创建数据库操作的语句对象
Statement stm = conn.createStatement();
//查询数据库返回结果集
ResultSet rs = stm.executeQuery("select * from t_demo_user"
+ " where isdel=0 and user_name='"+userName+"' and user_password='"+password+"'");
System.out.println("select * from t_demo_user"
+ " where isdel=0 and user_name='"+userName+"' and user_password='"+password+"'");
//定义用户变量
TDemoUser user = null;
//遍历结果集,封装用户数据
while(rs.next()) {
//创建用户对象
user = new TDemoUser();
//封装数据,给属性设值
user.setUserId(rs.getInt("user_id")); user.setUserName(rs.getString("user_name")); user.setUserPassword(rs.getString("user_password")); user.setUserGender(rs.getString("user_gender")); user.setUserRole(rs.getString("user_role")); user.setUserEmail(rs.getString("user_email"));
user.setUserTelphone(rs.getString("user_telphone"));
user.setUserBirthday(rs.getDate("user_birthday"));
user.setIsdel(rs.getString("isdel")); user.setOpertime(rs.getTimestamp("opertime"));
break;
}
//关闭连接
conn.close();
//返回用户数据的集合
return user;
}
@Override
public void save(TDemoUser user) throws Exception {
//获得数据连接
Connection conn = DataSource.getConnection();
//创建数据库操作语句对象
PreparedStatement stm = conn.prepareStatement("insert into t_demo_user("
+ "user_name,user_password,user_gender,user_role,user_email,user_telphone,"
+ "user_birthday,isdel,opertime) values(?,?,?,?,?,?,?,?,?)");
//设置保存的数据
stm.setString(1, user.getUserName());
stm.setString(2, user.getUserPassword());
stm.setString(3, user.getUserGender());
stm.setString(4, user.getUserRole());
stm.setString(5, user.getUserEmail());
stm.setString(6, user.getUserTelphone());
stm.setDate(7, user.getUserBirthday());
stm.setString(8, "0");
stm.setTimestamp(9, new Timestamp(System.currentTimeMillis()));
//执行SQL,保存数据到数据库
stm.executeUpdate();
//关闭连接
conn.close();
}
@Override
public void update(TDemoUser user) throws Exception {
//获得数据连接
Connection conn = DataSource.getConnection();
//创建数据库操作语句对象
PreparedStatement stm = conn.prepareStatement("update t_demo_user set "
+ "user_name=?,user_password=?,user_gender=?,user_role=?,user_email=?,"
+ "user_telphone=?,user_birthday=?,isdel=?,opertime=? where user_id=?");
//设置保存的数据
stm.setString(1, user.getUserName());
stm.setString(2, user.getUserPassword());
stm.setString(3, user.getUserGender());
stm.setString(4, user.getUserRole());
stm.setString(5, user.getUserEmail());
stm.setString(6, user.getUserTelphone());
stm.setDate(7, user.getUserBirthday());
stm.setString(8, "0");
stm.setTimestamp(9, new Timestamp(System.currentTimeMillis()));
stm.setInt(10, user.getUserId());
//执行SQL,保存数据到数据库
stm.executeUpdate();
//关闭连接
conn.close();
}
接下里编写测试代码,尝试从数据库读取用户数据内容,并在控制台打印输出。测试内容为修改用户信息和查询用户数据列表。测试代码以及测试结果都如下入所示:
7、实现登录界面
首先要新建登录的业务接口类,主要声明一个login函数。实现内容如下:
public interface ILoginService {
public String login(HttpServletRequest request) throws Exception;
}
接着新建登录业务的具体实现类,类中首先定义数据访问Dao对象,接着对用户输入的账户信息进行验证。获得用户输入的账户名和密码,并以此为索引查找相应的用户,如果找到就登录成功,跳转到系统首页,如果没有找到,就要提示“用户名或密码输入错误!”,页面保留在登录界面。具体实现内容如下:
public class LoginServiceImpl implements ILoginService {
private IUserDaoService idao = new UserDaoServiceImpl(); //定义数据访问Dao对象
/*登录验证*/
@Override
public String login(HttpServletRequest request) throws Exception {
//获得请求中的用户名与密码
String userName = request.getParameter("userName");
String password = request.getParameter("password");
//通过Dao接口,访问数据库,用户名与密码为条件查询用户数据
TDemoUser user = idao.find(userName, password);
//验证登录是否成功
if(user!=null) { //成功
System.out.println("登录成功");
//会话中添加用户对象
HttpSession session = request.getSession(); //会话在服务器缓存用户的数据,默认30分钟
session.setAttribute("user", user);
return "/index.jsp";
} else { //失败
//请求中添加错误信息
request.setAttribute("error", "用户名或密码错误!");
return "/login.jsp";
}
}
}
然后新建一个LoginServlet类做为登录(Login)的控制器,声明一个登录服务接口类的服务,并实现请求中数据的编码格式的设置、访问业务Bean,验证登录,跳转到下一个页面等功能。具体实现如下:
@WebServlet("/login")
public class LoginServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
private ILoginService service = new LoginServiceImpl();
protected void service(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
//设置请求中数据的编码格式
request.setCharacterEncoding("utf-8"); //解决中文乱码问题,只支持post模式
try {
//访问业务Bean,验证登录
String path = service.login(request);
//跳转到下一个页面 request.getRequestDispatcher(path).forward(request, response);
} catch (Exception e) {
e.printStackTrace();
}
}
}
此时我们在Tomcat服务器上运行该web项目,可以看到下面的界面图,此时我们故意输入错误的用户信息。
可以看到显示如下。页面没有跳转到系统首页,而是停留在了登录页面,并且提示:用户名或密码输入错误!
我们重新输入正确的账户和密码,成功登录才优备团队内部系统,页面展示如下。在页面的右上角,我们可以看到刚才输入登录的账户的简要信息。
8、实现“我的资料”页面,完成信息查看和更新功能
类似“登录”页面的显示,为了能够在页面动态的和数据库信息进行交互,我们首先得新建一个我的资料业务接口类,接口类中包含我们需要在该页面上实现的功能函数的声明,包括页面的查看和内容的修改,具体实现如下:
public interface IMyInfoService {
/ * 查询当前用户数据 */
public String view(HttpServletRequest request) throws Exception;
/* 修改当前用户数据 */
public String update(HttpServletRequest request) throws Exception;
}
接着是我的资料页面的具体实现类,在登录时建立的会话缓存中,获得当前用户对象及一系列相关信息,以实现用户信息的展示。在更新操作上,我们需要获取请求中用户的信息,并将该信息设置为当前用户的相应属性,最后将用户属性设置回会话当中。具体实现如下:
public class MyInfoServiceImpl implements IMyInfoService {
private IUserDaoService idao = new UserDaoServiceImpl(); //定义数据访问Dao对象
@Override
public String view(HttpServletRequest request) throws Exception {
//从会话缓存中,获得当前用户对象
TDemoUser user = (TDemoUser) request.getSession().getAttribute("user");
//获得用户的ID
String id = String.valueOf(user.getUserId()); //整型转换成字符串型
//查询获得用户的最新数据
user = idao.getUserById(id);
//用户数据设置回会话中
request.getSession().setAttribute("user", user);
return "/admin/myinfo/message.jsp";
}
@Override
public String update(HttpServletRequest request) throws Exception {
//获得请求中用户的数据
String userName = request.getParameter("userName");
String password = request.getParameter("passwordA");
String gender = request.getParameter("gender");
String role = request.getParameter("role");
String email = request.getParameter("email");
String telphone = request.getParameter("telphone");
String birthday = request.getParameter("birthday");
//从会话缓存中,获得当前用户对象
TDemoUser user = (TDemoUser) request.getSession().getAttribute("user");
//封装用户数据(设置用户的属性)
user.setUserName(userName);
user.setUserPassword(password);
user.setUserGender(gender);
user.setUserRole(role);
user.setUserEmail(email);
user.setUserTelphone(telphone);
//创建时间格式化对象
DateFormat format = new SimpleDateFormat("yyyy-MM-dd");
user.setUserBirthday(new Date(format.parse(birthday).getTime()));
user.setOpertime(new Timestamp(System.currentTimeMillis()));
//通过Dao接口,修改用户数据
idao.update(user);
//更新缓存中的数据
//获得用户的ID
String id = String.valueOf(user.getUserId());
//查询获得用户的最新数据
user = idao.getUserById(id);
//用户数据设置回会话中
request.getSession().setAttribute("user", user);
return "/login.jsp";
}
}
然后要做的就是我的资料页面的控制器,声明一个我们资料业务接口对象,并实现更新信息和查看信息功能。具体实现内容如下
@WebServlet("/MyInfoServlet1")
public class MyInfoServlet1 extends HttpServlet {
private static final long serialVersionUID = 1L;
private IMyInfoService service = new MyInfoServiceImpl();
protected void service(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("utf-8");
//获得当前的操作步骤
String status = request.getParameter("status");
//判断进入不同的操作步骤
if("update".equals(status)) {
update(request, response);
} else {
view(request, response);
}
}
/*查询当前用户数据*/
protected void view(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
try {
String path = service.view(request);
request.getRequestDispatcher(path).forward(request, response);
} catch (Exception e) {
e.printStackTrace();
}
}
/*修改当前用户数据 */
protected void update(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
try {
String path = service.update(request);
request.getRequestDispatcher(path).forward(request, response);
} catch (Exception e) {
e.printStackTrace();
}
}
public MyInfoServlet1() {
super();
// TODO Auto-generated constructor stub
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
response.getWriter().append("Served at: ").append(request.getContextPath());
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
doGet(request, response);
}
}
此时我们在Tomcat服务器上重新运行该web项目,并正确登录,点击左侧栏“我的资料”,页面显示了当前用户的具体信息。详情如下:
看到页面上显示的用户信息之后,我们可以回到MySQL可视化工具navicat中查看用户信息在数据库中的具体情况。结果显示,页面读取的用户信息和数据库中的用户信息完全一致。数据库中用户信息如下图所示:
接着,我们测试用户信息的更新功能。接上步骤页面,我做了部分用户信息的修改,即修改了用户名和联系电话。具体修改信息如下:
完成更新信息的输入之后,点击确定,页面跳转到了登录页面。此时,我们再次回到navicat页面,查看数据库用户信息,可以看到我们刚才在页面上做的用户数据更新已经存回了数据库。
接着我们重新登录才优备团队内部系统,这次我们输入更改后的用户名称和相应的密码,登录成功后进入到系统首页。
这个时候,我们再次点击“我的资料”,查看用户信息。显示的信息内容和我们更改后的内容保持一致。详情如下图所示: