JavaWeb-结合七牛搭建个人相册

2024-06-11 03:38

本文主要是介绍JavaWeb-结合七牛搭建个人相册,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

结合七牛搭建个人相册


转载自:https://www.shiyanlou.com/courses/document/256


一、实验说明

1. 环境登录

无需密码自动登录,系统用户名shiyanlou,密码shiyanlou

2. 环境介绍

本实验环境采用带桌面的Ubuntu Linux环境,实验中会用到桌面上的程序:

  1. LX终端(LXTerminal): Linux命令行终端,打开后会进入Bash环境,可以使用Linux命令

  2. Firefox:浏览器,可以用在需要前端界面的课程里,只需要打开环境里写的HTML/JS页面即可

  3. GVim:非常好用的编辑器,最简单的用法可以参考课程Vim编辑器

3. 环境使用

使用GVim编辑器输入实验所需的代码及文件,使用LX终端(LXTerminal)运行所需命令进行操作。

完成实验后可以点击桌面上方的“实验截图”保存并分享实验结果到微博,向好友展示自己的学习进度。实验楼提供后台系统截图,可以真实有效证明您已经完成了实验。

实验记录页面可以在“我的主页”中查看,其中含有每次实验的截图及笔记,以及每次实验的有效学习时间(指的是在实验桌面内操作的时间,如果没有操作,系统会记录为发呆时间)。这些都是您学习的真实性证明。

本课程中的所有源码可以通过以下方式下载:

http://git.shiyanlou.com/shiyanlou/Photo

二、引言

1. 课程概述

相信很多人都知道网站一般会有很多图片,对于小型网站来说,图片放在网站服务器上不算什么,但当图片数量很大时,会造成服务器很臃肿,相应地对带宽要求也会提高,这就造成了成本的增加。其实现在已经流行云存储,我们可以把图片、大文件等放到第三方提供的云存储服务上,这会减少一部分成本。这门课程就介绍了JavaWeb结合七牛云存储来搭建个人相册服务。

2. 预备知识

掌握Servlet+JSP,能了解Bootstrap更好。

三、Just Do It!

项目开始前,你需要有一个七牛云存储的标准用户账号,新建一个Bucket,知道你自己的Access Key和Secret Key。

1. 创建数据库

这里我们使用MySQL数据库,创建名称为photo的数据库:

