Top 22 아두 이노 웹 서버 Quick Answer

You are looking for information, articles, knowledge about the topic nail salons open on sunday near me 아두 이노 웹 서버 on Google, you do not find the information you need! Here are the best content compiled and compiled by the https://chewathai27.com/to team, along with other related topics such as: 아두 이노 웹 서버 아두이노 esp8266 웹서버, 아두이노 이더넷 클라이언트

[아두이노] 이더넷 쉴드로 웹서버 만들어서 사물인터넷 쉽게 구현하기

Table of Contents

아두이노 이더넷 웹서버 만들기 -#1

Article author: raspberrystory.tistory.com
Reviews from users: 34261 Ratings
Top rated: 4.2
Lowest rated: 1
Summary of article content: Articles about 아두이노 이더넷 웹서버 만들기 -#1 아니면 단순하게 비닐하우스의 온도,습도 같은 간단한 정보만 주는것이냐 ? 이질문의 답으로 사용자가 많지 않은 웹서버 같은 경우 아두이노도 충분하다. …
Most searched keywords: Whether you are looking for 아두이노 이더넷 웹서버 만들기 -#1 아니면 단순하게 비닐하우스의 온도,습도 같은 간단한 정보만 주는것이냐 ? 이질문의 답으로 사용자가 많지 않은 웹서버 같은 경우 아두이노도 충분하다. 일단 기초가 없는 사람들을 위해서 개념 부터 설명하고 넘어가자. 우리는 웹서버를 만들것이다. 이 웹서버를 만들기전에 우리는 웹서버, 서버에 대한 정의 부터해야 한다. 만들고자 하는 서버가 네..
Table of Contents:

공지사항

최근글

아두이노 이더넷 웹서버 만들기 -#1

반응형

일단 기초가 없는 사람들을 위해서 개념 부터 설명하고 넘어가자.

우리는 웹서버를 만들것이다.

이 웹서버를 만들기전에 우리는 웹서버, 서버에 대한 정의 부터해야 한다.

만들고자 하는 서버가 네이버 서버 처럼 사용자 접속이 많은것이냐 ?

아니면 단순하게 비닐하우스의 온도,습도 같은 간단한 정보만 주는것이냐 ?

이질문의 답으로 사용자가 많지 않은 웹서버 같은 경우 아두이노도 충분하다.

다시말해서 본인이 만들고자하는 서버의 종류, 서비스의 용도에 따라

아두이노가 가능하고 안되고 판단 할 수 있다.

아두이노로 서버가 가능하나요 ?

아두이노로 웹서버가 되나요 ?

어찌보면 개념도 기초도 없는 어리석은 질문이다.

물론 본인이 개념이 없다고 자책은 필요 없다. 지금부터 기초부터 공부하면 된다.

웹서버의 기본인 HTML부터 공부하자.

아래 테그는 한문장 출력하는 기초중의 기초다.

그러면 웹서버의 역활은 뭘가 ?

아주 간단하다. 클라이언트, 유저가 요청을 하면 요청한답을 주면 끝이다.

쉽게 말해서 html 문장을 전송하면 끝이다.

왜 끝일까 ? 나머지는 클라이언트, 유저의 웹브라우저가 다하기 때문이다.

단순하게 보면 웹서버의 역활은 지극히 단순하다.

이 기본개념에서 응용으로 넘어 간다면 아파치 서버나 기타 웹서버까지 가겠지만.

아두이노 차원에서는 이것으로 충분하다.

그리고

문장을 전송한다는것은 바이트단위로 TCP/IP 통신을 한다는것이다.

아두이노 측면에서 본다면 그냥 Serial print 한번 출력하는것으로 끝이다.

혹시 궁금해 하실것 같아서 언급하지만,

라즈베리의 아파치 서버의경우 최대 접속자 1000명, 거의 한계는 700명, 원할한 접속은 500명이다.

그렇다면 지금 PC방에 달려가서 본인이 만든 아두이노 서버에 DDOS공격을 해 보는것도,

재미 있을것 같다. 과연 몇명이나 버틸지…

< ! DOCTYPE html > < html > < body > < h1 > My First Heading < / h1 > < / body > < / html >

아두이노 강좌 #48 이더넷 쉴드를 사용하여 Web Server 시작하기

Arduino Ethernet Shield : Web Server

지난 포스트에서는 아두이노 이더넷 쉴드를 사용하여 DHCP와 고정 IP방식으로 LAN에 연결하는 방법에 대해 설명하였습니다. 이번 포스트에서는 이더넷 쉴드를 사용하여 웹 서버를 만드는 방법에 대해 설명 합니다.

개요 : 이해를 위한 설명

Web Server? Client?

네이버와 같은 웹 사이트가 동작하기 위해서는 네이버 사이트를 제공하는 회사와 네이버 사이트를 사용하는 사람들이 필요합니다. 이때 서비스를 제공하는 곳을 서버(Server) 서비스를 이용하는 사람을 클라이언트(Client)라고 말합니다. 네이버에 접속하기 위해 클라이언트 PC의 크롬과 같은 웹 브라우저에서 www.naver.com 같은 도메인 주소를 입력하면, 브라우저는 네이버 서버에 데이터를 요청하고, 웹 페이지에 보여줄 데이터를 수신하여 클라이언트의 웹 브라우저에 네이버 웹 페이지를 보여 줍니다.

Web Server 와 Web Client

Arduino Web Server

아두이노 웹 서버를 구축 한다는 의미는 아두이노와 같은 네트워크에 접속해 있는 스마트폰 또는 PC의 웹 브라우저에서 아두이노 IP에 접속하여 아두이노에서 제공하는 웹 페이지를 사용 할 수 있도록 하는 것입니다.

Arduino Web Server 네트워크 구성

HTTP

웹 서버와 웹 클라이언트의 통신은 서버 PC와 클라이언트의 웹 브라우저와 통신을 말합니다. 이때 사용되는 통신 방식이 HTTP 입니다. 웹 서버 PC는 하나이지만, 웹 브라우저의 종류는 다양하기 떄문에 HTTP란 통신 규격으로 통신(데이터 송신,수신)을 하게 됩니다.

아두이노에서 웹 서버를 구축하게 되면 아두이노와 클라이언트의 웹 브라우저와 HTTP통신 방식으로 데이터를 주고 받습니다.

HTML, CSS, Javascript

HTML, CSS, Javascript는 웹 페이지를 구성하는 언어입니다. 웹 브라우저에서 보여지는 모든 화면은 이 3가지의 언어를 사용하여 만들어집니다.

즉, 클라이언트의 브라우저에서 웹 서버에 접속하면 HTTP 통신 방식으로 웹 페이지 데이터(HTML, CSS, Javascript 등)를 수신하여 브라우저에서 웹 페이지 화면을 표시 합니다.

아두이노 웹 서버

하드웨어

아두이노로 이더넷을 연결하기 위해 Arduino Uno 보드와 Arduino Ethernet Shield2 보드를 사용하였습니다. 이번 설명에서는 SD-Card는 사용하지 않고, Arduino Uno의 메모리만을 사용하여 구현 합니다.

