时间戳

首页 > 技术文章 > 博客添加与查看的功能实现

博客添加与查看的功能实现

star-Java 2020-11-28 20:15 原文

一、准备工作

1.创建表

create table blog(id int primary key auto_increment,title varchar(100),content varchar(255),url varchar(255),created bigint);

2.创建工程(使用软件IDEA)

a.创建maven工程，骨架为webapp，命名为blog_servlet

b.pom.xml文件中添加相关依赖，连接数据库依赖，数据库连接池，Thymeleaf 模板引擎

c.配置Tomcat，并添加相关jar包

d.创建相关文件夹java和resource

e.并将jdbc.properties文件放到resource文件夹中

/*jdbc.properties内代码*/
db.driver=com.mysql.cj.jdbc.Driver
db.url=jdbc:mysql://localhost:3306/这里存放自己的数据库名称?characterEncoding=utf8&useSSL=false&serverTimezone=Asia/Shanghai&rewriteBatchedStatements=true
db.username=这里是数据库用户名称
db.password=这里是数据库密码
db.maxActive=10
db.initialSize=2

二、代码工作（utils包中的DButils类数据库工具类和ThUtils类模板引擎对象类在文章末尾）

1.发布博客功能的实现

a.先创建一个博客发布页面（简易版）

创建send,html页面，在里面准备form表单，提供文件上传功能，请求方式为post，并设置编码类型

<!-- 文件上传必须使用post请求，而且需要添加enctype编码类型 -->
<h3>发布博客</h3>
<form action="send" method="post" enctype="multipart/form-data">
    标题: <input type="text" name="title"><br>
    内容: <input type="text" name="context"><br>
    图片: <input type="file" name="pic"><br>
    <input type="submit" value="发布文章">
</form>

b.创建SendServlet，处理路径为/send，在doPost方法中获取传递的参数，并获取上传的文件

package cn.controller;

import cn.dao.BlogDao;
import cn.entity.Blog;

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 java.io.File;
import java.io.IOException;
import java.util.UUID;

//如果处理文件上传，在servlet中必须添加一下注解，作用是对应页面中的编码类型
@MultipartConfig
@WebServlet(name = "SendServlet" , urlPatterns = "/send")
public class SendServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        //在post请求中必须设置字符集
        request.setCharacterEncoding("UTF-8");
        //获取传递参数
        String title = request.getParameter("title");
        String content = request.getParameter("content");
        //测试是否获取成功
        System.out.println(title+":"+content);
        /*
            part
            文件上传API
            HttpServletRequest 提供了两个方法用于从请求中解析上传的文件：
            Part getPart(String name): 用于获取请求中指定name的文件
            Coolection< Part > getParts();获取请求中全部的文件
            每一个文件用 javax.servlet.http.Part 对象来表示,该接口提供了很多处理文件的方法
        */
        //获取上传文件
        Part part = request.getPart("pic");
        //获取文件上传信息
        String info = part.getHeader("content-disposition");
        //验证：form-data;name="pic";filename="上传文件的名字.类型"
        System.out.println(info);
        //得到文件的类型获取.后的文件
        String type = info.substring(info.lastIndexOf("."),info.length()-1);
        System.out.println(type);
        //设置上传文件唯一名字
        //UUID.randomUUID()功能，获取唯一标识
        String filename = UUID.randomUUID()+type;
        //验证
        System.out.println(filename);
        //文件保存
        //保存路径必须为tomcat管辖范围内的路径:原因是需要从html页面中访问此文件
        //得到路径
        String path = request.getServletContext().getRealPath("text/");
        //验证
        System.out.println(path);
        //把指定的文件夹创建出来
        //mkdirs()创建文件夹
        new File(path).mkdirs();
        //保存上传文件   将获取的path+filename写入part  的路径
        part.write(path+filename);
        System.out.println("文件保存完成");
        //把博客信息封装到博客对象中
        Blog blog = new Blog(0,title,content,
                "text/"+filename,System.currentTimeMillis());
        BlogDao dao = new BlogDao();
        dao.insert(blog);
        //重新定向到页面
        response.sendRedirect("/findall");
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

    }
}