create database photo DEFAULT CHARSET=utf8;CREATE TABLE `image` (`id` int(11) NOT NULL AUTO_INCREMENT,`name` varchar(16) DEFAULT NULL,`url` varchar(255) DEFAULT NULL,`date` datetime DEFAULT NULL,`user_id` int(11) DEFAULT NULL,PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;CREATE TABLE `user` (`id` int(11) NOT NULL AUTO_INCREMENT,`username` varchar(16) DEFAULT NULL,`password` varchar(16) DEFAULT NULL,PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;

2. 创建JavaWeb项目

这里使用Eclipse创建一个名称为Photo的动态Web项目,加入Tomcat 7服务器,加入所需的jar包(源码中包含jar包),把Photo项目部署到Tomcat上。

3. 编写前端代码

前端使用Bootsrap,把css、fonts和js文件夹放到WebContent目录下。

创建index.jsp:

<%@ page language='java' contentType='text/html; charset=UTF-8'pageEncoding='UTF-8'%>
<!DOCTYPE html>
<html lang='zh-cn'><head><meta charset='utf-8'><meta http-equiv='X-UA-Compatible' content='IE=edge'><meta name='viewport' content='width=device-width, initial-scale=1'><title>实验楼个人相册</title><link href='css/bootstrap.min.css' rel='stylesheet'><!--[if lt IE 9]><script src='http://labfile.oss.aliyuncs.com/libs/html5shiv/3.7.2/html5shiv.min.js'></script><script src='http://labfile.oss.aliyuncs.com/respond.js/1.4.2/respond.min.js'></script><![endif]--></head><body><div class='container'><div class='row'><div class='col-xs-12 text-center'><h2>实验楼个人相册</h2></div></div><div class='row'><div id='alert1'  class='alert alert-success fade in text-center col-xs-2 col-xs-offset-5 hide'><strong>注册成功</strong></div></div><form id='form' class='form-horizontal' role='form' style='margin-top: 73px;'><div class='form-group'  ><label for='username' class='col-xs-2 control-label col-sm-offset-3' >用户名</label><div class='col-xs-2'><input type='text' class='form-control' id='username' rel='tooltip'/></div></div><div class='form-group'><label for='password' class='col-xs-2 control-label col-sm-offset-3'>密码</label><div class='col-xs-2'><input type='password' class='form-control' id='password'/></div></div><div class='form-group'><div class='col-sm-offset-5 col-xs-1'><button type='button' class='btn btn-success' id='login'>登录</button></div><div class='col-sm-1'><button type='button' class='btn btn-danger' data-toggle='modal' data-target='#myModal'>注册</button></div></div></form></div><!-- 注册对话框 begin --><div class='modal fade' id='myModal' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'><div class='modal-dialog'><div class='modal-content'><div class='modal-header'><button type='button' class='close' data-dismiss='modal'><span aria-hidden='true'>&amp;times;</span><span class='sr-only'>Close</span></button><h4 class='modal-title' id='myModalLabel'>用户注册</h4></div><div class='modal-body'><form class='form-horizontal' role='form'><div class='form-group'  ><label for='reg_username' class='col-xs-2 control-label' >用户名</label><div class='col-xs-4'><input type='text' class='form-control' id='reg_username'/></div></div><div class='form-group'><label for='reg_password' class='col-xs-2 control-label'>密码</label><div class='col-xs-4'><input type='password' class='form-control' id='reg_password'/></div></div><div class='form-group'><label for='reg_repassword' class='col-xs-2 control-label'>重复密码</label><div class='col-xs-4'><input type='password' class='form-control' id='reg_repassword'/></div></div></form></div><div class='modal-footer'><button type='button' class='btn btn-default' data-dismiss='modal'>取消</button><button type='button' class='btn btn-primary' id='register'>注册</button></div></div></div></div><!-- 注册对话框 end --><script src='http://labfile.oss.aliyuncs.com/jquery/1.11.1/jquery.min.js'></script><script src='js/bootstrap.min.js'></script><script type='text/javascript'>$(document).ready(function() {//点击登录$('#login').click(function() {//提交登录表单$.post('${pageContext.request.contextPath}' + '/UserAction?type=1',{username: $('#username').val(),password: $('#password').val()},function(data, status) {if (data == '1') {createPopOver('#username', 'right', '用户名不能为空', 'show');} else if (data == '2') {createPopOver('#password', 'right', '密码不能为空', 'show');} else if (data == '3') {createPopOver('#username', 'right', '用户名不存在', 'show');} else if (data == '4') {createPopOver('#password', 'right', '密码错误', 'show');} else if (data == 5) {location.href = '${pageContext.request.contextPath}' + '/home.jsp';}});});//点击注册按钮$('#register').click(function() {//提交注册表单$.post('${pageContext.request.contextPath}' + '/UserAction?type=2',{username: $('#reg_username').val(),password: $('#reg_password').val(),repassword: $('#reg_repassword').val()},function(data, status) {if (data == '1') {createPopOver('#reg_username', 'right', '不能为空', 'show');} else if (data == '2') {createPopOver('#reg_password', 'right', '不能为空', 'show');} else if (data == '3') {createPopOver('#reg_repassword', 'right', '不能为空', 'show');} else if (data == '4') {createPopOver('#reg_repassword', 'right', '密码不一致', 'show');} else if (data == '5') {createPopOver('#reg_username', 'right', '用户名已存在', 'show');} else if (data == '6') {$('#reg_username').val('');$('#reg_password').val('');$('#reg_repassword').val('');$('#myModal').modal('hide');$('#alert1').removeClass('hide');$('#form').css('margin-top', '0px');}});}); //显示弹出框function createPopOver(id, placement, content, action) {$(id).popover({placement: placement,content: content});$(id).popover(action);}//点击输入框时销毁弹出框$('#username').click(function() {$('#username').popover('destroy');});$('#password').click(function() {$('#password').popover('destroy');});$('#reg_username').click(function() {$('#reg_username').popover('destroy');});$('#reg_password').click(function() {$('#reg_password').popover('destroy');});$('#reg_repassword').click(function() {$('#reg_repassword').popover('destroy');});});</script></body>
</html>

创建home.jsp:

<%@ page language='java' contentType='text/html; charset=UTF-8'pageEncoding='UTF-8'%>
<%@ taglib prefix='c' uri='http://java.sun.com/jsp/jstl/core' %>
<%@ taglib prefix='fmt' uri='http://java.sun.com/jsp/jstl/fmt' %>
<!DOCTYPE html>
<html lang='zh-cn'><head><meta charset='utf-8'><meta http-equiv='X-UA-Compatible' content='IE=edge'><meta name='viewport' content='width=device-width, initial-scale=1'><title>${user.username}的个人相册</title><link href='css/bootstrap.min.css' rel='stylesheet'><!--[if lt IE 9]><script src='http://labfile.oss.aliyuncs.com/libs/html5shiv/3.7.2/html5shiv.min.js'></script><script src='http://labfile.oss.aliyuncs.com/respond.js/1.4.2/respond.min.js'></script><![endif]--></head><body><div class='container'><!-- 首部 start --><div class='row'><div class='col-xs-8 col-xs-offset-2'><h3 class='page-header'>${user.username}&amp;nbsp;&amp;nbsp;&amp;nbsp;<small><span class='badge'>${imageList.size()}</span></small><div class='btn-group pull-right'><button type='button' class='btn btn-primary dropdown-toggle' data-toggle='dropdown'>操作<span class='caret'></span></button><ul class='dropdown-menu' role='menu'><li><a href='#' data-toggle='modal' data-target='#myModa2'>上传</a></li><li><a href='#' data-toggle='modal' data-target='#myModa3'>删除</a></li><li><a href='#' data-toggle='modal' data-target='#myModa4'>退出</a></li></ul></div></h3></div></div><!-- 首部 end --><!-- 显示图片列表 --><c:forEach items='${imageList}' varStatus='status' var='image'><c:choose><c:when test='${status.first or status.index % 4 eq 0}'><div class='row'><div class='col-xs-2 col-xs-offset-2'><a href='#' class='thumbnail text-center'><img name='${image.name}' date='<fmt:formatDate value='${image.date}' pattern='yyyy-MM-dd HH:mm'/>' style='width: 140px; height: 130px;' src='http://shiyanlouphoto.qiniudn.com/${image.url}'><input class='pull-left' type='checkbox' value='${image.id}' url='${image.url}'/>${image.name }</a></div></c:when><c:when test='${status.index % 4 eq 3 and not status.last }'><div class='col-xs-2'><a href='#' class='thumbnail text-center'><img name='${image.name}' date='<fmt:formatDate value='${image.date}' pattern='yyyy-MM-dd HH:mm'/>' style='width: 140px; height: 130px;' src='http://shiyanlouphoto.qiniudn.com/${image.url}'><input class='pull-left' type='checkbox' value='${image.id}' url='${image.url}' />${image.name }</a></div></div></c:when><c:otherwise><div class='col-xs-2'><a href='#' class='thumbnail text-center'><img name='${image.name}' date='<fmt:formatDate value='${image.date}' pattern='yyyy-MM-dd HH:mm'/>' style='width: 140px; height: 130px;' src='http://shiyanlouphoto.qiniudn.com/${image.url}'><input class='pull-left' type='checkbox' value='${image.id}' url='${image.url}'/>${image.name }</a></div></c:otherwise></c:choose><c:if test='${status.last}'></div></c:if></c:forEach><!-- 显示图片列表 end --></div><!-- 显示图片对话框 start --><div class='modal fade' id='myModal' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'><div class='modal-dialog'><div class='modal-content'><div class='modal-header'><button type='button' class='close' data-dismiss='modal' aria-hidden='true'>&amp;times;</button><h4 class='modal-title' id='myModalLabel'></h4></div><div class='modal-body' id='modal-content'></div></div></div></div><!-- 显示图片对话框 end --><!-- 上传图片对话框 start --><div class='modal fade' id='myModa2' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'><div class='modal-dialog'><div class='modal-content'><div class='modal-header'><h4 class='modal-title' id='myModalLabe2'>图片上传</h4></div><div class='modal-body'><form class='form-horizontal' role='form' id='form'><div class='form-group'  ><label for='image_name' class='col-xs-2 control-label' >名称</label><div class='col-xs-4'><input type='text' class='form-control' id='image_name' name='image_name'/></div></div><div class='form-group'><label for='image' class='col-xs-2 control-label'>图片</label><div class='col-xs-4'><input type='file' id='image' name='image'/></div></div></form></div><div class='modal-footer'><button type='button' class='btn btn-default' data-dismiss='modal'>取消</button><button type='button' class='btn btn-primary' id='upload'>上传</button></div></div></div></div><!-- 上传图片对话框 end --><!-- 删除图片对话框 start --><div class='modal fade' id='myModa3' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'><div class='modal-dialog'><div class='modal-content'><div class='modal-header'><h4 class='modal-title' id='myModalLabe3'>确定删除吗?</h4></div><div class='modal-footer'><button type='button' class='btn btn-default' data-dismiss='modal'>取消</button><button type='button' class='btn btn-danger' id='delete'>确定</button></div></div></div></div><!-- 删除图片对话框 end --><!-- 退出对话框 start --><div class='modal fade' id='myModa4' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'><div class='modal-dialog'><div class='modal-content'><div class='modal-header'><h4 class='modal-title' id='myModalLabe4'>确定退出吗?</h4></div><div class='modal-footer'><button type='button' class='btn btn-default' data-dismiss='modal'>取消</button><button type='button' class='btn btn-danger' id='exit'>确定</button></div></div></div></div><!-- 退出对话框 end --><script src='http://labfile.oss.aliyuncs.com/jquery/1.11.1/jquery.min.js'></script><script src='js/bootstrap.min.js'></script><script type='text/javascript'>$(document).ready(function() {//点击图片$('img').click(function() {$('#myModalLabel').html($(this).attr('name') + '&amp;nbsp;&amp;nbsp;&amp;nbsp;<small>' + $(this).attr('date') + '</small>');$('#modal-content').html('<img class=\'img-responsive\' src=\'' + $(this).attr('src') + '\'/>');$('#myModal').modal('show');});//点击上传$('#upload').click(function() {if ($('#image_name').val() == '' || $('#image').val() == '') {} else {$('#form').attr('action', '${pageContext.request.contextPath}' + '/ImageAction?type=1');$('#form').attr('enctype', 'multipart/form-data');$('#form').attr('method', 'post');$('#form').submit();}});//点击确定退出$('#exit').click(function() {$.get('${pageContext.request.contextPath}' + '/UserAction?type=3', function(data, status) {location.href = '${pageContext.request.contextPath}' + '/index.jsp';});});//点击确定删除图片$('#delete').click(function() {var ids = '';var urls = '';$('input[type=checkbox]:checked').each(function() {ids += $(this).val() + ',';urls += $(this).attr('url') + ',';}); $.post('${pageContext.request.contextPath}' + '/ImageAction?type=2', {ids: ids,urls: urls},function(data, status) {$('#myModa3').modal('hide');location.href = '${pageContext.request.contextPath}' + '/home.jsp';});});});</script></body>
</html>

4. 编写后台代码

创建User类:

package com.shiyanlou.photo.domain;import java.io.Serializable;
import java.util.List;/*** 用户类* @author www.shiyanlou.com**/
@SuppressWarnings('serial')
public class User implements Serializable {private int id; //用户IDprivate String username;    //用户名private String password;    //密码private List<Image> images; //图片列表public User() {}public User(int id, String username, String password, List<Image> images) {this.id = id;this.username = username;this.password = password;this.images = images;}public User(String username, String password) {this.username = username;this.password = password;}public User(int id) {this.id = id;}public List<Image> getImages() {return images;}public void setImages(List<Image> images) {this.images = images;}public int getId() {return id;}public void setId(int id) {this.id = id;}public String getUsername() {return username;}public void setUsername(String username) {this.username = username;}public String getPassword() {return password;}public void setPassword(String password) {this.password = password;}}

创建Image类:

package com.shiyanlou.photo.domain;import java.io.Serializable;
import java.util.Date;/*** 图片类* @author www.shiyanlou.com**/
@SuppressWarnings('serial')
public class Image implements Serializable {private int id; //图片IDprivate String name;    //图片名private String url; //图片URLprivate Date date;  //上传时间private User user;  //所属用户public int getId() {return id;}public void setId(int id) {this.id = id;}public String getName() {return name;}public void setName(String name) {this.name = name;}public String getUrl() {return url;}public void setUrl(String url) {this.url = url;}public Date getDate() {return date;}public void setDate(Date date) {this.date = date;}public User getUser() {return user;}public void setUser(User user) {this.user = user;}
}

创建数据库工具类:

package com.shiyanlou.photo.util;import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.util.ArrayList;/*** 数据库工具类* @author www.shiyanlou.com**/
public class DBUtils {private static Connection connection = null;private static PreparedStatement preparedStatement = null;private static ResultSet resultSet = null;//初始化static {try {Class.forName('com.mysql.jdbc.Driver');} catch (Exception e) {e.printStackTrace();}}/*** 获取连接* @return*/private static Connection getConnection() {try {connection = DriverManager.getConnection(&#3#34;jdbc:mysql://localhost:3306/photo?useUnicode=true&amp;characterEncoding=UTF-8', 'root', 'root');} catch (SQLException e) {e.printStackTrace();}return connection;}/*** 关闭连接、预处理语句和结果集* @param connection* @param preparedStatement* @param resultSet*/private static void close(Connection connection, PreparedStatement preparedStatement, ResultSet resultSet) {try {if (resultSet != null) {resultSet.close();resultSet = null;}if (preparedStatement != null) {preparedStatement.close();preparedStatement = null;}if (connection != null) {connection.close();connection = null;}           } catch (Exception e) {e.printStackTrace();}}/*** 查询数据库* @param sql SQL语句* @param parameters 参数* @return*/public static ArrayList<Object[]> query(String sql, String[] parameters) {ArrayList<Object[]> list = new ArrayList<Object[]>();try {connection = getConnection();preparedStatement = connection.prepareStatement(sql);for (int i = 0; i < parameters.length; i++) {preparedStatement.setString(i + 1, parameters[i]);}resultSet = preparedStatement.executeQuery();int columnCount = resultSet.getMetaData().getColumnCount();while (resultSet.next()) {Object[] objects = new Object[columnCount];for (int i = 0; i < columnCount; i++) {objects[i] = resultSet.getObject(i + 1);}list.add(objects);}} catch (Exception e) {e.printStackTrace();} finally {close(connection, preparedStatement, resultSet);}return list;}/*** 更新数据库* @param sqls SQL语句数组* @param parameters 参数数组*/public static void updates(String[] sqls, String[][] parameters) {try {connection = getConnection();connection.setAutoCommit(false);for (int i = 0; i < sqls.length; i++) {preparedStatement = connection.prepareStatement(sqls[i]);for (int j = 0; j < parameters[i].length; j++) {preparedStatement.setString(j + 1, parameters[i][j]);}preparedStatement.executeUpdate();}connection.commit();} catch (Exception e) {try {connection.rollback();} catch (SQLException e1) {e1.printStackTrace();}e.printStackTrace();} finally {close(connection, preparedStatement, resultSet);}}
}

创建文件工具类(使用了七牛云存储服务)

package com.shiyanlou.photo.util;import java.io.InputStream;import org.json.JSONException;import com.qiniu.api.auth.AuthException;
import com.qiniu.api.auth.digest.Mac;
import com.qiniu.api.io.IoApi;
import com.qiniu.api.rs.PutPolicy;
import com.qiniu.api.rs.RSClient;/*** 图片工具类(使用七牛云存储服务)* @author www.shiyanlou.com**/
public class FileUtils {private static final String ACCESS_KEY = '你自己的Access Key';private static final String SECRET_KEY = '你自己的Secret Key';private static final String BUCKET_NAME = '创建的Bucket的名称';/*** 上传图片到七牛云存储* @param reader* @param fileName*/public static void upload(InputStream reader, String fileName) {String uptoken;try {Mac mac = new Mac(ACCESS_KEY, SECRET_KEY);PutPolicy putPolicy = new PutPolicy(BUCKET_NAME);uptoken = putPolicy.token(mac);IoApi.Put(uptoken, fileName, reader, null);} catch (AuthException e) {e.printStackTrace();} catch (JSONException e) {e.printStackTrace();}}/*** 删除七牛云存储上的图片* @param key*/public static void delete( String key) {Mac mac = new Mac(ACCESS_KEY, SECRET_KEY);RSClient client = new RSClient(mac);client.delete(BUCKET_NAME, key);}
}

创建用户服务类:

package com.shiyanlou.photo.service;import java.util.List;import com.shiyanlou.photo.domain.User;
import com.shiyanlou.photo.util.DBUtils;/*** 用户服务类* @author www.shiyanlou.com**/
public class UserService {/*** 通过用户名获取用户* @param username 用户名* @return 用户*/public User getUserByUsername(String username) {String sql = 'select id, username, password from user where username = ?';String[] parameters = {username};List<Object[]> users = DBUtils.query(sql, parameters);if (users.size() == 0) {return null;} else {Object[] objects = users.get(0);return objects == null ? null : new User(Integer.parseInt(objects[0].toString()), objects[1].toString(), objects[2].toString(), null);}}/*** 添加用户* @param user 用户*/public void addUser(User user) {String[] sqls = {'insert into user(username, password) values(?, ?)'};String[][] parameters = {{user.getUsername(), user.getPassword()}};DBUtils.updates(sqls, parameters);}
}

创建图片服务类:

package com.shiyanlou.photo.service;import java.io.InputStream;
import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Date;
import java.util.List;import com.shiyanlou.photo.domain.Image;
import com.shiyanlou.photo.domain.User;
import com.shiyanlou.photo.util.DBUtils;
import com.shiyanlou.photo.util.FileUtils;/*** 图片服务类* @author www.shiyanlou.com**/
public class ImageService {/*** 通过用户ID获取图片列表* @param userId 用户ID* @return 图片列表*/public ArrayList<Image> getByUserId(int userId) {ArrayList<Image> images = new ArrayList<Image>();String sql = 'select id, name, url, date, user_id from image where user_id = ? order by date desc';String[] parameters = {userId + ''};List<Object[]> imageList = DBUtils.query(sql, parameters);for (Object[] objects : imageList) {Image image = new Image();image.setId(Integer.parseInt(objects[0].toString()));image.setName(objects[1].toString());image.setUrl(objects[2].toString());image.setDate((Date) objects[3]);image.setUser(new User(Integer.parseInt(objects[4].toString())));images.add(image);}return images;}/*** 上传图片* @param image 图片* @param inputStream 输入流*/public void addImage(Image image, InputStream inputStream) {FileUtils.upload(inputStream, image.getUrl());String[] sqls = {'insert into image(name, url, date, user_id) values(?, ?, ?, ?)'};String[][] parameters = {{image.getName(), image.getUrl(), new SimpleDateFormat('yyyy-MM-dd HH:mm').format(image.getDate()), image.getUser().getId() + ''}};DBUtils.updates(sqls, parameters);}/*** 通过图片ID数组和图片URL数组删除图片* @param ids 图片ID数组* @param urls 图片URL数组*/public void delByIdsAndUrls(String ids, String urls) {String[] idArray = ids.split(',');String[] urlArray = urls.split(',');if (!''.equals(idArray[0]) &amp;&amp; !''.equals(urlArray[0])) {String[] sqls = new String[idArray.length];String[][] parameters = new String[idArray.length][1];for (int i = 0; i < idArray.length; i++) {FileUtils.delete(urlArray[i]);sqls[i] = 'delete from image where id = ?';parameters[i][0] = idArray[i];}DBUtils.updates(sqls, parameters);}}
}

创建用户控制器类:

package com.shiyanlou.photo.action;import java.io.IOException;
import java.io.PrintWriter;import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;import com.shiyanlou.photo.domain.User;
import com.shiyanlou.photo.service.ImageService;
import com.shiyanlou.photo.service.UserService;/*** 用户控制器* @author www.shiyanlou.com**/
@WebServlet(value = '/UserAction')
public class UserAction extends HttpServlet {private static final long serialVersionUID = 1L;/*** @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)*/protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {request.setCharacterEncoding('UTF-8');response.setCharacterEncoding('Utf-8');response.setContentType('text/html;charset=UTF-8');PrintWriter out = response.getWriter();UserService userService = new UserService();ImageService imageService = new ImageService();Integer type = Integer.valueOf(request.getParameter('type'));if (type == 1) {    //用户登录String username = request.getParameter('username');String password = request.getParameter('password');String result = null;User user = null;//验证用户是否有效if (username.isEmpty()) {result = '1';} else if (password.isEmpty()) {result = '2';} else if ((user = userService.getUserByUsername(username)) == null) {result = '3';} else {if (!user.getPassword().equals(password)) {result = '4';} else {request.getSession().setAttribute('user', user);request.getSession().setAttribute('imageList', imageService.getByUserId(user.getId()));result = '5';}}out.print(result);} else if (type == 2) { //用户注册String username = request.getParameter('username');String password = request.getParameter('password');String repassword = request.getParameter('repassword');String result = null;//验证有效性if (username.isEmpty()) {result = '1';} else if (password.isEmpty()) {result = '2';} else if (repassword.isEmpty()) {result = '3';} else if (!repassword.equals(password)) {result = '4';} else if (userService.getUserByUsername(username) != null) {result = '5';} else {User user = new User(username, password);//添加用户userService.addUser(user);result = '6';}out.print(result);} else if (type == 3) { //用户退出request.getSession().invalidate();}}/*** @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)*/protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {this.doGet(request, response);}}

创建图片控制器类:

package com.shiyanlou.photo.action;import java.io.IOException;
import java.util.Date;
import java.util.UUID;import javax.servlet.ServletException;
import javax.servlet.annotation.MultipartConfig;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.Part;import com.shiyanlou.photo.domain.Image;
import com.shiyanlou.photo.domain.User;
import com.shiyanlou.photo.service.ImageService;/*** 图片控制器* @author www.shiyanlou.com**/
@WebServlet(value = '/ImageAction')
@MultipartConfig
public class ImageAction extends HttpServlet {private static final long serialVersionUID = 1L;/*** @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)*/protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {request.setCharacterEncoding('utf-8');response.setCharacterEncoding('utf-8');response.setContentType('text/html;charset=utf-8');Integer type = Integer.valueOf(request.getParameter('type'));ImageService imageService = new ImageService();if (type == 1) {    //上传图片String imageName = request.getParameter('image_name');Part image = request.getPart('image');Image img = new Image();img.setDate(new Date());img.setName(imageName);img.setUser((User) request.getSession().getAttribute('user'));img.setUrl(img.getUser().getUsername() + '/' + UUID.randomUUID());imageService.addImage(img, image.getInputStream());request.getSession().setAttribute('imageList', imageService.getByUserId(img.getUser().getId()));response.sendRedirect(request.getContextPath() + '/home.jsp');} else if (type == 2) { //删除图片String ids = request.getParameter('ids');String urls = request.getParameter('urls');imageService.delByIdsAndUrls(ids, urls);request.getSession().setAttribute('imageList', imageService.getByUserId(((User) request.getSession().getAttribute('user')).getId()));}}/*** @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)*/protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {this.doGet(request, response);}}

5. 发布

把Photo部署到Tomcat上,启动服务器,访问http://127.0.0.1:8080/Photo

6.项目截图

图片1

图片2

图片3

图片4

图片5

图片6

图片7

图片8

图片9

这篇关于JavaWeb-结合七牛搭建个人相册的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1050100

相关文章

JVM 的类初始化机制

前言 当你在 Java 程序中new对象时,有没有考虑过 JVM 是如何把静态的字节码(byte code)转化为运行时对象的呢,这个问题看似简单,但清楚的同学相信也不会太多,这篇文章首先介绍 JVM 类初始化的机制,然后给出几个易出错的实例来分析,帮助大家更好理解这个知识点。 JVM 将字节码转化为运行时对象分为三个阶段,分别是:loading 、Linking、initialization

Spring Security 基于表达式的权限控制

前言 spring security 3.0已经可以使用spring el表达式来控制授权,允许在表达式中使用复杂的布尔逻辑来控制访问的权限。 常见的表达式 Spring Security可用表达式对象的基类是SecurityExpressionRoot。 表达式描述hasRole([role])用户拥有制定的角色时返回true (Spring security默认会带有ROLE_前缀),去

浅析Spring Security认证过程

类图 为了方便理解Spring Security认证流程,特意画了如下的类图,包含相关的核心认证类 概述 核心验证器 AuthenticationManager 该对象提供了认证方法的入口,接收一个Authentiaton对象作为参数; public interface AuthenticationManager {Authentication authenticate(Authenti

Spring Security--Architecture Overview

1 核心组件 这一节主要介绍一些在Spring Security中常见且核心的Java类,它们之间的依赖,构建起了整个框架。想要理解整个架构,最起码得对这些类眼熟。 1.1 SecurityContextHolder SecurityContextHolder用于存储安全上下文(security context)的信息。当前操作的用户是谁,该用户是否已经被认证,他拥有哪些角色权限…这些都被保

Spring Security基于数据库验证流程详解

Spring Security 校验流程图 相关解释说明(认真看哦) AbstractAuthenticationProcessingFilter 抽象类 /*** 调用 #requiresAuthentication(HttpServletRequest, HttpServletResponse) 决定是否需要进行验证操作。* 如果需要验证,则会调用 #attemptAuthentica

Spring Security 从入门到进阶系列教程

Spring Security 入门系列 《保护 Web 应用的安全》 《Spring-Security-入门(一):登录与退出》 《Spring-Security-入门(二):基于数据库验证》 《Spring-Security-入门(三):密码加密》 《Spring-Security-入门(四):自定义-Filter》 《Spring-Security-入门(五):在 Sprin

Java架构师知识体认识

源码分析 常用设计模式 Proxy代理模式Factory工厂模式Singleton单例模式Delegate委派模式Strategy策略模式Prototype原型模式Template模板模式 Spring5 beans 接口实例化代理Bean操作 Context Ioc容器设计原理及高级特性Aop设计原理Factorybean与Beanfactory Transaction 声明式事物

Java进阶13讲__第12讲_1/2

多线程、线程池 1.  线程概念 1.1  什么是线程 1.2  线程的好处 2.   创建线程的三种方式 注意事项 2.1  继承Thread类 2.1.1 认识  2.1.2  编码实现  package cn.hdc.oop10.Thread;import org.slf4j.Logger;import org.slf4j.LoggerFactory

JAVA智听未来一站式有声阅读平台听书系统小程序源码

智听未来,一站式有声阅读平台听书系统 🌟&nbsp;开篇:遇见未来,从“智听”开始 在这个快节奏的时代,你是否渴望在忙碌的间隙,找到一片属于自己的宁静角落?是否梦想着能随时随地,沉浸在知识的海洋,或是故事的奇幻世界里?今天,就让我带你一起探索“智听未来”——这一站式有声阅读平台听书系统,它正悄悄改变着我们的阅读方式,让未来触手可及! 📚&nbsp;第一站:海量资源,应有尽有 走进“智听

搭建Kafka+zookeeper集群调度

前言 硬件环境 172.18.0.5        kafkazk1        Kafka+zookeeper                Kafka Broker集群 172.18.0.6        kafkazk2        Kafka+zookeeper                Kafka Broker集群 172.18.0.7        kafkazk3