[RESOLVIDO] Esp32 WebServer - Como receber/enviar valores?

Olá a todos.

Após ver a possibilidade da criação de uma página html com o OTA, através dos exemplos para esp32 (Exemplos -> Arduino OTA -> OtaWebUpdater), fiquei com vontade de fazer uma pequena adição ao meu projeto.

A ideia é muito simples.

1- Tenho um vetor com 12 variáveis (String testando[12]).

2- As strings deverão ser enviadas para o HTML quando este for iniciado.

3- as 12 caixas de texto da html deverão ser atualizadas com o valor da string (Exemplo: JogadoresForm.Jogador1.value = testando[0])

4- Com isso, o usuário pode alterar o valor nas caixas de texto.

5- Caso seja pressionado um botão no HTML , esses 12 valores irão retornar para o Esp32 e irá atualizar as 12 strings.

Anteriormente, eu mexi mais no código, mas me frustrei tanto com isso, que acabei excluindo.

Na ino que segue, eu apenas adicionei 2 novas páginas e "ajustei" para definir a primeira.

A transição funciona, mas eu não faço IDEIA do de como proceder para enviar/obter esses valores.

Alguém poderia me oferecer um norte?

Exibições: 1554

Anexos

Responder esta

Respostas a este tópico

Comecei a pesquisar sobre o "elegantOta", parece ser promissor.

Em breve trago atualizações.

Bom dia Tiago, 

Recomendo esse site:

https://randomnerdtutorials.com/?s=esp32+web+server

Olá José, irei verificar os tutoriais. Obrigado pela referência.

Boa tarde.

TM, você conhece esta lib para o ESP32:  Preferences.h?

Tutorial.  https://randomnerdtutorials.com/esp32-save-data-permanently-prefere...

RV mineirim

Olá RV. Não conhecia, parece ser bem interessante! Irei testa-la!

só para deixar registrado. Chutei o balde. 

Bom dia.

Desistiu porque?

Carreguei seu code aqui em um ESP32 e testei.

Na 1a. tela cliquei em definir jogadores e dei enter.

Veio outra tela para colocar o nome dos jogadores.

Deixei como está lá e cliquei em FINALIZAR,

volta na mesma tela.

RV mineirin

Olá RV. ontem (ou ante-ontem) acabei achando um tutorial legal. E depois de olhar vários, consegui entender "alguma coisa" sobre como obter os dados.

Sem me aprofundar aos detalhes do código, consegui obter as informações da página.

O site de maior referência foi este: https://medium.com/@xavierprasetyo89/input-data-from-an-html-form-t...

No .rar em anexo, existem 4 arquivos.

1- Esp32_HTML_OTA.ino

2- html_page/index_html.h

3- jog_page/jog_html.h

4- confirm_page/confirm_html.h

O primeiro arquivo é o base.

O segundo arquivo (index_html.h), é o inicial de quando se acessa o esp pelo IP.

O terceiro, é o "X" da questão, é com ele que recebo e "envio" dados.

O quarto é só um aviso bonito, pra depois eu programar algo para reiniciar o esp.

No terceiro arquivo ( jog_html.h ), são criadas 12 TextBox (Linha 85, 90, 95,100, 105, 110, 115, 120, 125, 130, 135, 140), definidas com o nome de "jog 1 a 12", e possuem o "value" definido com o texto "Variavel1 a 12".

A ideia é que o valor ("value") das textbox sejam obtidas através de uma variável global do esp32 ("Esp32_HTML_OTA.ino", linha 13) assim que a pagina (jog_html) abrir.

(Apenas por curiosidade, esta variável global será armazenada no SPIFFS/LittleFS, entretanto, ainda não programei esta etapa. Estou priorizando o funcionamento básico da página primeiro.)

No momento, ao clicar no botão "Confirmar", é possível obter o value de todas as textbox através das linhas 60 á 73 ("Esp32_HTML_OTA.ino"). O resultado é impresso na Serial. Sucesso total.

Entretanto, não faço ideia de como fazer o oposto, isto é, colocar na ".value" da textbox, os valores das variáveis assim que a página abrir.

Para fins de entendimento desta etapa do programa, este deverá ficar assim:

1- Inicia o ESP. 

2- Atualiza a variável global (que será obtida através do SPIFFS/LittleFS/Outro)

3- Inicia o wifi do esp32. 

4- Conecta a uma rede (atualmente, defini o nome da rede como "Tiago" e senha "12345678", mas pode ser alterado nas linhas 8 e 9). 

5- Após conectar, é obtido na serial o IP para o acesso.

6- Ao acessar o IP, você terá acesso ao "index", onde você terá 2 opções:

6.1 1)- "Definir nome dos jogadores", onde será transferido para o "jog_html.h" e terá acesso as textBox 

6.2 2)- "Atualização", onde será lançado para uma pagina do OTA (não anexado) 

7- Ao ingressar no "jog_html", as "TextBox.value" deverão ser preenchidas com os valores das variáveis globais definidas.

8- Agora, o usuário poderá alterar, ou não, os valores das textbox.

9- Ao concluir, deverá pressionar o botão "Confirmar"

10 - os valores (value) das textbox são botidos e irão atualizar os valores da variável global.

11- A página de confirmação é exibida

12- Após isso, a variável armazenada no LittleFS/SPIFFS será atualizada pela recém obtida.

13- O esp reinicia.

Obs1- repetindo, o item "7", atualmente, é meu bicho de "7" cabeças.

Obs2- A etapa 2 e 12 ainda não foram escritas. Serão após solucionar a questão do item 7.

Anexos

Foto 1) a conexão falhou, pois não tinha rede disponível. (esp32-wroom-32u, e está sem antena). Ao abrir o HotSpot em um dispositivo próximo (no meu caso, celular ou notebook), teve conexão e exibiu o IP.


Foto 2) Após adicionar o IP no navegador, a página (index_html.h) é exibida. (obs- o segundo item, dará erro, pois não anexei ao código)

Foto 3) Após clicar, na foto 2, em "definir nome dos jogadores", é transferido para a pagina "jog_html.h", onde é possível ver as 12 textbox e o botão "confirmar". 

Foto 4) Após clicar em confirmar, os dados são processados e exibidos na serial.

O que falta, agora, é ser capaz de atualizar os valores das textbox, com a variável global, assim que a página é aberta.

TM, testa ai.

Esp32_HTML_OTA.zip

RV mineirin

Problema 100% resolvido! Obrigado RV!

Ficou perfeito!

RSS

© 2024   Criado por Marcelo Rodrigues.   Ativado por

Badges  |  Relatar um incidente  |  Termos de serviço