c.先创建Blog在其中定义Blog相关属性，再实现dao里面的insert方法

package cn.entity;

public class Blog {
    private int id;
    private String title;
    private String content;
    private String url;
    private long created;

    public int getId() {
        return id;
    }

    public void setId(int id) {
        this.id = id;
    }

    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    public String getContent() {
        return content;
    }

    public void setContent(String content) {
        this.content = content;
    }

    public String getUrl() {
        return url;
    }

    public void setUrl(String url) {
        this.url = url;
    }

    public long getCreated() {
        return created;
    }

    public void setCreated(long created) {
        this.created = created;
    }

    public Blog(int id, String title, String content, String url, long created) {
        this.id = id;
        this.title = title;
        this.content = content;
        this.url = url;
        this.created = created;
    }

    @Override
    public String toString() {
        return "Blog{" +
                "id=" + id +
                ", title='" + title + '\'' +
                ", content='" + content + '\'' +
                ", url='" + url + '\'' +
                ", created=" + created +
                '}';
    }
}
package cn.dao;

import cn.entity.Blog;
import cn.utils.DBUtils;

import java.sql.Connection;
import java.sql.PreparedStatement;

public class BlogDao {
    //增
    public void insert(Blog blog) {
        //获取连接(数据库连接)
        try(Connection connection = DBUtils.getConn()){
            String sql = "insert into blog values(null,?,?,?,?)";
            PreparedStatement ps = connection.prepareStatement(sql);
            ps.setString(1,blog.getTitle());
            ps.setString(2,blog.getContent());
            ps.setString(3,blog.getUrl());
            ps.setLong(4,blog.getCreated());
            ps.executeUpdate();
            System.out.println("保存完成");
        }catch (Exception e){
            e.printStackTrace();
        }
    }
}

二、博客列表页面

a.创建FindAllServlet,处理路径为/findall ,  的doGet方法中创建BlogDao 并调用findAll方法 返回值为List集合里面装着多个Blog对象,  将集合装进Context容器中, 通过模板引擎工具类将list.html页面和容器中的数据整合到一起返回给客户端 

package cn.controller;

import cn.dao.BlogDao;
import cn.entity.Blog;
import cn.utils.ThUtils;
import org.thymeleaf.context.Context;

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 java.io.IOException;
import java.util.List;

@WebServlet(name = "FindAllServlet",urlPatterns = "/findall")
public class FindAllServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        BlogDao dao = new BlogDao();
        List<Blog> list = dao.findAll();
        Context context = new Context();
        context.setVariable("list",list);
        ThUtils.print("list.html",context,response);
    }
}

b.实现dao里面的findall方法

    //部分代码
    public List<Blog> findAll() {
        ArrayList<Blog> list = new ArrayList<>();
        //获取连接(数据库连接)
        try(Connection connection = DBUtils.getConn()){
            String sql = "select * from blog";
            Statement statement = connection.createStatement();
            ResultSet resultset = statement.executeQuery(sql);
            while (resultset.next()){
                int id = resultset.getInt(1);
                String title = resultset.getString(2);
                String content = resultset.getString(3);
                String url = resultset.getString(4);
                long created = resultset.getLong(5);
                list.add(new Blog(id,title,content,url,created));
            }
        }catch (Exception e){
            e.printStackTrace();
        }
        return list;
    }

c.创建list.html页面  在页面中通过Thymeleaf提供的语法 把容器context里面的集合遍历 并显示,（此页面在文件夹resource下存放不完整代码页面） 

<!DOCTYPE html>
<html lang="en" xmlns:th="http:www/thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!-- 遍历容器中集合 -->
<div th:each="b:${list}">
    <!--把遍历blog对象中的内容取出显示在标签里面-->
    <h3 th:text="${b.title}">标题</h3>
    <p th:text="${b.content}">内容</p>
    <img width="100" alt="" th:src="${b.url}">
    <span th:text="${b.createdStr}"></span>
    <hr>
</div>
</body>
</html>

推荐阅读