ukryj menu
SPEC
aktualizacja: 2022-04-29 09:55:15
1. serwer Spark jak na poprzednich zajęciach
obsługujący poniższe post-y
post("/add", ...)
get("/json", ...)
post("/delete", ...)
post("/update", ...)kopiuj
- dwie strony html: index.html i cars.html
- NIE ma formularza, komunikacja klient - serwer za pomocą fetcha
2. UUID
unikalne id samochodu
https://en.wikipedia.org/wiki/Universally_unique_identifier
<dependency>
<groupId>com.fasterxml.uuid</groupId>
<artifactId>java-uuid-generator</artifactId>
<version>4.0.1</version>
</dependency>kopiuj
java
UUID uuid = Generators.randomBasedGenerator().generate();kopiuj
dokumentacja
https://github.com/cowtowncoder/java-uuid-generator
3. post
pobranie danych z body
System.out.println(req.body());kopiuj
konwersja danych json na obiekt dowolnej klasy
MyClass myClass = gson.fromJson(req.body(), MyClass.class);kopiuj
pobranie jednej wartości z body, przy założeniu, że w klasie MyClass jest przykładowy getter getModel()
String model = gson.fromJson(req.body(), MyClass.class).getModel();kopiuj
4. async fetch
można pracować na fetchu jak dotychczas (then, catch) ale nowocześniej jest jak poniżej (async/await)
fetchPostAsync = async () => {
const data = JSON.stringify({
a:1,
b:2
})
const options = {
method: "POST",
body: data,
};
let response = await fetch("/add", options)
if (!response.ok)
return response.status
else
return await response.json() // response.json
}
kopiuj
i wywołanie przy kliku buttona
document.getElementById("bt").onclick = async () => {
let json = await fetchPostAsync()
console.log(json)
}kopiuj
oczywiście dane z serwera zwracamy z nagłówkiem jsona
res.type("application/json");
return gson.toJson(dane);kopiuj
5. złożone dane json
do wysłania czterech wartości z checkboxów użyjemy:
a) na kliencie
tablicy obiektów w postaci jak poniżej
data: [
{a: "aaa", b: false},
{a: "bbb", b: true},
...
...
]kopiuj
b) na serwerze
ArrayList typu klasy przechowującej dwie dane, np
class Airbag {
String a;
boolean b;
}kopiuj
czyli będzie to ArrayList<Airbag>