・はじめに
この記事ではCRUD操作のデータを登録するCreate操作についてのやり方について書いていきます。SQLとのやり取りを簡単にするためにMy Batisを使用します。また、データクラスの記述を省略するためにLombokを使用しています。今回は読んだ本を登録するという機能のページを作っていきます。
~用意するクラス~
・ControllerクラスVIEWとModelを扱うServiceクラスとやり取りして必要な情報を取り出す司令塔的役割のクラス。
・データクラス
使いたいデータのクラス。ログイン処理を行いたいのならログインに必要なデータ、例えばIDやパスワードを設定する。 LomBokの@DataをつけることによってSetterとGetterの文を省略します。
・Serviceクラス
Modelとやり取りするクラス。SQLとやり取りしてデータの登録、取り出し、更新、削除を行わせるクラス。
・Mapperクラス
My Batisを導入すると使えるもの。@Mapperを付けたクラスではSQLの操作をすることができ、メソッドに@Select, @Insert, @Update, @Deleteをつけることによって簡単にデータの登録、取り出し、更新、削除がでできます。
・SQLの設定
Springではschema.sql
でSQLのテーブルを作ることができます。事前にデータを入れたい場合はdata.sql
で設定できます。
・HTMLファイル
見た目に当たるものです。今回は簡単に作ります。
・事前準備
あらかじめ行わなければならないことはSQLの設定です。SQLのテーブルを作り、そこに本のデータを登録します。今回はID、本の名前、出版社を設定します。IDはユーザーが決めるのでなく、自動的に登録されるようにします。そのため、自動的に数字を登録してくれるAUTO_INCREMENTを入れます。そして主キー設定であるPRIMARY KEYも設定します。
テーブルはschema.sql
にSQL文を書くことによって作ることができます。
DROP TABLE IF EXISTS Book;
CREATE TABLE Book (
bookId INTEGER PRIMARY KEY AUTO_INCREMENT,
book_name VARCHAR(255),
publisher VARCHAR(255)
);
・コードを書いていく
・HTMLファイルの設定
今回のHTMLファイルは簡単なものにします。必要なページはアカウント登録の情報を入れてもらうフォーム形式にします。HTMLファイルの名前は`torokuHTML`にします。Thymeleafの連携のために htmlタグの中にxmlns:th="http://www.thymeleaf.org
を入れます。これでThymeleafとの連携が可能です。そしてThymeleafの機能を使うためには、前にthを付けることによって使うことができます。例えばリンクを貼りたい場合はth:hrefです。そしてリンク先をコントローラーで設定したリンクにしたい場合は@{ }の中にリンクを書くとそこに飛ぶようにできます。
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head> ~省略~ </head>
<body>
<h3>会員登録ページ</h3>
<form th:action="@{/toroku/create}" th:method="@{post}">
<label>本の名前:</label>
<input type="text" name="book_name" /><br>
<label>出版社:</label>
<input type="text" name="publisher" /><br>
<button type="submit">登録</button>
</form>
</body>
</html>
・Controllerクラスの設定
次に、Controllerクラスの設定をします。今回は会員登録をするので/toroku
というページに飛ぶと、登録フォームのページがででくる設定にします。さらに/toroku/create
はサービスを呼び出し、入力された情報をSQLに登録するものにします。
@Autowired
BookService bookService;
@RequestMapping("/toroku")
public String torokuPage() {
return "torokuHTML";
}
@PostMapping("/toroku/create")
public String toroku(Book book) {
//後で設定するサービスクラス
bookService.insertBookService(book);
return "redirect:/toroku";
}
}
これで/toroku
にいくと、torokuHTMLのページが表示されるようになります。
・データクラスの設定
次に、データクラスの設定を行います。今回は本のID
と本の名前
と出版社
を設定します。
@Data
public class Book {
private int bookId;
private String book_name;
private String publisher;
}
データクラスはこれで完成です。
・Mapperクラス
次に、Mapperクラスの設定を行います。今回はCreate編なので@Insertをしていきます。My Batisの@Mapperはインターフェースにつけます。そしてメソッドに使いたいSQL文(Select, Insert, Update, Delete)のアノテーションを入れて使っていきます。アノテーションのあとにかぎかっこを付けて、そこにSQL文を書きます。値を#{データ名}にするとパラメータになり、受け取った値を操作してくれるようになります。
@Mapper
public interface BookMapper{
@Insert("INSERT INTO Book(book_name, publisher) VALUES(#{book_name}, #{publisher})")
void insertBookInfo(Book book);
}
・Serviceクラス
最後にServiceクラスを作っていきます。ここにはしてほしい処理を書いていきます。Controllerクラスが全体の司令塔なら、Serviceクラスは処理の司令塔兼実際に処理を行うクラスです。クラス宣言の前に@Serviceを入れます。クラス又はメソッドに@Transactionalを入れると、トランザクション処理をさせることもできます。@Autowiredは、Beanを呼び込むアノテーションです。簡単に言うとnewせずにインスタンスを呼ぶことができるものです。
@Service
public class BookService {
@Autowired
BookMapper bookMapper;
public void insertBookService(Book book) {
bookMapper.insertBookInfo(book);
}
}
これで完成です!
・確認
・ページに飛んでみる
それでは実際に起動して入力した値がきちんとSQLに登録されているかを見ていきましょう!まずは、/torokuに接続すると、
このようなページが表示されます。(見やすいようにCSSを適用しています)
実際に入れて登録を押すと、入力した文字が消えます。こうなるともうすでに完了しています。試しに何個か入れてみましょう。
・SQLの確認
このwebページ上では、実際にSQLにデータが登録されているかどうかがわかりません。今の状態ではWeb上で確認することができないので、今回は実際にコマンドプロンプトで確認してみます。すると、Web上で入力したデータがしっかりとSQLに登録されていることを確認できました!
これで完成です。お疲れさまでした!