Arduino Ethernet Shield2 연결

웹 페이지 준비

아래 그림은 아두이노 웹 서버에서 보여줄 웹 페이지의 코드와 브라우저에서 해당 코드를 실행 한 화면입니다. HTML 코드를 본문에 삽입 할 수 없어 첨부 파일로 Index.html 을 참고로 첨부하였습니다.

index.html

(좌) HTML 코드 (우) 브라우저 아두이노 코드 아래 코드는 192.168.0.50 IP 주소를 가지는 아두이노 웹 서버 예시입니다. 아두이노와 같은 네트워크에 연결된 장치의 웹 브라우저에서 192.168.0.50 으로 접속하면 위의 HTML 코드를 전송합니다. 아래의 코드는 하단의 링크를 참조하여 수정하였습니다.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 # include < SPI.h > # include < Ethernet.h > byte mac[] = { 0x90 , 0xA2 , 0xDA , 0x10 , 0x53 , 0x07 }; // MAC Address IPAddress ip( 192 , 168 , 0 , 50 ); // IP Address EthernetServer server( 80 ); // Port 80 is default for HTTP void setup () { // You can use Ethernet.init(pin) to configure the CS pin //Ethernet.init(10); // Most Arduino shields //Ethernet.init(5); // MKR ETH shield //Ethernet.init(0); // Teensy 2.0 //Ethernet.init(20); // Teensy++ 2.0 //Ethernet.init(15); // ESP8266 with Adafruit Featherwing Ethernet //Ethernet.init(33); // ESP32 with Adafruit Featherwing Ethernet Ethernet. begin (mac, ip); // initialize Ethernet device server. begin (); // Start to listen for clients Serial . begin ( 115200 ); } void loop () { EthernetClient client = server. available (); // try to get client if (client) { // got client? boolean currentLineIsBlank = true ; while (client.connected()) { if (client. available ()) { // client data available to read char c = client. read (); // read 1 byte (character) from client Serial . print (c); // last line of client request is blank and ends with

// respond to client only after last line received if (c = = ‘

‘ & & currentLineIsBlank) { // send a standard http response header client. println ( “HTTP/1.1 200 OK” ); client. println ( “Content-Type: text/html” ); client. println ( “Connection: close” ); client. println (); // send web page client. println ( “” ); client. println ( “” ); client. println ( “” ); client. println ( “” ); client. println ( “” ); client. println ( “Arduino Web Page” ); client. println ( “” ); client. println ( “” ); client. println ( “

Arduino Web Page

” ); client. println ( “

Hello World! This is arduino Web page!

” ); client. println ( “” ); client. println ( “” ); break ; } if (c = = ‘

‘ ) { currentLineIsBlank = true ; } else if (c ! = ‘\r’ ) { currentLineIsBlank = false ; } } } delay ( 1 ); client. stop (); // close the connection } } Colored by Color Scripter cs

코드 설명

선언부

MAC 주소 입력, IP 주소 입력, EthernetServer 클래스 인스턴스 생성 및 초기화

4줄 : MAC 주소를 입력 합니다. 일반적으로 보유하고 있는 이더넷 쉴드 하단에 스티커가 부착되어 있습니다.

5줄 : 네트워크 IP범위에 맞는 적절한 IP주소를 입력 합니다.

6줄 : 포트 번호를 80으로 초기화 – 일반 적으로 웹 서버는 80번 포트 번호 사용

void setup()

이더넷 초기화, 이더넷 서버 시작, 시리얼 포트 시작

10~16줄 : Arduino Ethernet Shield 가 아닌 경우 적절한 Ethernet.init(pin) 코드 삽입 필요

17줄 ; 이더넷 초기화 – 고정 IP사용

18줄 : 웹 서버 시작 – 클라이언트 호출 기다림 시작

19줄 : 시리얼 포트 시작 – 수신된 HTTP 메세지 출력 용도로 사용

void loop()

클라이언트가 접속하면 웹페이지 HTML 데이터를 송신

24줄 : 클라이언트가 접속하면 이더넷 클라이언트 클래스 객체를 생성

클라이언트와의 통신은 서버가 직접 하지 않고, 클라이언트와 통신하기 위해 생성된 클라이언트 객체와 통신을 합니다.

26줄~65줄 : 클라이언트가 접속하면 실행되는 if문

27줄 : 클라이언트의 HTTP 요청이 완료되었는지 확인 하기 위한 boolean 변수 생성 (하단 설명 참조)

28줄 : 클라이언트가 연결 된 상태일 때 실행되는 반복문

29줄 : 클라이언트로부터 수신된 메세지가 있는 경우 실행되는 if문

30줄~31줄 : 클라이언트로부터 수신된 메세지가 저장된 수신 버퍼에서 데이터를 하나씩 읽어서 시리얼 포트로 출력

34줄 : 클라이언트로부터 HTTP 요청이 완료되면 실행되는 if문

36~39줄 : HTTP HEAD 응답

41~52줄 : HTTP BODY 응답 – 웹 페이지 HTML 코드

55~56줄 : HTTP 수신 버퍼에서 읽은 문자가

(New Line)인 경우 currentLineIsBack 을 True로 설정

58~59줄 : HTTP 수신 버퍼에서 읽은 문자가

(New Line) 또는 \r(Carriage Return) 아닌 경우 currentLineIsBack을 False로 설정

HTTP Request 메세지

위의 코드를 실행 후 클라이언트의 웹 브라우저에서 192.168.0.50 으로 접속하면 브라우저에서 아두이노로 HTTP 규격에 따라 아래와 같은 HTTP 호출 메세지가 전달됩니다. 아래 그림과 같이 클라이언트의 HTTP 요청 메세지는 마지막에 한 줄을 띄우도록 약속되어있습니다.

위 코드의 34번 줄 코드는 HTTP 수신 버퍼에서 읽은 문자가

이고 currentLineIsBlank가 True인 경우 Client Reuqest 메세지가 완료되었다고 판단하고 실행되는 if문입니다.

HTTP Request 메세지

실행 결과

아래 그림은 같은 네트워크에 있는 PC의 웹 브라우저에서 아두이노 IP인 192.168.0.50으로 접속 후 보여지는 웹 페이지와 아두이노의 시리얼 메세지 출력 화면입니다.

Arduino Web Server 실행 결과

ESP01 웹서버를 이용하여 웹페이지에서 디지털핀 원격제어, WiFiEsp.h :: postpop

아두이노에 ESP01 와이파이 모듈을 연결시키고 ESP01의 webserver에 접속하여 아두이노의 디지털 핀을 원격 제어하도록 해보자.

