Olá, adaptei um pouco o código original e anteriormente estava funcionando, mas agora a página não envia a requisição GET para obtenção dos dados automaticamente. É como se nem entrasse no arquivo main.js, quando insiro manualmente o endereço "/distancia", aí sim entra no GET mas em outra página. Segue em anexo os códigos main.js, e form.html
$(function() {
var divMensagem = $("#distancia");
var divMensagem = $("#temperatura");
var divMensagem = $("#humidade");
//cada botao terá um evento click para enviar uma requisicao
$("button").click(function(){
var comando = $(this).val();
enviaPostAjax(comando);
});
//funcao da requisiciao ajax
function enviaPostAjax(comando) {
$.post("/", {'comando': comando}, function() {
console.log("Comando " + comando + " enviado com sucesso!")
});
}
//eventos das teclas
$(document).keydown(function(event){
if(event.key == "w"){
// Teclou W
enviaPostAjax("w");
}
else if(event.key == "s"){
// Teclou S
enviaPostAjax("s");
}
else if(event.key == "a"){
// Teclou A
enviaPostAjax("a");
}
else if(event.key == "d"){
// Teclou D
enviaPostAjax("d");
}
else if(event.key == "q"){
// Teclou Q
enviaPostAjax("q");
}
//enviando a cada 2s uma requisicao para pegar o valor da humidade
setInterval(function() {
$.get('/temperatura',function(answer)
{
$("#temperatura").text(answer);
})
}, 2000);//2s
setInterval(function() {
$.get('/distancia',function(resposta)
{
$("#distancia").text(resposta);
})
}, 2000);//2s
setInterval(function() {
$.get('/humidade',function(resultado)
{
$("#humidade").text(resultado);
})
}, 2000);//2s
});
<!doctype html>
<html>
<head>
<title>Controle web Pibot</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="{{url_for('static', filename='css/bootstrap.css') }}">
<link rel="stylesheet" href="{{url_for('static', filename='css/estilo.css') }}">
</head>
<body class="jumbotron">
<div class="page-header text-center">
<img id="imagem" src="{{url_for('static', filename='img/temperatura4.png') }}">
<h1>Dados do ambiente</h1>
</div>
<div class="container">
<!--<img src="http://192.168.0.6:8080/?action=stream">-->
<p> Temperatura: <span id="temperatura"></span> ºC </p>
<p> Humidade: <span id="humidade"></span> % </p>
<p> Distância: <span id="distancia"></span> cm </p>
</div>
<div class="container">
<button value="w" id="w">
<span class="glyphicon glyphicon-triangle-top" aria-hidden="true"></span>
</button>
<button value="s" id="s">
<span class="glyphicon glyphicon-triangle-bottom" aria-hidden="true"></span>
</button>
<button value="a" id="a">
<span class="glyphicon glyphicon-triangle-left" aria-hidden="true"></span>
</button>
<button value="d" id="d">
<span class="glyphicon glyphicon-triangle-right" aria-hidden="true"></span>
</button>
<button value="q" id="q">
<span class="glyphicon glyphicon-stop" aria-hidden="true"></span>
</button>
</div>
<script src="{{url_for('static', filename='js/jquery-3.1.1.min.js') }}"></script>
<script src="{{url_for('static', filename='js/main.js') }}"></script>
</body>
</html>
Recebo também as seguintes informações no terminal LX:
192.168.0.4 - - [24/Jan/2020 13:26:58] "GET / HTTP/1.1" 200 - 192.168.0.4 - - [24/Jan/2020 13:26:58] "GET /static/css/bootstrap.css HTTP/1.1" 304 - 192.168.0.4 - - [24/Jan/2020 13:26:58] "GET /static/css/estilo.css HTTP/1.1" 304 - 192.168.0.4 - - [24/Jan/2020 13:26:58] "GET /static/img/temperatura4.png HTTP/1.1" 304 - 192.168.0.4 - - [24/Jan/2020 13:26:58] "GET /static/js/jquery-3.1.1.min.js HTTP/1.1" 304 - 192.168.0.4 - - [24/Jan/2020 13:26:58] "GET /static/js/main.js HTTP/1.1" 200 - 192.168.0.4 - - [24/Jan/2020 13:26:59] "GET /static/fonts/glyphicons-halflings-regular.woff2 HTTP/1.1" 304 -