61 lines
1.7 KiB
HTML
61 lines
1.7 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<title>Document</title>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<p id="out">Push the button</p>
|
||
|
|
<input id="name"/>
|
||
|
|
<br/>
|
||
|
|
<button onclick="get()">Get</button>
|
||
|
|
<br/>
|
||
|
|
<button onclick="getTest()">Get Test</button>
|
||
|
|
<br/>
|
||
|
|
<button onclick="post()">Post</button>
|
||
|
|
<br/>
|
||
|
|
<button onclick="put()">Put</button>
|
||
|
|
</body>
|
||
|
|
<script>
|
||
|
|
const url = "http://localhost:8080/api";
|
||
|
|
const out = document.getElementById("out");
|
||
|
|
const name = document.getElementById("name");
|
||
|
|
const get = async () => {
|
||
|
|
const res = await fetch(`${url}?name=${name.value}`);
|
||
|
|
const text = await res.text();
|
||
|
|
out.innerText = text;
|
||
|
|
}
|
||
|
|
const getTest = async () => {
|
||
|
|
const res = await fetch(`${url}/test`);
|
||
|
|
const text = await res.text();
|
||
|
|
out.innerText = text;
|
||
|
|
}
|
||
|
|
const post = async () => {
|
||
|
|
if (!name.value) {
|
||
|
|
alert("Name is required");
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
const res = await fetch(url, {
|
||
|
|
method: 'post',
|
||
|
|
headers: {'Content-Type': 'application/json'},
|
||
|
|
body: name.value
|
||
|
|
});
|
||
|
|
const text = await res.text();
|
||
|
|
out.innerText = text;
|
||
|
|
}
|
||
|
|
const put = async () => {
|
||
|
|
if (!name.value) {
|
||
|
|
alert("Name is required");
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
const res = await fetch(`${url}/${name.value}`, {
|
||
|
|
method: 'put',
|
||
|
|
headers: {'Content-Type': 'application/json'},
|
||
|
|
body: name.value
|
||
|
|
});
|
||
|
|
const text = await res.text();
|
||
|
|
out.innerText = text;
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
</html>
|