스마트폰에서 ESP01의 webserver에 접속하는 방법에는 스마트폰이 연결된 공유기를 통해 내부 네트워크 상의 ESP01의 webserver에 접속하는 방법과 스마트폰을 ESP01의 soft AP에 직접 연결하여 webserver에 접속하는 두 가지 방법 중 하나를 사용할 수 있다. 이는 ESP01이 공유기와 연결하기 위한 station 모드와 스마트폰과 같은 단말기의 연결을 허용하기 위한 soft AP(액세스 포인트) 모드를 지원함으로써 가능하며, 두 모드 중 각각의 모드를 선택하여 활성화하거나 또는 동시에 두 모드를 활성화하여 공유기에 연결한 상태에서 스마트폰과의 연결도 할 수 있다. 하지만 ESP01 모듈이 시리얼 통신을 통해 아두이노와 연결되어 있다는 점과 모듈 자체의 하드웨어적인 한계 또는 와이파이 라이브러리의 문제로 인하여 아두이노가 데이터를 수신할 때에는 큰 불편함이 없으나 아두이노에서 데이터 송신 시 그 시작과 종료에 약 5초 정도의 시간이 소요되어 실제 사용상에는 무리가 있을 수 있다. 실제 데이터 전송에는 약 1 ~ 2초 정도 소요되나 클라이언트를 종료시키는 과정에서 3초 정도의 딜레이가 발생하였다(라이브러리 문제일 가능성이 있다).

아두이노와 Wifi 모듈 ESP01 연결

ESP01의 시리얼 통신 보드 레이트가 9600으로 설정되어 있어야 한다. ESP01의 연결 설정 및 자세한 방법에 관해서는 이전 글 아두이노 – ESP01 wifi 모듈 무선 원격제어 그리고 시리얼 통신 – 6편을 참조하기 바란다.

아두이노에서 WebServer를 이용하기 위해 WiFiEsp 라이브러리를 사용하겠다.

아래 사이트에서 WiFiEsp 라이브러리를 다운로드하자.

https://github.com/bportaluri/WiFiEsp

다운로드 후 압축을 풀면 아래와 같이 WiFiEsp-master 폴더 안에 똑같은 WiFiEsp-master 있는데 안의 폴더명에서 “-master”삭제하여 WiFiEsp로 변경한 뒤 폴더를 복사한다.

내 컴퓨터의 아두이노 저장 폴더 -> 라이브러리 폴더로 이동하여 붙여 넣기를 해준다.

C:\Program Files (x86)\Arduino\libraries

아두이노 IDE가 실행되고 있다면 아두이노 IDE를 반드시 종료하고 다시 실행해 주어야만 라이브러리가 반영된다.

ESP01을 station 모드로 공유기에 연결하고 내부 네트워크 이용 원격 제어하기

우선 ESP01이 station 모드로 공유기에 연결된 상태(내부 네트워크)에서 webserver에 접속하여 디지털 핀을 원격 제어하는 흐름에 대해 살펴보자. 스마트폰에서 제어한다고 가정했을 때 ESP01이 공유기로부터 할당받은 내부 ip 주소를 스마트폰의 웹브라우저에 입력하면 웹브라우저(마스터)는 ESP01의 webserver에 연결 요청을 하고 이 요청을 받은 webserver는 클라이언트를 생성하고 데이터(기본 http 프로토콜)를 시리얼 통신을 통해 아두이노에 전송하게 된다. 아두이노는 클라이언트를 통해 데이터를 수신하고 디지털 핀 제어에 관련된 명령어가 있다면 제어를 실행하고 관련 코드에 따라 수신된 데이터에 대응하는 웹페이지(메시지 또는 디지털 핀의 상태)를 현재 연결이 되어있는 클라이언트를 통해 회신하게 된다.

이 웹페이지(회신 데이터)는 시리얼 통신을 통해 ESP01로 전송되고 다시 와이파이를 통해 스마트폰의 웹브라우저에 디지털 핀의 현재 상태가 반영된 웹페이지를 표시하게 되어 아두이노의 디지털 핀을 제어할 수 있게 된다.

아래 그림처럼 아두이노 IDE의 파일 -> 예제 -> WiFiEsp -> WebServerLed 예제를 실행시킨다.

아래 스케치는 상기 예제를 현재 아두이노와 ESP01 모듈의 연결 상태에 맞게 소프트 시리얼 코드들을 수정해 주고 기본 LED, 디지털 7번 핀을 제어하도록 수정하였으며 html 코드도 PROGMEM을 사용하여 Flash memory에서 직접 읽어 오도록 수정해주었다.

공유기 SSID와 비밀번호를 수정하고 업로드해보자.

#include “WiFiEsp.h” #include #define rxPin 3 #define txPin 2 SoftwareSerial esp01(txPin, rxPin); // SoftwareSerial NAME(TX, RX); const char ssid[] = “SK_WiFiGIGA40F7”; // your network SSID (name) const char pass[] = “1712037218”; // your network password int status = WL_IDLE_STATUS; // the Wifi radio’s status #define ledPin 13 #define digiPin 7 WiFiEspServer server(80); void setup() { pinMode(ledPin, OUTPUT); pinMode(digiPin, OUTPUT); digitalWrite(ledPin, LOW); digitalWrite(digiPin, LOW); Serial.begin(9600); // initialize serial for debugging esp01.begin(9600); //와이파이 시리얼 WiFi.init(&esp01); // initialize ESP module while ( status != WL_CONNECTED) { // 약 10초동안 wifi 연결 시도 Serial.print(F(“Attempting to connect to WPA SSID: “)); Serial.println(ssid); status = WiFi.begin(ssid, pass); // Connect to WPA/WPA2 network IPAddress ip = WiFi.localIP(); Serial.print(“IP Address: “); Serial.println(ip); } server.begin(); } const char HTTP_HEAD[] PROGMEM = “” “” ““; const char HTTP_STYLE[] PROGMEM = “

“; const char HTTP_HEAD_END[] PROGMEM = “

” “

ESP01 Digital Pin Control

“; const char BUTTON_TYPE[] PROGMEM = “

” “

“; const char BUTTON_A_ON[] PROGMEM = “

Button A

“; const char BUTTON_A_OFF[] PROGMEM = “

Button A

“; const char BUTTON_B_ON[] PROGMEM = “

Button B

“; const char BUTTON_B_OFF[] PROGMEM = “

Button B

“; const char HTTP_END[] PROGMEM = “

“; bool button_a = LOW; // off bool button_b = LOW; // off void loop() { WiFiEspClient client = server.available(); // listen for incoming clients if (client) { // if you get a client, while (client.connected()) { // loop while the client’s connected if (client.available()) { // if there’s bytes to read from the client, String income_AP = client.readStringUntil(‘

