LusoRobótica - Robótica em Português

Software => Software e Programação => Tópico iniciado por: KammutierSpule em 30 de Setembro de 2019, 23:41

Título: tecnologias web para servidor num MCU
Enviado por: KammutierSpule em 30 de Setembro de 2019, 23:41
Quero criar paginas web, que irao correr num servidor baseado em MCU (memoria muito limitada)
As paginas sao essencialmente formularios de edicao, checkboxs e outros modos de configuraçao; tabelas com valores, icons de estados com uma actualizacao regular.

Actualmente tenho testado tecnicas de POST e CGI. Gostava de avaliar outro tipo de abordagens.
Alguem sugere que tecnicas e metodos web possam ser aplicadas?
EDIT: estou a referir-me à contrucao de paginas HTML + JS. Eventualmente usar bibliotecas JS para facilitar o desenvolvimento.
Título: Re: tecnologias web para servidor num MCU
Enviado por: vasco em 01 de Outubro de 2019, 10:58
Acho que o CGI não se aplica a um MCU, a não ser que seja uma daquelas cenas que pode ser feito com o micropython. Como o python não é a minha praia nunca explorei isso...

Se te ficares por paginas html+css+js e a executar forms com GETs e POSTs não terás muitos problemas porque todo o processamento do js vai ser no cliente, vais simplesmente ter limitações por causa do tamanho das 'paginas' que podes guardar do lado do mcu.

Agora para fazer coisas 'uteis' tipo criar o ficheiro num sd card com coisas a partir do webserver já me parece um desafio maior. Mas aposto que existem libraries que facilitam esse tipo de coisa.
Título: Re: tecnologias web para servidor num MCU
Enviado por: jm_araujo em 01 de Outubro de 2019, 11:09
Já brinquei um bocado com web no  ESP8266.
As páginas não tem nada que saber, num ESP com 4M de flash normalmente tens 1M para ficheiros (FS SPIFFS), se não abusares das imagens e usares html/css/js comprimido para gzip para as partes estáticas, dá para MUITA coisa.
Para coisas mais pequenas até podes meter servir o HTML diretamente no código.

Quanto à interação, POST ou GET vai dar ao mesmo, tens bibliotecas que te tratam disso. Se forem dados mais dinamicos, também podes dar uma vista de olhos aos Websockets. É tudo suportado.
AJAX não é problema como é do lado do cliente, o servidor basta responder aos POST/GET.

Com "CGI" (é um bocado anacrónico, não? acho que já não é muito usado o termo) vai dar ao mesmo, basta no código responder ao endereço pedido. Não tens é uma aplicação separada, tens de meter tudo no código principal, senão tinhas de ter um SO e por aí fora, e já não estamos a falar de Micros.

Tens bons exemplos junto com as bibiotecas do ESP e pela net, é veres os mesmos.

Edit (escrevi ao mesmo tempo que o Vasco): SD também não é problema nos ESP, funciona lindamente e podes usar para guardar os ficheiros HTML ou gravar dados, é relativamente fácil de usar.



Título: Re: tecnologias web para servidor num MCU
Enviado por: KammutierSpule em 01 de Outubro de 2019, 11:28
Obrigado pelas respostas.

Mais alguns dados:
Eu nao estou a usar ESP, por isso as coisas complicam pela falta de boas bibliotecas com boas licencas :)
Eventualmente tenho apenas <<400KB disponiveis
O CGI era um exemplo de implementacao que ja vinha na biblioteca que estou a usar.

Quanto à interação, POST ou GET vai dar ao mesmo, tens bibliotecas que te tratam disso. Se forem dados mais dinamicos, também podes dar uma vista de olhos aos Websockets. É tudo suportado.
AJAX não é problema como é do lado do cliente, o servidor basta responder aos POST/GET.

Podes-me apontar para algum tutorial exemplo que use essas tecnicas?

o "basta responder" sou eu que tenho que implementar tudo no MCU porque apenas tenho uma funcao que me diz que recebi um GET e nao faz mais nada :)
por isso queria ver que formatos e' que sao usados nesses exemplo, para saber qual a melhor maneira de enviar a informacao para essas bibliotecas JS ou o que for..

