Hallo, mein Name ist @ Ikuto19, ein Student, der Programmieren studiert. Dieses Mal beginne ich mit Fortsetzung vom letzten Mal (Teil 2).
In Teil 2 haben wir die Erstellungsschritte 1 bis 3 ausgeführt. Dieses Mal werde ich zwei der Erstellungsschritte 4-5 ausführen. Das Folgende muss dieses Mal neu erstellt (rot) oder geändert (blau) werden.
Wir werden einen Mechanismus implementieren, um den Bildschirm von index.html, dem Startbildschirm, zu operatorCollate.html zu überführen, das registriert und löscht.
OperateController.java Zeigen Sie operatorCollate.html an, das der URL entspricht. Zu diesem Zeitpunkt wird der aus dem Textfeld auf der Seite index.html eingegebene ISBN-Code vom Typ Zeichenfolge mit einer Klasse namens ModelMap an operatorCollate.html übergeben. Geben Sie den Variablennamen in das erste Argument und die Zeichenfolge ein, die Sie in das zweite Argument übergeben möchten. Ich persönlich denke, dass die Variablennamen hier einheitlich sein sollten.
OperateController.java
package com.app.controller;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.ui.ModelMap;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
@Controller
public class OperateController {
@GetMapping("/index")
public String getIndexPage(Model model) {
return "index";
}
//Methode zum Hinzufügen unten
@RequestMapping("/operateCollate")
public String operateCollate(ModelMap modelMap, @RequestParam("isbn") String isbn) {
modelMap.addAttribute("isbn", isbn);
return "operateCollate";
}
}
noImage.png Hier herunterladen Ändern Sie es nach dem Herunterladen in "noImage.png ".
bookInfo.js Das Programm dieser Person wurde entsprechend dem Zweck dieser Zeit geändert. Informationen zur Biografie mithilfe von ISBN als Schlüssel mit der API von openBD (mithilfe von jQuery) abrufen
Basierend auf dem eingegebenen ISBN-Code werden die Buchinformationen im JSON-Format erfasst, und diesmal werden nur die folgenden Informationen erfasst. Wenn keine Titel- / Herausgeber- / Autoreninformationen vorhanden sind, wird "Keine" gespeichert, und wenn kein Deckblatt vorhanden ist, wird die URL der PNG-Datei mit der Aufschrift "Kein Bild" gespeichert.
bookInfo.js
$(function () {
const isbn = $("#isbn").val();
const url = "https://api.openbd.jp/v1/get?isbn=" + isbn;
$.getJSON(url, function (data) {
var title = 'Keiner';
var publisher = 'Keiner';
var author = 'Keiner';
var thumbnail = '../images/noImage.png';
if (data[0] != null) {
if (data[0].summary.cover == "") {
$("#thumbnail_image").html('<img src=\"' + thumbnail + '\" style=\"border:solid 1px #000000\" />');
} else {
$("#thumbnail_image").html('<img src=\"' + data[0].summary.cover + '\" style=\"border:solid 1px #000000\" />');
thumbnail = data[0].summary.cover;
}
title = data[0].summary.title;
publisher = data[0].summary.publisher;
author = data[0].summary.author;
}else{
$("#thumbnail_image").html('<img src=\"' + thumbnail + '\" style=\"border:solid 1px #000000\" />');
}
$("#title").val(title);
$("#publisher").val(publisher);
$("#author").val(author);
$("#thumbnail").val(thumbnail);
});
});
operateCollate.html Diese Seite zeigt die erfassten Informationen an und registriert oder löscht sie nach Abschluss der Anfrage zum Buch.
operateCollate.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<script th:src="@{/webjars/jquery/3.1.1/jquery.min.js}"></script>
<script type="text/javascript" src="/js/bookInfo.js"
th:src="@{/js/bookInfo.js}"></script>
<meta charset="UTF-8">
<title>Buchverwaltungs-App</title>
</head>
<body>
<div class="main_containerCollate background">
<form method="get" action="regist">
<div class="flexbox">
<div class="">
<div class="info">
ISBN:<input id="isbn" class="texts" type="text" name="isbn" th:value="${isbn}"
autofocus>
</div>
<div class="info">
Buchtitel:<input id="title" class="texts" type="text" name="title" value="">
</div>
<div class="info">
der Herausgeber:<input id="publisher" class="texts" type="text" name="publisher" value="">
</div>
<div class="info">
Autor:<input id="author" class="texts" type="text" name="author" value="">
</div>
</div>
<div class="">
<p id="thumbnail_image"></p>
<input hidden id="thumbnail" type="text" name="thumbnail" value="">
</div>
</div>
<div class="info">
<p>Für die oben genannten Bücher wählen Sie bitte unten.</p>
<button type="submit" class="submit">Anmeldung</button>
<button type="submit" class="submit" formaction="delete">Löschen</button>
</div>
</form>
<div class="link">
<a href="/index">Rückkehr</a>
</div>
</div>
</body>
</html>
pom.xml Fügen Sie die folgende Abhängigkeit hinzu. Eine Bibliothek zur Verwendung von jQuery.
pom.xml
<dependency>
<groupId>org.webjars</groupId>
<artifactId>jquery</artifactId>
<version>3.1.1</version>
</dependency>
OperateController.java Fügen Sie OperateController.java die folgenden Feldvariablen und Methoden hinzu
Die erfassten Informationen werden im ISBN-Objekt festgelegt, und die anzuzeigende Nachricht wird mithilfe der DatabaseClass-Klasse erfasst.
OperateController.java
package com.app.controller;
import java.sql.SQLException;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.ui.ModelMap;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import com.app.database.DatabaseClass;
import com.app.entity.ISBN;
import com.app.repository.ISBNRepository;
@Controller
public class OperateController {
@Autowired
ISBNRepository isbnRepository;
@RequestMapping("/operateCollate")
public String operateCollate(ModelMap modelMap, @RequestParam("isbn") String isbn) {
modelMap.addAttribute("isbn", isbn);
return "operateCollate";
}
@RequestMapping("regist")
public String regist(ModelMap modelMap, @RequestParam("isbn") String isbn,
@RequestParam("title") String title, @RequestParam("publisher") String publisher,
@RequestParam("author") String author, @RequestParam("thumbnail") String thumbnail) throws SQLException {
ISBN isbnInfo = new ISBN();
isbnInfo.setIsbn(isbn);
isbnInfo.setTitle(title);
isbnInfo.setPublisher(publisher);
isbnInfo.setAuthor(author);
isbnInfo.setThumbnail(thumbnail.replace("https://cover.openbd.jp/", ""));
DatabaseClass dc = new DatabaseClass(isbnRepository.findAll());
String message = dc.registDB(isbnInfo,isbnRepository);
modelMap.addAttribute("message",message);
return "regist";
}
@RequestMapping("delete")
public String delete(ModelMap modelMap, @RequestParam("isbn") String isbn,
@RequestParam("title") String title, @RequestParam("publisher") String publisher,
@RequestParam("author") String author, @RequestParam("thumbnail") String thumbnail) throws SQLException {
ISBN isbnInfo = new ISBN();
isbnInfo.setIsbn(isbn);
isbnInfo.setTitle(title);
isbnInfo.setPublisher(publisher);
isbnInfo.setAuthor(author);
isbnInfo.setThumbnail(thumbnail.replace("https://cover.openbd.jp/", ""));
DatabaseClass dc = new DatabaseClass(isbnRepository.findAll());
String message = dc.deleteDB(isbnInfo,isbnRepository);
modelMap.addAttribute("message",message);
return "delete";
}
}
DatabaseClass.java Eine Klasse, die Datentypen verarbeitet und Nachrichten generiert, die sich je nach Situation ändern.
DatabaseClass.java
package com.app.database;
(Weglassen der Einfuhranweisung)
public class DatabaseClass {
private List<ISBN> manageBookDB;
public DatabaseClass(List<ISBN> manageBookDB) {
this.manageBookDB = manageBookDB;
}
public String registDB(ISBN isbnInfo, ISBNRepository isbnRepository) throws SQLException {
String message = null;
if(isbnInfo.getTitle().equals("Keiner") || isbnInfo.getPublisher().equals("Keiner") || isbnInfo.getAuthor().equals("Keiner")){
message = "Ich konnte mich nicht registrieren, weil ich die Buchinformationen nicht erhalten konnte.";
}else if(convertStrings(manageBookDB).contains(isbnInfo.getIsbn())) {
message = "Bereits in der Datenbank.";
} else {
message = "Neu in der Datenbank registriert.";
isbnRepository.save(isbnInfo);
}
return message;
}
public String deleteDB(ISBN isbnInfo, ISBNRepository isbnRepository) throws SQLException {
String message = null;
if(convertStrings(manageBookDB).contains(isbnInfo.getIsbn())) {
message = "Aus der Datenbank gelöscht.";
isbnRepository.delete(isbnInfo);
}else {
message = "Existiert nicht in der Datenbank.";
}
return message;
}
public List<String> convertStrings(List<ISBN> manageBook){
List<String> isbnList = new ArrayList<String>();
for(ISBN isbn:manageBook) {
isbnList.add(isbn.getIsbn());
}
return isbnList;
}
}
ISBN.java Gleiche Entitätsklasse wie LoginUser.java.
ISBN.java
package com.app.entity;
import javax.persistence.Column;
import javax.persistence.Entity;
import javax.persistence.Id;
import javax.persistence.Table;
@Entity
@Table(name = "isbn_code")
public class ISBN {
@Id
@Column(name = "isbn")
private String isbn;
@Column(name = "title")
private String title;
@Column(name = "publisher")
private String publisher;
@Column(name = "author")
private String author;
@Column(name = "thumbnail")
private String thumbnail;
public String getIsbn() {
return isbn;
}
public void setIsbn(String isbn) {
this.isbn = isbn;
}
public String getTitle() {
return title;
}
public void setTitle(String title) {
this.title = title;
}
public String getPublisher() {
return publisher;
}
public void setPublisher(String publisher) {
this.publisher = publisher;
}
public String getAuthor() {
return author;
}
public void setAuthor(String author) {
this.author = author;
}
public String getThumbnail() {
return thumbnail;
}
public void setThumbnail(String thumbnail) {
this.thumbnail = thumbnail;
}
}
ISBNRepository.java
ISBNRepository.java
package com.app.repository;
import org.springframework.data.jpa.repository.JpaRepository;
import org.springframework.stereotype.Repository;
import com.app.entity.ISBN;
@Repository
public interface ISBNRepository extends JpaRepository<ISBN, String>{}
delete.html Die zu löschende Seite.
html.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Seite löschen</title>
</head>
<body>
<div class="main_container do">
<div class=title>
<h1>Buch löschen</h1>
</div>
<div class="message">
<p th:text="${message}"></p>
</div>
<div>
<a href="index">Rückkehr</a>
</div>
</div>
</body>
</html>
regist.html Die zu registrierende Seite.
regist.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Registrierungsseite</title>
</head>
<body>
<div class="main_container do">
<div class=title>
<h1>Buchregistrierung</h1>
</div>
<div class="message">
<p th:text="${message}"></p>
</div>
<div>
<a href="index">Rückkehr</a>
</div>
</div>
</body>
</html>
Erstellen Sie mit dem folgenden Befehl eine Tabelle zum Speichern von Buchinformationen. Der Tabellenname sollte mit 〇〇 von `@ Table (name =" ○○ ")`
der Entitätsklasse ISBN.java identisch sein. Dieses Mal habe ich den Tabellennamen isbn_code gewählt.
$ mysql -u (MySQL-Benutzername) -p
Enter password: (MySQL-Passwort)
mysql> use manageBook
mysql> create table isbn_code(,isbn varchar(256),title varchar(256),publisher varchar(256),author varchar(256),thumbnail varchar(256));
Geben Sie nach dem Zugriff auf http: // localhost: 8080 / login den zuvor festgelegten Anmeldenamen und das Kennwort ein. Wenn Sie den ISBN-Code eingeben und die Registrierungs- oder Löschtaste drücken, können Sie sich registrieren oder aus der Datenbank löschen. Verwenden Sie den folgenden Befehl, um die Datenbank zu überprüfen.
$ mysql -u (MySQL-Benutzername) -p
Enter password: (MySQL-Passwort)
mysql> create database manageBook;
mysql> use manageBook
mysql> select * from isbn_code;
Das ist alles für diese Zeit. Ich habe es dieses Mal als letztes geschrieben, aber ich habe es geteilt, weil es lang zu sein scheint. Das nächste Mal ist wirklich das letzte Mal, und ich werde den Rest erledigen (Heroku-Einstellungen, Bereitstellung usw.).
Weiter zum nächsten Mal (Teilfinale)> Bald veröffentlichen
Recommended Posts