‘); if (income_AP.indexOf(F(“A/1”)) != -1) { Serial.println(F(“button_A on”)); button_a = HIGH; digitalWrite(ledPin, button_a); } else if (income_AP.indexOf(F(“A/0”)) != -1) { Serial.println(F(“button_A off”)); button_a = LOW; digitalWrite(ledPin, button_a); } else if (income_AP.indexOf(F(“B/1”)) != -1) { Serial.println(F(“button_B on”)); button_b = HIGH; digitalWrite(digiPin, button_b); } else if (income_AP.indexOf(F(“B/0”)) != -1) { Serial.println(F(“button_B off”)); button_b = LOW; digitalWrite(digiPin, button_b); } client.flush(); client.println(F(“HTTP/1.1 200 OK”)); // HTTP 프로토콜 헤더 client.println(F(“Content-type:text/html”)); client.println(F(“Connection: close”)); client.println(); String page; page = (const __FlashStringHelper *)HTTP_HEAD; page += (const __FlashStringHelper *)HTTP_STYLE; page += (const __FlashStringHelper *)HTTP_HEAD_END; page += (const __FlashStringHelper *)BUTTON_TYPE; if (button_a == HIGH) { page += (const __FlashStringHelper *)BUTTON_A_ON; } else { page += (const __FlashStringHelper *)BUTTON_A_OFF; } if (button_b == HIGH) { page += (const __FlashStringHelper *)BUTTON_B_ON; } else { page += (const __FlashStringHelper *)BUTTON_B_OFF; } page += (const __FlashStringHelper *)HTTP_END; client.print(page); client.println(); delay(1); break; } } client.stop(); Serial.println(F(“Client disconnected”)); } }

스케치가 업로드되고 아두이노가 초기화를 시작하면 ESP01 역시 초기화와 공유기 연결을 진행하고 아래와 같이 공유기로부터 할당받은 ip 주소를 출력한다. 필자는 공유기로부터 “192.168.35.176”이라는 ip주소를 할당받았다. 공유기마다 할당해주는 ip주소는 다르게 된다.

2019.11.22 수정

상기 그림의 메시지 “[WiFiEsp] TIMEOUT: 458″가 출력되지 않도록 코드를 수정해 주었다. 아래 수신 데이터 전문을 살펴보자.
[WiFiEsp] New client 0

GET /A/0 HTTP/1.1

Host: 192.168.35.176

Connection: keep-alive

Upgrade-Insecure-Requests: 1

User-Agent: Mozilla/5.0 (Linux; Android 8.0.0; SAMSUNG SM-G930S) AppleWebKit/537.36 (KHTML, like Gecko) SamsungBrowser/10.1 Chrome/71.0.3578.99 Mobile Safari/537.36

Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8

Referer: http://192.168.35.176/A/0

Accept-Encoding: gzip, deflate

Accept-Language: ko-KR,ko;q=0.9,en-US;q=0.8,en;q=0.7

버튼을 눌렀을때 수신되는 데이터이다. 여기서 client.readStringUntil(‘

‘); 코드를 사용하면 “GET /A/0 HTTP/1.1” 데이터가 수신된다. 그 이후의 나머지 데이터는 버퍼에 남아있게 되는데 이게 문제가 되어 “[WiFiEsp] TIMEOUT: 458” 와 같은 메시지가 출력되었었다. 클라이언트 종료 직전에 client.flush(); 코드를 써 주어 남아있는 데이터를 삭제 하고자 했었지만 client.flush(); 코드를 사용하여 남아있는 데이터를 삭제해 주는데 시간이 소요되어 그 같은 메시지가 표시 되었던것 같다. 코드의 위치를 디지털 핀 작동 후 버튼의 상태를 표시하는 html 코드 전송 전으로 이동해 주어 메시지가 표시 되지 않도록 해주었으며 이로인해 핀을 제어한 다음에 남아 있는 데이터를 삭제해주고, 버튼 상태 html 코드를 웹브라우저에 송신한 다음 클라이언트가 정상적으로 종료되게 된다. 딜레이도 약간 감소한것 같다.

이제 내부 네트워크에 연결된 스마트폰의 웹브라우저나 PC의 웹브라우저 주소창에 상기의 ip주소를 입력해주면 연결 상태가 시리얼 모니터에 표시되며 이때 아두이노는 정해진 코드에 따라 html 코드를 클라이언트를 통해 웹브라우저(마스터)에게 전송하고 웹브라우저는 아래 그림처럼 아두이노로부터 수신한 html을 표시하게 된다.

작동 흐름을 살펴보면 웹브라우저가 주소 “192.168.35.176”로 연결을 시도하게 되면 ESP01의 webserver는 요청을 수신하고 client를 생성하고 아두이노에 root값(“192.168.35.176” 이후 추가된 주소가 없다)인 “GET / HTTP/1.1″이라는 스트링 메시지를 시리얼 통신을 통해 전송하게 된다. 아두이노 클라이언트 수신 코드에 따라 “GET /” 이후에 아무런 메시지가 없으므로 초기 html 코드를 ESP01 클라이언트를 통해 웹브라우저에 전송해 준다. 웹브라우저는 수신한 html 코드에 따라 페이지를 출력한다.

Button_A를 클릭하면 웹브라우저는 “192.168.35.176/A/1″주소로 연결을 시도하고 이 연결에 대한 주소 값이 아두이노에 전송되어 아두이노에서는 “GET /A/1 HTTP/1.1″이라는 스트링 메시지를 수신하게 된다. 이 메시지 중 “A/1” 스트링에 의해 아두이노 기본 LED를 켜는 코드가 작동되어 LED가 켜지게 되고 LED의 상태가 반영된 html 코드를 다시 웹브라우저에 송신하여 웹브라우저에 현재 버튼 상태 값이 반영된 웹페이지를 출력하게 한다.

핵심 코드 분석

웹브라우저에 전송하는 html 코드를 PROGMEM 지시어를 사용하여 Flash Memory에서 직접 읽도록 하였다. RPOGMEM 지시어에 관한 사항은 이전 글 아두이노 – 메모리(SRAM) 공간 확보를 위한 PROGMEM과 F() 매크로의 사용을 참조하기 바란다.

아래는 웹페이지의 스타일(폰트 크기, 버튼 색상 지정)을 지정해 주는 html 코드이다.

const char HTTP_STYLE[] PROGMEM = “

“;

아래는 버튼의 상태 값을 표시해주는 html 코드이다.

const char BUTTON_A_ON[] PROGMEM = “

Button A

“; const char BUTTON_A_OFF[] PROGMEM = “

Button A

“; const char BUTTON_B_ON[] PROGMEM = “

Button B

“; const char BUTTON_B_OFF[] PROGMEM = “

Button B

“;

loop() 함수 내의 클라이언트 작동 코드를 살펴보자.

WiFiEspClient client = server.available();

loop() 함수를 scan 할 때마다 WiFiEspClient 객체 client를 생성하고 webserver에 웹 브라우저로부터 연결 요청이 있는지를 확인한다.

if (client) { 실행코드 }

연결 요청이 있어 client 값이 ture가 되면 코드를 실행한다.

while (client.connected()) { 실행코드 }

클라이언트가 웹브라우저(마스터)와 연결된 상태인 동안에는 while() 함수를 빠져나가지 않고 코드를 계속해서 실행한다.

String income_AP = client.readStringUntil(‘

‘);

종료 문자를 만날 때까지 client 버퍼에 있는 데이터를 수신하고 스트링 변수 income_AP에 저장한다.

break;

데이터 수신이 완료되면 while() 루프를 빠져나간다.