Título: Re: tecnologias web para servidor num MCU
Enviado por: jm_araujo em 01 de Outubro de 2019, 12:05
Obrigado pelas respostas.

Mais alguns dados:
Eu nao estou a usar ESP, por isso as coisas complicam pela falta de boas bibliotecas com boas licencas :)
Eventualmente tenho apenas <<400KB disponiveis
O CGI era um exemplo de implementacao que ja vinha na biblioteca que estou a usar.

Quanto à interação, POST ou GET vai dar ao mesmo, tens bibliotecas que te tratam disso. Se forem dados mais dinamicos, também podes dar uma vista de olhos aos Websockets. É tudo suportado.
AJAX não é problema como é do lado do cliente, o servidor basta responder aos POST/GET.

Podes-me apontar para algum tutorial exemplo que use essas tecnicas?
Não tenho nenhum de referência, tinha de procurar.
Mas  o que há a reter é que estas técnicas dependem principalmente do cliente, que é quem interpreta o html e css, e corre o código js. Do lado do servidor só tem de responder a pedidos GET/POST (e o eventualmente processar os dados que vem no pedido).

Também tens Websockets mas é um bocado mais complicado e não me parece que queiras entrar por aí.

Citar
o "basta responder" sou eu que tenho que implementar tudo no MCU porque apenas tenho uma funcao que me diz que recebi um GET e nao faz mais nada :)
por isso queria ver que formatos e' que sao usados nesses exemplo, para saber qual a melhor maneira de enviar a informacao para essas bibliotecas JS ou o que for..
Para mandar informação hoje em dia toda a gente fala JSON, que é muito simples, suportado nativamente no js, e não faltam bibliotecas em todo lado.


Mas se queres ajuda em exemplos mais concretos, diz aí qual o MCU e linguagem/ambiente a ver o que se encontra.
Título: Re: tecnologias web para servidor num MCU
Enviado por: KammutierSpule em 01 de Outubro de 2019, 12:26
Mas  o que há a reter é que estas técnicas dependem principalmente do cliente, que é quem interpreta o html e css, e corre o código js. Do lado do servidor só tem de responder a pedidos GET/POST (e o eventualmente processar os dados que vem no pedido).

Para mandar informação hoje em dia toda a gente fala JSON, que é muito simples, suportado nativamente no js, e não faltam bibliotecas em todo lado.

Mas se queres ajuda em exemplos mais concretos, diz aí qual o MCU e linguagem/ambiente a ver o que se encontra.

O MCU foi so para contextualizar, o meu problema esta na parte do cliente, que e' desconhecido para mim :)
O que eu precisava era de ver exemplo e bibliotecas (client side) usadas para criar este tipo de paginas, para eu proprio criar a webpage e depois implementar o que for necessario no lado do servidor.

o problema e' que nem sei por onde comecar a pesquisa :)
e deve haver imensas coisas, mas queria as que ocupassem menos porque tem de ficar tudo alojado locamente.
Título: Re: tecnologias web para servidor num MCU
Enviado por: vasco em 01 de Outubro de 2019, 13:30
Neste momento não faço ideia do que estas a tentar fazer, estou completamente confuso. 8-)

Pensei que querias por o "servidor" num MCU,agora já dizes que é o cliente, mas afinal o MCU é só para disfarçar... :-) A não ser que estejas a pedir que te façam os TPCs acho que era melhor para todos se dissesses claramente o que estás à procura.
Título: Re: tecnologias web para servidor num MCU
Enviado por: jm_araujo em 01 de Outubro de 2019, 14:48
Sim, também me parece que há alguma confusão. O cliente que falo é o browser, que é quem faz a maior parte do trabalho. É quem interpreta o HTML e CSS para mostrar a página bonitinha, e quem corre o javascript. O servidor (no teu caso o MCU) só envia e recebe "texto" (responder aos GET/POST), o único processamento é se tem de guardar algum dado que o cliente enviou ou dar uma resposta baseada num dado dinâmico.

Olha um exemplo para o ESP que encontrei agora: https://randomnerdtutorials.com/esp8266-web-server-spiffs-nodemcu/

