使用SpringBoot和MySQL创建Todo列表!实现CRUD操作(读取部分)

首先

本次目标是使用SpringBoot从MySQL获取数据,并通过Thymeleaf在页面上显示出来。

我将与那些刚开始学习SpringBoot的人或希望复习的人分享我所学到的知识。

开发环境

OS: macOS Mojave(バージョン 10.14.6)
$ java -version
openjdk version "11.0.2" 2019-01-15
OpenJDK Runtime Environment 18.9 (build 11.0.2+9)
OpenJDK 64-Bit Server VM 18.9 (build 11.0.2+9, mixed mode)
$ mvn -version
Maven home: /usr/local/Cellar/maven/3.6.3_1/libexec
Java version: 15.0.2, vendor: N/A, runtime: /usr/local/Cellar/openjdk/15.0.2/libexec/openjdk.jdk/Contents/Home
Default locale: ja_JP, platform encoding: UTF-8
OS name: "mac os x", version: "10.14.6", arch: "x86_64", family: "mac"
$ spring --version
Spring CLI v2.3.1.RELEASE
$ mysql --version
mysql  Ver 8.0.23 for osx10.14 on x86_64 (Homebrew)

创建项目(编辑pom.xml文件)

在Spring Initializr中快速创建项目。

以下是依存关系的情况。

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.4.3</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>
    <groupId>com.example</groupId>
    <artifactId>todolist</artifactId>
    <version>0.0.1-SNAPSHOT</version>
    <name>todolist</name>
    <description>Demo project for Spring Boot</description>
    <properties>
        <java.version>11</java.version>
    </properties>

    <dependencies>

        <!-- テンプレートエンジン -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>

        <!-- RESTfulを含んだWebアプリケーションライブラリの利用 -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>

        <!-- ファイルの変更を検知すると自動で再起動する -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-devtools</artifactId>
            <scope>runtime</scope>
            <optional>true</optional>
        </dependency>

        <!-- MySQL -->
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <scope>runtime</scope>
        </dependency>

        <!-- @Dataアノテーションを付与する事で,getter,setter等を自動生成してくれる -->
        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <optional>true</optional>
        </dependency>

        <!-- テスト用 -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>

        <!-- DBとJavaオブジェクトやり取りを行う。 -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-data-jpa</artifactId>
        </dependency>

    </dependencies>

    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
                <configuration>
                    <excludes>
                        <exclude>
                            <groupId>org.projectlombok</groupId>
                            <artifactId>lombok</artifactId>
                        </exclude>
                    </excludes>
                </configuration>
            </plugin>
        </plugins>
    </build>

</project>

与MySQL建立连接

即使在终端中直接输入命令 mvn spring-boot:run 运行也无法启动。

$ mvn spring-boot:run

~以下略~

***************************
APPLICATION FAILED TO START
***************************

Description:

Failed to configure a DataSource: 'url' attribute is not specified and no embedded datasource could be configured.

Reason: Failed to determine a suitable driver class

1. 建立数据库并创建测试数据。

首先,使用MySQL创建一个数据库。

CREATE DATABASE spring_todolist_qiita;
mysql> show databases;
+-----------------------+
| Database              |
+-----------------------+
| information_schema    |
| mysql                 |
| performance_schema    |
| spring_todolist_qiita | -- ←作成完了
| sys                   |
+-----------------------+

创建一个表并添加数据。

mysql> use spring_todolist_qiita;

mysql> create table if not exists todolist (
  id integer not null auto_increment,
  content text not null,
  done boolean not null default 0,
  primary key (id)
);

我会创建一些数据。

mysql> insert into todolist (content) values ("卵を買う");
--以下略--

2. 使用SpringBoot来定义MySQL的信息

在 application.properties 中添加配置,以连接到 MySQL 数据库。

# 接続先のDB名を設定
spring.datasource.url=jdbc:mysql://localhost/spring_todolist_qiita

# 接続しているDBの username と passwordを設定
# 〇〇と△△はご自身のusername,passwordを記載してください
spring.datasource.username=〇〇
spring.datasource.password=△△

# MySQL用JDBCドライバの設定
spring.datasource.driverClassName=com.mysql.cj.jdbc.Driver