client.flush();

클라이언트를 통해 웹브라우저로 부터 데이터를 수신할 때 읽지 않고 버퍼에 남아있는 데이터를 삭제한다.

client.stop();

클라이언트를 종료한다.

아래는 loop() 함수 내의 클라이언트 작동 코드만 정리한 것이다.

WiFiEspClient client = server.available(); // listen for incoming clients

if (client) { // if you get a client,

while (client.connected()) { // loop while the client’s connected

if (client.available()) { // if there’s bytes to read from the client,

String income_AP = client.readStringUntil(‘

‘);

break;

client.flush();

}

}

client.stop();

Serial.println(F(“Client disconnected”));

}

수신한 데이터를 저장한 스트링 변수 income_AP 내에 버튼 지정 코드 “A/0”, “A/1”, “B/0”, “B/1″의 문자열이 있는지를 검색하고 문자열이 있다면 해당 코드를 실행한다.

if (income_AP.indexOf(F(“A/1”)) != -1) { 실행코드 }

else if (income_AP.indexOf(F(“A/0”)) != -1) { 실행코드 }

.

.

실행 코드에는 LED를 켜고 끄는 상태 변경 변수 button_a 또는 button_b가 있고 이 상태 변수에 의해 버튼의 상태가 반영된 html 코드를 지정하고 전송하게 된다.

client.println(F(“HTTP/1.1 200 OK”)); // HTTP 프로토콜 헤더

client.println(F(“Content-type:text/html”));

client.println(F(“Connection: close”));

client.println();

HTTP 프로토콜 헤더이다. “HTTP/1.1 200 OK” 이 코드에 의해 웹브라우저는 html 형식 코드라는 것을 인지하고 데이터를 수신한다. “Connection: close”는 데이터 수신 후 연결을 종료한다는 명령어이다. 또한 스트링 html 코드에 F() 매크로를 사용하여 Flash Memory에서 바로 읽어서 스트링을 전송할 수 있도록 하였다.

String page;

page = (const __FlashStringHelper *)HTTP_HEAD;

page += (const __FlashStringHelper *)HTTP_STYLE;

.

.

client.print(page);

스트링 변수 page를 선언하고 PROGMEM 지시어에 의해 저장된 html 코드를 읽고 스트링을 모두 더한다음 클라이언트를 통해 데이터를 전송하는 코드이다.

if (button_a == HIGH) {

page += (const __FlashStringHelper *)BUTTON_A_ON;

} else {

page += (const __FlashStringHelper *)BUTTON_A_OFF;

}

변수 button_a의 상태에 따라 버튼의 표시를 하기 위한 html 코드를 스트링 변수 page에 더해주는 코드이다.

상기의 연결 설명을 하는 그림에서 스마트폰 항목에 “웹브라우저 / 원격제어 앱”이라는 항목이 있었다.

스마트폰에서 웹브라우저와 원격제어 앱에서 제어를 할 수 있도록 코드를 작성해 보았다. 이전 글아두이노 – ESP01 wifi 모듈 무선 원격제어 그리고 시리얼 통신 – 6편에서는 ESP01의 soft AP에 접속하여 제어를 했었었다. 당연한 얘기지만 내부 네트워크로 연결이 되어 있다면 원격제어 앱에서도 내부 내트워크 ip주소로 연결하여 제어할 수 있다. 상기의 코드에 이전 글에서 사용했던 코드를 접목하여 안드로이드 원격제어 앱에서도 같은 제어를 할 수 있게 해 보자.

다만, 이전 글에서는 WiFiEsp.h 라이브러리를 사용하지 않고 직접 ESP01을 제어했으므로 PWM의 순차적이고 연속적인 데이터를 받을 수 있도록 수신 id 컨트롤을 할 수 있었지만 WiFiEsp.h 라이브러리를 사용하는 연결에서는 id 컨트롤을 라이브러리가 관리함으로 인해 연속적으로 들어오는 데이터를 순서대로 받을 수가 없었다. 따라서 PWM 제어 코드는 삭제하고 디지털 버튼 두 개만 사용하도록 코드를 수정해 주었다.

사실 이글의 핵심은 아두이노에서 html 코드를 웹브라우저로 전송하는 것이다. 이전 글의 코드는 데이터의 수신에 중점을 두어 제어의 응답성을 극대화시킨 반면 송신(아두이노에서 -> 앱)은 전혀 염두에 두지 않은 코드이다. 물론 앱에서는 버튼의 표시등이 앱에 의해 기본적으로 표현되므로 굳이 아두이노로부터 페이지의 표현 등을 위한 html 코드를 수신할 필요는 없다. 따라서 앱에서 제어하는 경우에는 아두이노에서 버튼의 표현에 관한 html 코드를 앱으로 전송할 필요가 없게 된다.

아래 코드를 업로드하고 웹브라우저에 공유기에서 할당받은 ip주소(예. 192.168.35.176)를 입력하고 ESP01과 연결하여 제어를 해보고 안드로이드 앱에서도 제어를 해보자. 안드로이드 앱의 경우 이전 글을 참조하여 와이파이 연결 주소를 192.168.4.1이 아닌 할당받은 ip주소를 입력하면 된다. 한 가지 유의할 점은 웹브라우저와 안드로이드 앱이 서로 정보를 공유할 수는 없다는 것이다. 웹브라우저와 안드로이드 앱이 동시에 ESP01에 연결 요청을 한다고 할지라도 생성되는 클라이언트는 서로 다르고 독립적이다. 웹브라우저의 연결 요청에 의해 생성된 클라이언트를 통해서는 웹브라우저에게만 데이터를 송신할 수 있고 안드로이드 앱의 요청에 의해 생성된 클라이언트는 안드로이드 전용으로만 사용될 수 있다. 즉. 웹브라우저에서 버튼을 눌렀을 때 버튼의 상태를 웹브라우저에 의해 생성된 클라이언트를 통해서는 안드로이드 앱에 송신할 수 없고 반대의 경우도 마찬가지이다.

두 연결에 의한 작동상태를 확인해 보기만 하면 된다.

#include “WiFiEsp.h” #include #define rxPin 3 #define txPin 2 SoftwareSerial esp01(txPin, rxPin); // SoftwareSerial NAME(TX, RX); const char ssid[] = “SK_WiFiGIGA40F7”; // your network SSID (name) const char pass[] = “1712037218”; // your network password int status = WL_IDLE_STATUS; // the Wifi radio’s status #define ledPin 13 #define digiPin 7 WiFiEspServer server(80); uint8_t pin_val = 0; // 디지털 버튼 제어용 변수 String text = “”; void setup() { pinMode(ledPin, OUTPUT); pinMode(digiPin, OUTPUT); digitalWrite(ledPin, LOW); digitalWrite(digiPin, LOW); Serial.begin(9600); // initialize serial for debugging esp01.begin(9600); //와이파이 시리얼 WiFi.init(&esp01); // initialize ESP module while ( status != WL_CONNECTED) { // 약 10초동안 wifi 연결 시도 Serial.print(F(“Attempting to connect to WPA SSID: “)); Serial.println(ssid); status = WiFi.begin(ssid, pass); // Connect to WPA/WPA2 network IPAddress ip = WiFi.localIP(); Serial.print(“IP Address: “); Serial.println(ip); } server.begin(); } const char HTTP_HEAD[] PROGMEM = “” “” ““; const char HTTP_STYLE[] PROGMEM = “