Se conseguires entender, a "complicação" é toda no html, js e css (que é "programação"* web, e tanto faz tratar-se de um MCU como de um PC servidor, ou um alojamento na cloud).
A parte do servidor no  ESP(=MCU) é só esta:
Código: [Seleccione]
// Route for root / web page
  server.on("/", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send(SPIFFS, "/index.html", String(), false, processor);
  });
 
  // Route to load style.css file
  server.on("/style.css", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send(SPIFFS, "/style.css", "text/css");
  });

  // Route to set GPIO to HIGH
  server.on("/on", HTTP_GET, [](AsyncWebServerRequest *request){
    digitalWrite(ledPin, HIGH);   
    request->send(SPIFFS, "/index.html", String(), false, processor);
  });
 
  // Route to set GPIO to LOW
  server.on("/off", HTTP_GET, [](AsyncWebServerRequest *request){
    digitalWrite(ledPin, LOW);   
    request->send(SPIFFS, "/index.html", String(), false, processor);
  });

  server.on("/temperature", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send_P(200, "text/plain", getTemperature().c_str());
  });
 
  server.on("/humidity", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send_P(200, "text/plain", getHumidity().c_str());
  });
 
  server.on("/pressure", HTTP_GET, [](AsyncWebServerRequest *request){
    request->send_P(200, "text/plain", getPressure().c_str());
  });

  // Start server
  server.begin();

Que me parece fácil de ler: para os endereço "/" envia o ficheiro "index.html", para o "/style.css" envia o ficheiro do mesmo nome, para "/on" e "/off" altera o estado de um pino, e para os "/pressure"; "/humidity" e "/temperature" envia os valores desses mesmos sensores.
Isso é tudo que o servidor que está no MCU faz, uma dúzia de linhas e é ao que me referia que "só tem de responder a pedidos GET/POST".

A "secret sauce" está toda no html/css/js que é enviado para o cliente(=browser), que não depende de grande processamento por parte do servidor, mas sim de "programação"* prévia.

A primeira vez que peguei no assunto também me fez grande confusão até entender o que disse no parágrafo anterior. Se a tua dúvida é nessa parte, tens é mesmo de trabalhar nos teus dotes web que o resto é fácil (como acho que o código acima demonstra).

* levam aspas a "programação" web para evitar levantar a velha guerra de que html e css não são linguagens, bla, bla bla  ;)
Título: Re: tecnologias web para servidor num MCU
Enviado por: KammutierSpule em 01 de Outubro de 2019, 14:51
Para esclarecer entao, eu nao preciso de ajuda na parte do servidor / MCU.
O servidor e' implementado num MCU com restricoes de memoria: <<400KBytes Flash e <<100 KBytes RAM.
A parte que eu tenho mais conhecimento e' a do lado do servidor e tenho implementado receber mensagens (POST, GET, etc) mas que nao fazem nada para ja, terao de ser implementadas de alguma maneira. (nem callbacks para nada nem bibliotecas para fazer esse servicos estao feitas)

Agora o que eu nao conheco nada e por isso estou aqui, e' do que existe ou que possa ser usado na parte do cliente. Isto, e dai a contextualizacao, e' necessario ter em conta que as bibliotecas que forem servidas que tem de caber no MCU (por ter de usar ficheiros pequenos).

Quando eu souber o que existe e como se fazem paginas web (client side), entao vou ver que formato mensagens elas pedem ao servidor e implementar no lado do servidor o que for preciso.

Mas tem de ser uma solucao equilibrada do esforco do que e' necessario implementar no lado do servidor e no tamanho dessas bibliotecas ou metodos para criar as paginas.

Título: Re: tecnologias web para servidor num MCU
Enviado por: KammutierSpule em 01 de Outubro de 2019, 15:06
Sim, também me parece que há alguma confusão.

Olha um exemplo para o ESP que encontrei agora: https://randomnerdtutorials.com/esp8266-web-server-spiffs-nodemcu/

Se conseguires entender, a "complicação" é toda no html, js e css (que é "programação"* web, e tanto faz tratar-se de um MCU como de um PC servidor, ou um alojamento na cloud).

