Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Erro ao realizar POST no objeto negociacao

Caros estou recebendo o erro abaixo ao realizar o POST:

post.html:71 Failed to load file:///negociacoes: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

Segue o código da página:

<!-- aluraframe/client/post.html -->
<html>

<head>
  <meta charset="UTF-8">
  <title>Negociações</title>
  <link rel="stylesheet" href="css/bootstrap.css">
  <link rel="stylesheet" href="css/bootstrap-theme.css">
</head>

<body class="container">
  <form class="form">

    <div class="form-group">
      <label for="data">Data</label>
      <input type="date" id="data" class="form-control" required autofocus/>
    </div>

    <div class="form-group">
      <label for="quantidade">Quantidade</label>
      <input type="number" min="1" step="1" id="quantidade" class="form-control" value="1" required/>
    </div>

    <div class="form-group">
      <label for="valor">Valor</label>
      <input id="valor" type="number" class="form-control" min="0.01" step="0.01" value="0.0" required />
    </div>

    <button class="btn btn-primary" type="submit" onclick="sendPost(event)">Enviar dados para servidor</button>
  </form>

  <!-- aluraframe/client/post.html -->
  <!-- código anterior omitido -->
  <script>
    function sendPost(event) {

      event.preventDefault();

      console.log("Enviando post");

      let $ = document.querySelector.bind(document);
      inputData = $('#data');
      inputQuantidade = $('#quantidade');
      inputValor = $('#valor');

      let negociacao = {
        data: inputData.value,
        quantidade: inputQuantidade.value,
        valor: inputValor.value
      };

      let xhr = new XMLHttpRequest();
      xhr.open("POST", "/negociacoes", true);
      xhr.setRequestHeader("Content-type", "application/json");

      xhr.onreadystatechange = () => {

        if (xhr.readyState == 4) {

          if (xhr.status == 200) {
            inputData.value = '';
            inputQuantidade.value = 1;
            inputValor.value = 0.0;
            inputData.focus();
            alert('Negociação enviada com sucesso');
          } else {
            alert(`Não foi possível enviar a negociação: ${xhr.responseText}`);
          }
        }
      }
      xhr.send(JSON.stringify(negociacao));

    }
  </script>
  <!-- código posterior omitido -->
</body>

</html>

** Caros o erro ocorre pois estou acessando o arquivo via FileSystem em vem de ser o do servidor, acabei comendo bola...

1 resposta
solução!

Meu caro, isso é problema de CORS ( Cross Origin Resources ). Por padrão o navegador não deixa você fazer uma troca de informações que não seja nos protocolos : http, data, chrome, chrome-extension, https.

Parece que você não esta usando um servidor para fazer o ajax, mas o filesystem do seu computador. O ideal é você instalar um servidor como o Node ou o Apache para realizar a solicitação

Na aula você não chega a instalar nada?