“; const char HTTP_HEAD_END[] PROGMEM = “

” “

ESP01 Digital Pin Control

“; const char BUTTON_TYPE[] PROGMEM = “

” “

“; const char BUTTON_A_ON[] PROGMEM = “

Button A

“; const char BUTTON_A_OFF[] PROGMEM = “

Button A

“; const char BUTTON_B_ON[] PROGMEM = “

Button B

“; const char BUTTON_B_OFF[] PROGMEM = “

Button B

“; const char HTTP_END[] PROGMEM = “

\r

“; bool button_a = LOW; // off bool button_b = LOW; // off void loop() { WiFiEspClient client = server.available(); // listen for incoming clients if (client) { // if you get a client, while (client.connected()) { // loop while the client’s connected if (client.available()) { // if there’s bytes to read from the client, String income_wifi = client.readStringUntil(‘

‘); bool browser = false; if (income_wifi.indexOf(“%%F0”) != -1) { String wifi_temp = income_wifi.substring(income_wifi.indexOf(“%%F0”)+4, income_wifi.indexOf(“%%F1”)); pin_val = wifi_temp.toInt(); pin_control(); } else if (income_wifi.indexOf(F(“A/1”)) != -1) { Serial.println(F(“button_A on”)); button_a = HIGH; browser = true; digitalWrite(ledPin, button_a); } else if (income_wifi.indexOf(F(“A/0”)) != -1) { Serial.println(F(“button_A off”)); button_a = LOW; browser = true; digitalWrite(ledPin, button_a); } else if (income_wifi.indexOf(F(“B/1”)) != -1) { Serial.println(F(“button_B on”)); button_b = HIGH; browser = true; digitalWrite(digiPin, button_b); } else if (income_wifi.indexOf(F(“B/0”)) != -1) { Serial.println(F(“button_B off”)); button_b = LOW; browser = true; digitalWrite(digiPin, button_b); } else { String wifi_temp = income_wifi.substring(income_wifi.indexOf(“GET /”)+5, income_wifi.indexOf(“HTTP/1.1″)); if (wifi_temp != ” “) { if (wifi_temp.indexOf(“%20”) != -1) { String space = “%20″; String space_convert = ” “; wifi_temp.replace(space, space_convert); } text = wifi_temp; Serial.println(text); } else { browser = true; } } client.flush(); if (browser == true) { client.println(F(“HTTP/1.1 200 OK”)); // HTTP 프로토콜 헤더 client.println(F(“Content-type:text/html”)); client.println(F(“Connection: close”)); client.println(); String page; page = (const __FlashStringHelper *)HTTP_HEAD; page += (const __FlashStringHelper *)HTTP_STYLE; page += (const __FlashStringHelper *)HTTP_HEAD_END; page += (const __FlashStringHelper *)BUTTON_TYPE; if (button_a == HIGH) { page += (const __FlashStringHelper *)BUTTON_A_ON; } else { page += (const __FlashStringHelper *)BUTTON_A_OFF; } if (button_b == HIGH) { page += (const __FlashStringHelper *)BUTTON_B_ON; } else { page += (const __FlashStringHelper *)BUTTON_B_OFF; } page += (const __FlashStringHelper *)HTTP_END; client.print(page); client.println(); delay(1); } break; } } client.stop(); Serial.println(F(“Client disconnected”)); } } void pin_control() { if (pin_val != 0) { switch (pin_val) { case 11: digitalWrite(ledPin, HIGH); // button 1 : on Serial.println(“App Button_A ON”); break; case 10: digitalWrite(ledPin, LOW); // button 1 : off Serial.println(“App Button_A OFF”); break; case 21: Serial.println(“button 2 : on”); Serial.println(“App Button_B ON”); break; case 20: Serial.println(“button 2 : off”); Serial.println(“App Button_B OFF”); break; } pin_val = 0; } }

station 모드를 통한 원격제어의 장점은 사용자가 ESP01에 접속을 할 때 직접 연결을 하는 게 아니라 공유기를 거쳐서 한다는 점이다. 스마트폰이 공유기와 연결되어 있는 상태에서는 별도로 와이파이 연결 프로그램을 실행시키지 않고도 아두이노를 켜고 ESP01이 공유기와 연결되면 해당 ip주소만 입력하여 제어를 할 수 있게 된다. soft AP를 이용할 경우에는 매번 와이파이 프로그램을 통해 기존 와이파이 연결을 끊고 다시 soft AP에 연결을 해야 하며 이 작업이 은근히 많을 시간을 소요할 뿐만 아니라 스트레스를 유발하기도 한다.

하지만 station 모드에서 연결하고 제어하는 방법에는 큰 문제점이 있는데 웹브라우저에서 연결할 ip주소를 사용자가 임의대로 지정할 수 없다는 것이다(공유기의 설정을 할 수 없다고 가정했을 때). ESP01이 공유기에 SSID와 비밀번호를 통해 연결할 때 공유기의 DHCP 서버가 ESP01이 사용할 ip주소를 할당해주게 되므로 아두이노가 실행되고 와이파이가 연결되기 전에는 ip주소를 확인할 수가 없다. 연결된 뒤에도 시리얼 모니터에 표시된 메시지를 통해서 확인해야 하므로 ip주소를 확인하기 위해서는 아두이노가 컴퓨터와 연결되고 시리얼 모니터가 켜진 상태여야만 한다. 이는 아두이노를 독립적인 전원을 통해 단독 실행할 경우 ESP01이 공유기로부터 할당받은 ip주소를 확인할 수 없게 되어 웹브라우저에서 연결조차 하지 못하는 상황이 발생할 수 있다. 보통 한번 받은 ip 주소가 다음번에도 같을 가능성이 높긴 하지만 그렇더라도 공유기가 바뀐 환경 즉 다른 장소에서 아두이노를 켜고 제어를 할 때에는 ip주소를 확인할 수 없게 된다.

ESP01의 soft AP에 연결하여 원격 제어하기

이번에는 스마트폰에서 ESP01의 soft AP 연결을 통해 webserver에 연결하고 제어를 해보자. 앞선 코드에서 와이파이 연결부분만 수정을 해주면 된다.

soft AP 연결 설정 코드

const char ssid_AP[] = “esp01_AP”; // your network SSID (name)

const char pass_AP[] = “1234test”; // your network password

WiFi.beginAP(ssid_AP, 10, pass_AP, ENC_TYPE_WPA2_PSK); // 10:채널,

IPAddress ap = WiFi.localIP();

Serial.print(F(“AP Address: “));

Serial.println(ap);

soft AP의 기본 ip 주소는 192.168.4.1이다.

만약 상기 주소가 아닌 특정 주소로 변경하고 싶다면 아래의 코드를 적용해주면 된다.

IPAddress localIp(192, 168, 111, 111); // softAP 접속 IP 설정

WiFi.configAP(localIp);

#include “WiFiEsp.h” #include #define rxPin 3 #define txPin 2 SoftwareSerial esp01(txPin, rxPin); // SoftwareSerial NAME(TX, RX); const char ssid_AP[] = “esp01_AP”; // your network SSID (name) const char pass_AP[] = “1234test”; // your network password #define ledPin 13 #define digiPin 7 WiFiEspServer server(80); void setup() { pinMode(ledPin, OUTPUT); pinMode(digiPin, OUTPUT); digitalWrite(ledPin, LOW); digitalWrite(digiPin, LOW); Serial.begin(9600); // initialize serial for debugging esp01.begin(9600); //와이파이 시리얼 WiFi.init(&esp01); // initialize ESP module // IPAddress localIp(192, 168, 111, 111); // softAP 접속 IP 설정 // WiFi.configAP(localIp); WiFi.beginAP(ssid_AP, 10, pass_AP, ENC_TYPE_WPA2_PSK); // 10:채널, IPAddress ap = WiFi.localIP(); Serial.print(F(“AP Address: “)); Serial.println(ap); server.begin(); } const char HTTP_HEAD[] PROGMEM = “” “” ““; const char HTTP_STYLE[] PROGMEM = “

“; const char HTTP_HEAD_END[] PROGMEM = “

” “

ESP01 Digital Pin Control

“; const char BUTTON_TYPE[] PROGMEM = “

” “

“; const char BUTTON_A_ON[] PROGMEM = “

Button A

“; const char BUTTON_A_OFF[] PROGMEM = “

Button A

“; const char BUTTON_B_ON[] PROGMEM = “

Button B

“; const char BUTTON_B_OFF[] PROGMEM = “

Button B

“; const char HTTP_END[] PROGMEM = “

“; bool button_a = LOW; // off bool button_b = LOW; // off void loop() { WiFiEspClient client = server.available(); // listen for incoming clients if (client) { // if you get a client, while (client.connected()) { // loop while the client’s connected if (client.available()) { // if there’s bytes to read from the client, String income_AP = client.readStringUntil(‘

‘); if (income_AP.indexOf(F(“A/1”)) != -1) { Serial.println(F(“button_A on”)); button_a = HIGH; digitalWrite(ledPin, button_a); } else if (income_AP.indexOf(F(“A/0”)) != -1) { Serial.println(F(“button_A off”)); button_a = LOW; digitalWrite(ledPin, button_a); } else if (income_AP.indexOf(F(“B/1”)) != -1) { Serial.println(F(“button_B on”)); button_b = HIGH; digitalWrite(digiPin, button_b); } else if (income_AP.indexOf(F(“B/0”)) != -1) { Serial.println(F(“button_B off”)); button_b = LOW; digitalWrite(digiPin, button_b); } client.flush(); client.println(F(“HTTP/1.1 200 OK”)); client.println(F(“Content-type:text/html”)); client.println(F(“Connection: close”)); client.println(); String page; page = (const __FlashStringHelper *)HTTP_HEAD; page += (const __FlashStringHelper *)HTTP_STYLE; page += (const __FlashStringHelper *)HTTP_HEAD_END; page += (const __FlashStringHelper *)BUTTON_TYPE; if (button_a == HIGH) { page += (const __FlashStringHelper *)BUTTON_A_ON; } else { page += (const __FlashStringHelper *)BUTTON_A_OFF; } if (button_b == HIGH) { page += (const __FlashStringHelper *)BUTTON_B_ON; } else { page += (const __FlashStringHelper *)BUTTON_B_OFF; } page += (const __FlashStringHelper *)HTTP_END; client.print(page); client.println(); delay(1); break; } } client.stop(); Serial.println(F(“Client disconnected”)); } }