Isso é tudo que o servidor que está no MCU faz, uma dúzia de linhas e é ao que me referia que "só tem de responder a pedidos GET/POST".

Nao ha confusao. Eu tenho implementado a parte do servidor HTML e serve paginas, POSTs, GET, etc.
O que eu nao sei nada e' de web development, nao sei criar codigo em JS, nem sabia que havia uma funcao XMLHttpRequest, nao sei o que e' document.getElementById nada :)

Ai nesse exemplo, implementam uma maneira de client e server para 4 parametros.
E se for para 10 ... ou 100 ou 500 seria da mesma maneira ou ha outros metodos?
Existem bibliotecas (client side) que facilitem gerir e aceder a estes parametros? E que formato vao esses pedidos nos GETs?

Título: Re: tecnologias web para servidor num MCU
Enviado por: jm_araujo em 01 de Outubro de 2019, 15:14
Do lado da pagina web tudo depende do que queres fazer, sem dizeres o que é é demasiado genérico para dar uma boa resposta.
Como todas as coisas, é possível a maior simplicidade e a maior complicação. 400k flash se os conteúdos estáticos foram compactados dá para MUITA coisa (a descompactação é feita pelo cliente, pelo que não ocupa recursos no servidor)

Javascript vais muito longe mesmo sem bibliotecas, e é nativo nos browsers.
O normal para ajudar na manipulação das páginas na programação JS é o jquery. A biblioteca básica para por bonito é o Bootstrap.  Ambos os dois tem versões "mini" , e se o cliente tiver aceder ao MCU e tiver acesso à net ao mesmo tempo, podes meter links para os sites que alojam as bibliotecas em vez de meteres as mesmas no MCU: (jquery: https://jquery.com/download/#other-cdns , bootstrap: https://www.bootstrapcdn.com/). E há muitas outras bibliotecas que podes usar da mesma forma.

Nao ha confusao. Eu tenho implementado a parte do servidor HTML e serve paginas, POSTs, GET, etc.
O que eu nao sei nada e' de web development, nao sei criar codigo em JS, nem sabia que havia uma funcao XMLHttpRequest, nao sei o que e' document.getElementById nada :)
OK, está identificado o problema :D. Web não é o meu forte, sei o suficiente para me desenrrascar, mas sou programador StackOverflow (tenho de ter sempre uma página aberta nesse site para saber resolver problemas).

Citar
Ai nesse exemplo, implementam uma maneira de client e server para 4 parametros.
E se for para 10 ... ou 100 ou 500 seria da mesma maneira ou ha outros metodos?
Existem bibliotecas (client side) que facilitem gerir e aceder a estes parametros? E que formato vao esses pedidos nos GETs?
Se tiveres 10..100 ou 500, mudas-te de GET para POST e vão os dados por JSON.
Não precisas de biblitecas extra no cliente, o js  entente JSON nativamente, passa diretamente para um objeto, tratas os dados como uma variavel "normal", e podes passar arrays, strings, numeros, etc.