当你再次在终端输入”mvn spring-boot:run”时,将会启动。

SpringBoot和MySQL之间的实现交互

在与TodolistApplication.java相同的层级下创建每个文件夹,并逐步实现它们的内容。

スクリーンショット 2021-03-13 10.53.56.png

1. 创建实体模型

使用@Entity注解来声明实体类,并将其映射到数据库表。

@Table(name = “todolist”) 用于指定实体类与数据库表的映射关系,指定了数据库表的表名为 “todolist”。

@Id是用来声明一个实体类字段为主键,而@GeneratedValue(strategy = GenerationType.IDENTITY)是用来声明主键自动递增的。

package com.example.todolist.Model;

import javax.persistence.Entity;
import javax.persistence.GeneratedValue;
import javax.persistence.GenerationType;
import javax.persistence.Id;
import javax.persistence.Table;

import lombok.Data;

// データを格納するクラス(DBへ登録、更新時の入れ物)
@Entity
@Data
@Table(name = "todolist")
public class Todo {
  @Id
  @GeneratedValue(strategy = GenerationType.IDENTITY)
  private Integer id;

  private String content;

  private boolean done;
}

创建用于访问数据库的仓库。

创建一个继承自JpaRepository接口的接口,其中定义了从数据库中获取值、更新等方法。

在@Repository注解中声明为数据库访问类,并注册到依赖注入容器中。

package com.example.todolist.Repository;

import org.springframework.stereotype.Repository;
import org.springframework.data.jpa.repository.JpaRepository;
import com.example.todolist.Model.Todo;

// DBにアクセスするためのインターフェース
@Repository
public interface TodoRepository extends JpaRepository<Todo, Integer> {
}

3. 创建一个执行具体处理任务的服务。

使用@Service注解声明该类为服务类,并在DI容器中进行注册。

@ Autowired将生成并返回已在DI容器中注册的TodoRepository实例。

package com.example.todolist.Service;

import java.util.List;

import com.example.todolist.Model.Todo;
import com.example.todolist.Repository.TodoRepository;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

// DBとの具体的な処理(データの取得、新規作成など)を記述するクラス
@Service
public class TodoService {

  @Autowired
  TodoRepository todoRepository;

  // todolistを全件取得
  public List<Todo> searchAll() {
    return todoRepository.findAll();
  }
}

将获取的数据显示在屏幕上

准备一个控制器,从数据库中获取数据并发送到视图,使其在屏幕上显示。

创建控制器

使用@Controller注解来声明一个控制器类。

使用@Autowired注解,它会帮我们在DI容器中创建并返回已注册的TodoService实例。

package com.example.todolist.Controller;

import java.util.List;

import com.example.todolist.Model.Todo;
import com.example.todolist.Service.TodoService;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;


@Controller
public class TodoController {

  @Autowired
  TodoService todoService;

  @GetMapping("/")
  public String home(Model model) {
    List<Todo> allTodo = todoService.searchAll();
    model.addAttribute("allTodo", allTodo);
    return "home";
  }
}

当访问 localhost:8080 上的 @GetMapping(“/”) 时,将调用 home 方法。

在todoService的serarchAll方法中,从数据库检索所有数据,并通过model.addAttribute将Java对象传递给View。

创建HTML文件

由于上述Controller中的返回值为”home”,因此需要创建home.html文件。

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  <title>SpringTodoList</title>
</head>
<body>
  <div th:each="todo : ${allTodo}">
    <p th:text="${todo.content}"></p>
  </div>
</body>

</html>

由控制器传递来的allTodo是一个List类型,
通过循环”th:each=”todo : ${allTodo}”,将每个todo逐个存储数据。

用 todo.content 绘制 content。

SpringBoot的启动

我将检查MySQL数据库的数据是否在屏幕上显示。

$ mvn spring-boot:run

当尝试访问localhost:8080时…

スクリーンショット 2021-03-13 11.27.00.png

被宣布没有问题发生。

结束

由于没有CSS编写,所以这个页面缺乏美观,但是我成功地将SpringBoot和MySQL连接起来,显示了数据。

请亲自在您自己的环境中尝试一下。

我想尝试实现新用户注册。

广告
将在 10 秒后关闭
bannerAds