script.js

async function login() {
  const urlLogin = "http://137.184.108.252:5000/api/login";

  const options = {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
    },
    body: JSON.stringify({
      email: "324124616@ulife.com.br",
      password: "Kxr5XccRdFIt",
    }),
  };

  const response = await fetch(urlLogin, options); //requisição para o servidor
  const jsonResponse = await response.json();

  if (!response.ok) {
    console.error("Error:", jsonResponse);
    return null;
  } else {
    return (token = jsonResponse.token);
  }
}

async function getCidades() {
  try {
    const token = await login(); //chama método login para obter o token

    let tokenAtual = document.getElementById("token");
    tokenAtual.style.color = "red";
    tokenAtual.innerHTML = token; //exibe o token na tela

    const response = await fetch("http://137.184.108.252:5000/api/cidades", {
      method: "GET",
      headers: {
        "Content-Type": "application/json",
        "Cache-Control": "no-cache",
        Accept: "*/*",
        "Accept-Encoding": "gzip,deflate",
        Connection: "keep-alive",
        "x-access-token": token,
      },
    });

    const cidades = await response.json();

    if (!response.ok) {
      console.error("Error:", cidades);
      return;
    } else {
      const table = document.getElementById("tabela-corpo");

      cidades.forEach((item) => {
        const linha = table.insertRow();
        const coluna1 = linha.insertCell(0);
        const coluna2 = linha.insertCell(1);
        coluna1.innerHTML = item.id;
        coluna2.innerHTML = item.nome;
      });
    }
  } catch (error) {
    console.error("Error fetching data:", error);
  }
}

getCidades(); //chama a função para obter as cidades