我的云相册

最新推荐文章于 2024-02-28 21:39:27 发布

置顶

Doris-wr

最新推荐文章于 2024-02-28 21:39:27 发布

阅读量2.9k

点赞数 6

本文链接：https://blog.csdn.net/Amanda_wr/article/details/105914597

版权

我的云相册目录

一.引言

云相册其实就是一个可以存储图片的HTTP服务器，可以完成对图片的增删改查功能，同时搭配简单的前端页面辅助完成图片上传和展示。

二.项目功能

实现图片的上传，查询，删除，以及展示功能

三.技术选型

1.数据库存储图片元信息——MySQl

2.使用JDBC操作数据库

3.前后端交互——Ajax异步提交

4.文件上传------使用了第三方库commons-fileupload

5.磁盘的存储优化——Md5

6使用Gson这个库完成json的解析与构造

7.使用Postman工具进行简单的测试

8.使用html，css，JavaScript技术构建简单的网页

9.使用tomcat部署项目

四.服务器设计

数据库设计

1.创建数据库表，存储图片的属性信息

create table image_table(imageId int not null primary key  auto_increment,

     imageName varchar(50),

     size int,

     uploadTime varchar(50),

     contentType varchar(50),

     path varchar(1024),

     md5 varchar(1024)

  );

2.封装数据库操作

1）创建DBUtil类，辅助创建连接

public class DBUtil {
    private static final String URL="jdbc:mysql://127.0.0.1:3306/java_image_server?characterEncoding=utf8&&useSSL=true";
    private static final String USERNAME="root";
    private static final String PASSWORD="123456";
    private static  volatile DataSource dataSource=null;
    public static DataSource getDataSource(){
       
    }
    public static Connection getConnection()  {
       
    }
    public static void close(Connection connection, PreparedStatement statement, ResultSet resultSet){

    }
}

2）创建Image类

public class Image {
     private int imageId;
     private String imageName;
     private int size;
     private String uploadTime;
     private String contentType;
     private String path;
     private String md5; 
}

3）创建ImageDao类，实现对Image对象的增删改查

public class ImageDao {
    /*
     * 功能描述:把image对象插入到数据库中
     * @return void
     */
    public void insert(Image image){
    }
    /*
     * 功能描述:查找数据库中所有图片的信息
     * @return java.util.List<dao.Image>
     */
    public List<Image> selectAll(){
    }
    /*
     * 功能描述:根据imageId查找指定的图片信息
     * @return dao.Image
     */
    public Image selectOne(int imageId){
    }
    /*
     * 功能描述:根据imageId删除指定的图片
     * @return void
     */
    public void delete(int imageId){   
    }
    //按照md5查找
    public Image selectByMd5(String md5){
    }
}

前后端交互接口设计（服务器API设计）

前置知识：在服务器api设计部分，我们将会用到一种轻量级的数据交换格式——JSON。json只是一种数据格式，和编程语言无关（出身于JavaScript）， json可以将对象中表示的一组数据转换为字符串，然后可以在网络或者程序之间轻松的传递这个字符串，并在需要的时候将它还原为各编程语言所支持的数据格式。我们在这里使用json完成数据的序列化，方便进行网络传输。

Gson：是google搞的开源的JSON解析库，我们在使用json时需要将gson库加入我们的依赖中，可在maven仓库中进行下载：

 <dependency>
      <groupId>com.google.code.gson</groupId>
      <artifactId>gson</artifactId>
      <version>2.8.6</version>
 </dependency>

下面以一个简单示例来学习Json的使用：

public class TestGson {
    public static void main(String[] args) {
        HashMap<String,Object>hashmap=new HashMap<>();
        hashmap.put("name","曹操");
        hashmap.put("skill1","剑气");
        hashmap.put("skill2","三段跳");
        hashmap.put("skill3","加攻击并吸血");
        hashmap.put("skill4","加攻速");
        //通过map转成一个JSON结构的字符串
        //1.创建一个gson对象
        Gson gson=new GsonBuilder().create();
        //2.使用toGson方法把键值对结构转换成JSON字符串
        String str=gson.toJson(hashmap);
        System.out.println(str);
    }
}

打印结果为一组键值对的集合：

接下来开始正式设计前后端交互api，即我们的HTTP协议要构建成什么样子。在此部分我们使用body字段中ok为true表示成功，ok为false表示失败，或者[ ]有内容表示成功，[ ]没有内容表示失败。

1.新增图片

首先写一个简单的的upload.html来上传图片：

<html>
<head>
</head>
<body>
<form id="upload-form" action="image" method="post" enctype="multipart/form-data" >
    <input type="file" id="upload" name="upload" /> <br />
    <input type="submit" value="Upload" />
</form>
</body>
</html>

设定接口如下：

2.查看所有图片属性

3.查看指定图片属性

}

4.删除指定图片

最低0.47元/天解锁文章

Doris-wr

关注

6
点赞
踩
25

收藏

觉得还不错? 一键收藏
0
评论
我的云相册

一.引言此项目核心就是一个HTTP服务器，可以完成对图片的增删改查能力，同时搭配简单的页面辅助完成图片上传和展示。二.项目功能图片的上传，查询，删除，以及展示操作三.技术选型1.数据库存储图片属性信息——MySql2.使用JDBC操作数据库3.前后端交互——Ajax异步提交4.文件上传------使用了第三方库commons-fileupload5.磁盘的存储优...
复制链接

扫一扫