Título: Re: tecnologias web para servidor num MCU
Enviado por: KammutierSpule em 09 de Outubro de 2019, 12:20
Encontrei este site: http://microjs.com
contem uma lista de micro bibliotecas <5KB de JS.
Em comparacao, o jQuery tem cerca de 87 KB e o bootstrap tem 58 KB (nao vou considerar que tenho acesso externo `a internet)

alguma micro biblioteca dessa lista que possa ser de interesse?


Tambem descobri, que em principio, o conteudo das minhas paginas nao precisa de ser dinamico, isto e' todos os elementos, tamanhos das tabelas sao fixos, so' os valores ou texto podem mudar.

Suponho que para isso possa fazer a pagina fixa em HTML? e de alguma maneira alterar os conteudos por JS.
Alguma biblioteca ou abordagem para facilitar esse trabalho?


Título: Re: tecnologias web para servidor num MCU
Enviado por: jm_araujo em 09 de Outubro de 2019, 14:47
O Jquery compactado fica em menos de 30k e o bootstap em torno a 15k: https://minime.stephan-brumme.com/
Tambem descobri, que em principio, o conteudo das minhas paginas nao precisa de ser dinamico, isto e' todos os elementos, tamanhos das tabelas sao fixos, so' os valores ou texto podem mudar.

Se o texto e valores mudam, por definição é dinâmico ;) Mas entendo o que queres dizer.

Citar
Suponho que para isso possa fazer a pagina fixa em HTML? e de alguma maneira alterar os conteudos por JS.
Alguma biblioteca ou abordagem para facilitar esse trabalho?
JQuery é mesmo o mais habitual, simplifica muito o acesso aos elementos da da página.

Desenvolve a página primeiro num servidor no PC (tipo xampp), é mais simples e aprendes mais rápido.
Ou até mesmo online: https://www.w3schools.com/default.asp
Se fores ao "try it yourself" podes editar e testar o código online. Esse site é muito fixe para aprender.
Também tens outros do género para testar populares, como o https://jsfiddle.net/

Só quando tiveres o que precisas é que te recomendo passares para o micro, e só aí preocupar com o que encolher, e aí compactar se necessário.
Título: Re: tecnologias web para servidor num MCU
Enviado por: Blue_Acid em 11 de Dezembro de 2019, 14:43
Não tenho muito a acrescentar ao que já aqui está escrito, no entanto o site microjs tem muitas bibliotecas giras com objetivos especificos, no entanto algumas funcionalidades começam a estar nativamente nos browsers.

Em relação a aspeto, existem bibliotecas de css (skeleton, vital, purecss) muito pequenas e simples de usar e é preciso ter cuidado porque algumas mais conhecidas tem ficheiros javascript adicionais que são pre-requisitos que não contam para o peso da biblioteca mas tem que existir para esta funcionar.

Por fim, para desenvolver html/css/js não é necessário usar xamp, wamp..., por exemplo se usarem o VSCode para programar existe um extensão o Live Server, fácil e prático.

E já agora obrigado pelo tópico tenho um NodeMCU parado e parece-me que vou ter que fazer umas brincadeiras :-)

Título: Re: tecnologias web para servidor num MCU
Enviado por: KammutierSpule em 11 de Dezembro de 2019, 16:48
Por fim, para desenvolver html/css/js não é necessário usar xamp, wamp..., por exemplo se usarem o VSCode para programar existe um extensão o Live Server, fácil e prático.

E já agora obrigado pelo tópico tenho um NodeMCU parado e parece-me que vou ter que fazer umas brincadeiras :-)

Eu uso o Browser para abrir os HTML, nao é necessario nenhum tipo de servidor pois uso HTML+JS+CSS.
Se calhar o server era necessario para PHP... que nao é este o caso.

Outra coisa que nao sabia e descobri, é que o JS cria listas de objectos que facilmente sao convertidos em JSON etc... facilitando assim a criacao da pagina.
Por isso no MCU ele teve que suportar JSON.

Outra coisa que parece basica mas eu nao sabia, é que as bibliotecas estilo jQuery trazem uma funcao "Ajax" para fazer Get e Post que facilita o desenvolvimento.


Força ai no NodeMCU!
Vi alguns exemplos de paginas feitas para o ESP e como o framework dele é baseado em C++ e tem bibliotecas ja muito bem preparadas, é mais facil desenvolver a pagina com C++, HTML, JSON, etc


Título: Re: tecnologias web para servidor num MCU
Enviado por: Blue_Acid em 11 de Dezembro de 2019, 21:41
Por fim, para desenvolver html/css/js não é necessário usar xamp, wamp..., por exemplo se usarem o VSCode para programar existe um extensão o Live Server, fácil e prático.

E já agora obrigado pelo tópico tenho um NodeMCU parado e parece-me que vou ter que fazer umas brincadeiras :-)

Eu uso o Browser para abrir os HTML, nao é necessario nenhum tipo de servidor pois uso HTML+JS+CSS.
Se calhar o server era necessario para PHP... que nao é este o caso.

Outra coisa que nao sabia e descobri, é que o JS cria listas de objectos que facilmente sao convertidos em JSON etc... facilitando assim a criacao da pagina.
Por isso no MCU ele teve que suportar JSON.

Outra coisa que parece basica mas eu nao sabia, é que as bibliotecas estilo jQuery trazem uma funcao "Ajax" para fazer Get e Post que facilita o desenvolvimento.


Força ai no NodeMCU!
Vi alguns exemplos de paginas feitas para o ESP e como o framework dele é baseado em C++ e tem bibliotecas ja muito bem preparadas, é mais facil desenvolver a pagina com C++, HTML, JSON, etc

Viva, obrigado pela resposta.

Já agora a titulo de compor mais este assunto, a questão de usar um server local prende-se com as restrições do browser, efetivamente podes abrir o ficheiro diretamente, no entanto alguns recursos são bloqueados por ser um ficheiro local, nomeadamente pedidos ajax (https://developer.mozilla.org/en-US/docs/Learn/Common_questions/set_up_a_local_testing_server (https://developer.mozilla.org/en-US/docs/Learn/Common_questions/set_up_a_local_testing_server)), mesmo que seja um projecto html,css e js.

A tua observação do get e post do jquery e outras frameworks, deixa de ser importante à medida que os browser suportam nativamente o metodo fetch https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch (https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch)

Em relação a frameworks em C++, alguma que queiras destacar? Porque criando em C++ com padrão de pedido/resposta é possivel ter o servidor web no MCU, como se pode ter a mesma app numa servidor na rede que faz pedidos ao MCU, como se pode fazer uma APP mobile que se liga ao MCU e só recebem JSON.

@KammutierSpule vais partilhar desenvolvimentos deste teu projecto?
Título: Re: tecnologias web para servidor num MCU
Enviado por: KammutierSpule em 12 de Dezembro de 2019, 13:24
Viva, obrigado pela resposta.

Já agora a titulo de compor mais este assunto, a questão de usar um server local prende-se com as restrições do browser, efetivamente podes abrir o ficheiro diretamente, no entanto alguns recursos são bloqueados por ser um ficheiro local, nomeadamente pedidos ajax (https://developer.mozilla.org/en-US/docs/Learn/Common_questions/set_up_a_local_testing_server (https://developer.mozilla.org/en-US/docs/Learn/Common_questions/set_up_a_local_testing_server)), mesmo que seja um projecto html,css e js.

A tua observação do get e post do jquery e outras frameworks, deixa de ser importante à medida que os browser suportam nativamente o metodo fetch https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch (https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch)

Em relação a frameworks em C++, alguma que queiras destacar? Porque criando em C++ com padrão de pedido/resposta é possivel ter o servidor web no MCU, como se pode ter a mesma app numa servidor na rede que faz pedidos ao MCU, como se pode fazer uma APP mobile que se liga ao MCU e só recebem JSON.

@KammutierSpule vais partilhar desenvolvimentos deste teu projecto?

Citar
no entanto alguns recursos são bloqueados por ser um ficheiro local, nomeadamente pedidos ajax

Verdade, eu nao sei que finalidades costuma ser usado isso,mas neste caso acho que nao servia.
Neste caso os dados sao disponibilizados pelo server que eu estou a desenvolver no MCU, por isso so ele sabe que dados enviar nas respostas :)

Citar
A tua observação do get e post do jquery e outras frameworks, deixa de ser importante à medida que os browser suportam nativamente o metodo fetch

Fixe! Eu vi algumas coisas nesse sentido.. mas.. nao tive oportunidade de investigar.
Outro problema é que este projecto nao tinha requesitos, mas para o uso que era, suponho que houvesse interesse em suportar browsers antigos ou que ainda nao tenham essas capacidades.


Citar
Em relação a frameworks em C++, alguma que queiras destacar?

Nao, nao investiguei.. mas se procurares por exemplos para o ESP vais facilmente dar com eles.
As bibliotecas sao as normais do C++ e talvez mais algumas que ja venham no framework do ESP.


Citar
@KammutierSpule vais partilhar desenvolvimentos deste teu projecto?

Está em desenvolvimento o projecto :) mas nao é meu, nao posso dar detalhes.
Mas ja aqui fui expondo o que fiz e usei em posts anteriores.
se houver alguma duvida concreta, diz..