65 lines
No EOL
2.4 KiB
HTML
65 lines
No EOL
2.4 KiB
HTML
---
|
|
pageTitle: "Demonstração da API do Prof. Rodrigo Ribeiro"
|
|
---
|
|
|
|
<div style="display: flex; gap: 1em; flex-direction: column;">
|
|
<h1>{{pageTitle}}</h1>
|
|
<div style="display: flex; flex-direction: column; gap: .6em;">
|
|
<input type="text" id="username" placeholder="E-mail">
|
|
<input type="text" id="password" placeholder="Senha">
|
|
<div>
|
|
<button id="submit">Logar</button>
|
|
<button id="submitb">Criar Usuário</button>
|
|
</div>
|
|
</div>
|
|
<div id="token">Token: Ausente</div>
|
|
</div>
|
|
<script>
|
|
const usernameInput = document.getElementById('username');
|
|
const passwordInput = document.getElementById('password');
|
|
const tokenLabel = document.getElementById('token');
|
|
const submitButton = document.getElementById('submit');
|
|
const cuButton = document.getElementById('submitb');
|
|
|
|
let token = '';
|
|
|
|
async function api(endpoint, data) {
|
|
const info = {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'Authorization': `Bearer ${token}`
|
|
},
|
|
body: JSON.stringify(data),
|
|
}
|
|
let res = await fetch(`https://api.rodrigoribeiro.net/${endpoint}`, info);
|
|
res = await res.json()
|
|
console.log(res)
|
|
return res;
|
|
}
|
|
|
|
function login(username, password, createAccount = false) {
|
|
return api(createAccount ? "registrar" : "login", { email: username, senha: password });
|
|
}
|
|
|
|
submitButton.addEventListener('click', async () => {
|
|
if (!usernameInput.value && !passwordInput.value) {
|
|
alert("Preencha os campos necessários.")
|
|
return;
|
|
}
|
|
res = await login(usernameInput.value, passwordInput.value);
|
|
const is_logged = (res.status_code == 200);
|
|
if (is_logged) token = res.response.token;
|
|
tokenLabel.innerHTML = `Token: ${is_logged ? 'Presente' : 'Ausente (erro de autenticação)'}`;
|
|
})
|
|
|
|
cuButton.addEventListener('click', async () => {
|
|
if (!usernameInput.value && !passwordInput.value) {
|
|
alert("Preencha os campos necessários.")
|
|
return;
|
|
}
|
|
res = await login(usernameInput.value, passwordInput.value, true);
|
|
const is_logged = (res.status_code == 201);
|
|
tokenLabel.innerHTML = `Token: ${is_logged ? 'Ausente (conta criada e pronta para logar)' : 'Ausente (erro ao criar usuário)'}`;
|
|
})
|
|
</script> |