본문 바로가기

ajax

(9)
[RP2350_W6100] W6100을 이용한 웹서버 테스트 - 실시간 그래프 출력 [RP2350_W6100 SM] 보드를 이용하여 웹페이지 기본 테스코드를 이용하여 ADC전압값을 표시하는 웹서버 예제를 테스트 해 보자.RP2350을 이용하여 Arduino IDE에서 W6100의 Iperf TCP Throughput 측정 테스트 에서 18Mbps 의 전송률이 나오므로 실시간 웹페이지 출력이 가능할것 같다. https://youtube.com/shorts/2fakcUtC8cw   우선 수정이 필요한 웹페이지 파일을 새로 작성하자html_realtime_read_test1.h// HTML 페이지const char index_html[] PROGMEM = R"rawliteral( ADC Value 0mV )rawliteral";  [RP2350_W6100 SM] 보드를 이용하여 웹페..
[W55RP20 SSM] W5500 Ethernet - 웹서버 입력 테스트 지난번 포스트에서는 W55RP20에서 웹서버 출력 관련 테스트를 했는데 이번에는 서버에서 값을 입력 받는 테스트를 해 보자  먼저 Raspberry Pi PicoW - Ajax 를 이용한 실시간 웹 전압 디스플레이(https://nexp.tistory.com/3907 )  Raspberry Pi PicoW - Ajax 를 이용한 실시간 웹 전압 디스플레이ESP32-S2 웹서버 테스트 - Ajax 를 이용한 실시간 데이터 수신 테스트 코드를 이용하여 실시간 웹 디스플레이 테스트를 해보자. 코드는 거의 동일하게 구동된다. Pi Pico 확장 테스트 보드에는 ADC를 테nexp.tistory.com를 참고 해서 웹페이지를 작성 한다 이번에는 페이지를 쉽게 변경하기 위해 웹페이지를 바이너리로 변환해서 처리 하도..
Raspberry Pi PicoW - LittleFS를 사용한 웹서버 기존에 테스트 했던 웹서버는 저장소가 없이 소스코드 내에서 웹페이지의 정보를 전송 했는데 복잡한 웹페이지나 이미지가 많이 들어가는 웹페이지는 다루기가 어렵다. 그래서 파일 시스템(LittleFS)에 웹페이지 관련 파일들을 저장 해 두고 처리하면 상당히 편리 하다. 특히 웹페이지를 자주 바꾸어서 테스트 해야 하는 테스트에서는 파일시스템 내용만 바꾸면 되기 때문에 정말 빠르고 편리하게 개발 할 수 있다. ESP32 SPIFFS 웹서버 예제를 참고 해서 Pi Pico에서 제공하는 LittleFS로 웹서버를 구현하는 코드를 작성해 보자 #include #include #include #include #define _FS LittleFS #ifndef STASSID #define STASSID "****" #de..
Raspberry Pi PicoW - Ajax 를 이용한 실시간 웹 전압 디스플레이 ESP32-S2 웹서버 테스트 - Ajax 를 이용한 실시간 데이터 수신 테스트 코드를 이용하여 실시간 웹 디스플레이 테스트를 해보자. 코드는 거의 동일하게 구동된다. Pi Pico 확장 테스트 보드에는 ADC를 테스트 할 수 있는 가변저항(VR8)이 RP2040의 A0(GP26)에 할당되어 있다. 가변저항을 돌리면 전압변화가 생기고 이 전압을 웹페이지에 출력하는 코드를 작성해 보자. #include #include #include #ifndef STASSID #define STASSID "****" #define STAPSK "****" #endif const char* ssid = STASSID; const char* password = STAPSK; WebServer server(80); // HT..
ESP32-S2 Ajax 테스트 - SPIFFS 다운로드 문제 해결 ESP32-S2 Ajax 테스트 예제를이용하여 좀더 복잡한 웹페이지를 구현 하려면 HTML 데이터를 SPIFFS 에 저장해서 테스트 하면 쉽고 빠르게 웹페이지 및 자바 스크립트를 수정 할 수 있다. 그래서 ESP32-S2에서 SPIFFS를 사용하려고 했는데 에러가 발생한다. ESP32-S2에서는 SPIFFS 를 지원하지 않난다고 한다. SPIFFS 파일 시스템 파일 생성은 되지만 ESP32-S2는 다운로드를 지원하지 않는다고 한다. 왜 이렇게 만들었지? 너무 최신 칩인가? 최신 버전 Arduino IDE도 지원하지 않는다고 한다. SPIFFS를 사용하지 않으면 상당히 불편한데... ESP DOWNLOAD TOOL(https://www.espressif.com/en/support/download/other..
ESP32-S2 웹서버 테스트 - Ajax 를 이용한 실시간 데이터 수신 웹브라우즈에서 데이터 수신 하기 위한 가장 간단한 방법은 페이지 요청시에 변경된 데이터를 전송하면 된다. #include #include // SSID & Password const char* ssid = "SSSID"; const char* password = "PASS"; WebServer server(80); // Object of WebServer(HTTP port, 80 is defult) void handle_root(); // HTML 페이지 #if 1 const char index_html[] PROGMEM = R"rawliteral( ADC Value $VAL )rawliteral"; #endif //페이지 요청이 들어 오면 처리 하는 함수 void handle_root() { Strin..
ESP32 웹서버 - 실시간 ADC 데이터 그래프 출력 지금까지 테스트 한 웹서버 예제는 출력 관련 예제 였는데 이번에는 웹페이지 측에서 입력을 받을 수 있는 테스트를 해보자 기존에 실시간 웹서버를 구현 하기 위해 AJAX를 사용 했지만 비동기 방식 웹서버를 이용하면 이벤트 방식으로 쉽게 구현이 가능하다. 우선 웹서버 초기화 시에 사용할 이벤트를 등록 한다. AsyncEventSource events("/events"); void InitWebServer() { server.addHandler(&events); server.on("/", onRootRequest); server.serveStatic("/", SPIFFS, "/"); server.begin(); } 웹페이지에 데이터를 보내기 위해 ESP32 보드에서는 event.send 함수를 사용하면 쉽게 ..
[adStar EVM] AJAX를 이용한 실시간 업데이트 웹서버 - 가속도 센서 그래프출력 [adStar EVM] AJAX를 이용한 실시간 업데이트 웹서버 - 가속도 센서 그래프출력 임베디드 웹서버의 센서 모니터링을 위한 기술로 실기간 업데이트 가능한 JAVA(AJAX) 기술을 이용하면 쉽게 구현 가능하다. 참고 : Mini WebServer real time page update(실시간 웹페이지 업데이트) [adStar EVM] 보드를 이용하여 실시간 업데이트 가능한 임베디드 웹서버를 구현 해보았다. 웹페이지에서 JAVA코드를 디버깅하기는 쉽지 않기 때문에 자주 수정해야 한다. 웹페이지는 SD Card를 통해 업데이트 되어 복사만 하면 되므로 손쉽게 디버깅 할 수 있다. adStar 실시간 업데이트 웹서버 테스트 동영상 실시간성 테스를 위해 3축 가속도 센서 데이터를 모니터링 하는 예제를 테..