상기 코드를 아두이노에 업로드해주고 아래 그림처럼 스마트폰의 와이파이 연결 프로그램에서 “esp01_AP”에 연결을 한다.

웹브라우저에서 192.168.4.1을 입력하고 연결하여 원격제어를 해보면 된다.

soft AP 연결을 통해 ip주소를 확인하고 내부 네트워크를 통해 원격 제어하기

이번에는 station모드와 soft AP 모드를 동시에 사용할 수 있도록 ESP01에 설정을 하고 station 모드에서는 원격제어를 하고 soft AP 연결을 통해서는 공유기에서 할당받은 ip주소를 확인하도록 하여 시리얼 모니터 없이도 ip주소를 확인하고 station 모드를 통하여 제어를 할 수 있도록 코드를 작성해 보자.

– soft AP 연결

– station 연결

WiFiEsp.h 라이브러리에 정의된 soft AP 시작 옵션은 아래와 같다.

int WiFiEspClass::beginAP(const char* ssid, uint8_t channel, const char* pwd, uint8_t enc, bool apOnly)

if(apOnly) espMode = 2; // softAP 모드

else espMode = 3; // softAP와 station 동시 사용

따라서 softAP와 station을 동시에 사용하기 위해서는 soft AP 시작 함수에서 모드 설정을 해주어야 한다.

WiFi.beginAP(ssid_AP, 10, pass_AP, ENC_TYPE_WPA2_PSK, false); // 10:채널, false: 모드 설정

ip 주소는 자료형 IPAddress 변수 ip에 32비트 int값으로 저장된다.

WiFiEsp.h 라이브러리는 ip 주소를 아래 함수로 입력받는다.

IPAddress(uint8_t first_octet, uint8_t second_octet, uint8_t third_octet, uint8_t fourth_octet); // 입력

저장은 uint32_t address에 저장한다.

32비트 ip 주소값을 스트링 값으로 변환하기 위해 아래와 같은 코드를 추가해 주었다.

String stIp = “000.000.000.000”;

String toStringIp(IPAddress ip) {

String res = “”;

for (int i = 0; i < 3; i++) { res += String((ip >> (8 * i)) & 0xFF) + “.”;

}

res += String(((ip >> 8 * 3)) & 0xFF);

return res;

}

이전 코드에 웹브라우저에서 “192.168.4.1/ip”를 입력하면 공유기에서 할당받은 ip주소를 전송해주는 코드를 추가해 주었다.

if (income_AP.indexOf(F(“ip”)) != -1) {

if (status == WL_CONNECTED) {

page += F(“

IP Address: “);

page += stIp;

page += F(“

“);

} else page += F(“

Connection failed”);

}else {

실행코드

}

아래 스케치를 업로드하고 스마트폰에서 spft AP 연결한 뒤 웹브라우저에서 “192.168.4.1/ip”를 입력해서 ip주소를 확인하고 다시 스마트폰을 공유기에 연결한 다음 웹브라우저에 확인한 ip 주소를 입력하여 제어를 해보자.

#include “WiFiEsp.h” #include #define rxPin 3 #define txPin 2 SoftwareSerial esp01(txPin, rxPin); // SoftwareSerial NAME(TX, RX); const char ssid[] = “SK_WiFiGIGA40F7”; // your network SSID (name) const char pass[] = “1712037218”; // your network password int status = WL_IDLE_STATUS; // the Wifi radio’s status const char ssid_AP[] = “esp01_AP”; // your network SSID (name) const char pass_AP[] = “1234test”; // your network password #define ledPin 13 #define digiPin 7 WiFiEspServer server(80); String stIp = “000.000.000.000”; String toStringIp(IPAddress ip) { String res = “”; for (int i = 0; i < 3; i++) { res += String((ip >> (8 * i)) & 0xFF) + “.”; } res += String(((ip >> 8 * 3)) & 0xFF); return res; } void setup() { pinMode(ledPin, OUTPUT); pinMode(digiPin, OUTPUT); digitalWrite(ledPin, LOW); digitalWrite(digiPin, LOW); Serial.begin(9600); // initialize serial for debugging esp01.begin(9600); //와이파이 시리얼 WiFi.init(&esp01); // initialize ESP module while ( status != WL_CONNECTED) { // 약 10초동안 wifi 연결 시도 Serial.print(F(“Attempting to connect to WPA SSID: “)); Serial.println(ssid); status = WiFi.begin(ssid, pass); // Connect to WPA/WPA2 network IPAddress ip = WiFi.localIP(); Serial.print(“IP Address: “); stIp = toStringIp(ip); Serial.println(stIp); } // IPAddress localIp(192, 168, 111, 111); // softAP 접속 IP 설정 // WiFi.configAP(localIp); WiFi.beginAP(ssid_AP, 10, pass_AP, ENC_TYPE_WPA2_PSK, false); // 10:채널, false: softAP와 station 동시 사용모드 IPAddress ap = WiFi.localIP(); Serial.print(“AP Address: “); Serial.println(ap); server.begin(); } const char HTTP_HEAD[] PROGMEM = “” “” ““; const char HTTP_STYLE[] PROGMEM = “

“; const char HTTP_HEAD_END[] PROGMEM = “

” “

ESP01 Digital Pin Control

“; const char BUTTON_TYPE[] PROGMEM = “

” “

“; const char BUTTON_A_ON[] PROGMEM = “

Button A

“; const char BUTTON_A_OFF[] PROGMEM = “

Button A

“; const char BUTTON_B_ON[] PROGMEM = “

Button B

“; const char BUTTON_B_OFF[] PROGMEM = “

Button B

“; const char HTTP_END[] PROGMEM = “

“; bool button_a = LOW; // off bool button_b = LOW; // off void loop() { WiFiEspClient client = server.available(); // listen for incoming clients if (client) { // if you get a client, while (client.connected()) { // loop while the client’s connected if (client.available()) { // if there’s bytes to read from the client, String income_AP = client.readStringUntil(‘

‘); if (income_AP.indexOf(F(“A/1”)) != -1) { Serial.println(F(“button_A on”)); button_a = HIGH; digitalWrite(ledPin, button_a); } else if (income_AP.indexOf(F(“A/0”)) != -1) { Serial.println(F(“button_A off”)); button_a = LOW; digitalWrite(ledPin, button_a); } else if (income_AP.indexOf(F(“B/1”)) != -1) { Serial.println(F(“button_B on”)); button_b = HIGH; digitalWrite(digiPin, button_b); } else if (income_AP.indexOf(F(“B/0”)) != -1) { Serial.println(F(“button_B off”)); button_b = LOW; digitalWrite(digiPin, button_b); } client.flush(); client.println(F(“HTTP/1.1 200 OK”)); client.println(F(“Content-type:text/html”)); client.println(F(“Connection: close”)); client.println(); String page; page = (const __FlashStringHelper *)HTTP_HEAD; page += (const __FlashStringHelper *)HTTP_STYLE; page += (const __FlashStringHelper *)HTTP_HEAD_END; if (income_AP.indexOf(F(“ip”)) != -1) { if (status == WL_CONNECTED) { page += F(“

IP Address: “); page += stIp; page += F(“

“); } else page += F(“

Connection failed

“); }else { page += (const __FlashStringHelper *)BUTTON_TYPE; if (button_a == HIGH) page += (const __FlashStringHelper *)BUTTON_A_ON; else page += (const __FlashStringHelper *)BUTTON_A_OFF; if (button_b == HIGH) page += (const __FlashStringHelper *)BUTTON_B_ON; else page += (const __FlashStringHelper *)BUTTON_B_OFF; } page += (const __FlashStringHelper *)HTTP_END; client.print(page); client.println(); delay(1); break; } } client.stop(); Serial.println(F(“Client disconnected”)); } }

관련 글
[arduino] – 아두이노 – 와이파이, ESP01 wifi 모듈 무선 원격제어 그리고 시리얼 통신 – 6편
[arduino] – 아두이노 – 메모리(SRAM) 공간 확보를 위한 PROGMEM과 F() 매크로의 사용
[arduino] – 아두이노 – ESP01 모듈, 기상청 RSS / 오픈웨더맵 API 날씨 정보 받기
[arduino] – 아두이노 – 문자열의 이해와 표현 방법
[arduino] – 아두이노 – 와이파이 매니저, ESP01 soft AP를 통해 공유기 연결용 아이디와 비밀번호 설정하기

So you have finished reading the 아두 이노 웹 서버 topic article, if you find this article useful, please share it. Thank you very much. See more: 아두이노 esp8266 웹서버, 아두이노 이더넷 클라이언트

Top 22 아두 이노 웹 서버 Quick Answer

아두이노 이더넷 웹서버 만들기 -#1

아두이노 강좌 #48 이더넷 쉴드를 사용하여 Web Server 시작하기::Blacklog

아두이노 웹서버 구현 밑 컨트롤(LED on,off) : 네이버 블로그

아두이노 – ESP01 웹서버를 이용하여 웹페이지에서 디지털핀 원격제어, WiFiEsp.h :: postpop

아두이노(Arduino) 홈 IoT(사물인터넷)을 위한 서버(Sever) 구성 1: Apache 아파치 설치방법 :: IT-G-House

[IoT 네트워크 서비스 강좌] #4-3 ESP32를 웹 서버로 만들기 | Hard Copy World

아두이노 코딩-89: 아두이노 이더넷(Ethernet) 웹서버 코딩에 의한 LED ON OFF — Steemit

아두이노 웹서버 예제 분석

[ESP8266.006] 간단한 웹 서버 만들기

아두이노 이더넷 웹서버 만들기 -#1

아두이노 강좌 #48 이더넷 쉴드를 사용하여 Web Server 시작하기

Arduino Web Page

ESP01 웹서버를 이용하여 웹페이지에서 디지털핀 원격제어, WiFiEsp.h :: postpop

ESP01 Digital Pin Control

ESP01 Digital Pin Control

ESP01 Digital Pin Control

ESP01 Digital Pin Control

Leave a Comment Cancel reply