본문 바로가기

코딩 놀이

HTML 언어 구조

nodeMCU 서버와 스마트폰접속 코드입니다.

#include <ESP8266WiFi.h> //Wi-Fi 라이브러리로드

const char* ssid     = "iptime99"; // 공유기[네트워크] 명칭(SSID) 
const char* password = "zz19540410";  // 암호

WiFiServer server(80);  // 포트 번호를 80

String header;
unsigned long currentTime = millis();
unsigned long previousTime = 0; 
const long timeoutTime = 2000;       //2초

void setup() {
  Serial.begin(115200);
  // Connect to Wi-Fi network with SSID and password
  Serial.print("Connecting to ");
  Serial.println(ssid);
  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print(".");
  }

  // Print local IP address and start web server
  Serial.println("");
  Serial.println("WiFi connected.");
  Serial.println("IP address: ");
  Serial.println(WiFi.localIP());
  server.begin();
}

void loop(){
  WiFiClient client = server.available();   // Listen for incoming clients수신 고객 청취

  if (client) {                           
    String currentLine = "";                           
    currentTime = millis();
    previousTime = currentTime;
    while (client.connected() && currentTime - previousTime <= timeoutTime) { 
      currentTime = millis();         
      if (client.available()) {          
        char c = client.read();           
        Serial.write(c);                   
        header += c;
         if (c == '\n') {                  
         if (currentLine.length() == 0) {
             client.println("HTTP/1.1 200 OK");  //응답 :성공 코드 200 OK


             client.println("Content-type:text/html");
             client.println("Connection: close");
             client.println();
             client.println("<!DOCTYPE html><html>");
             client.println("<head></head>");
             client.println("<body>”);
             client.println(“<h1>ESP8266 Web Server</h1>");                     
            client.println("</body>”);
            client.println(“</html>");     
             client.println();       
            break;
          } else {
            currentLine = "";
          }
        } else if (c != '\r') { 
          currentLine += c;    
        }
      }
    }

    header = "";
    client.stop();
    Serial.println("Client disconnected.");
    Serial.println("");
  }
}
 변수 값 

#include <ESP8266WiFi.h> //Wi-Fi 라이브러리로드
const char* ssid     = "iptime99"; // 공유기[네트워크] 명칭(SSID) 

const char* password = "zz19540410";  // 암호

WiFiServer server(80);  // 포트 번호를 80

String header;

unsigned long currentTime = millis();

unsigned long previousTime = 0; 

const long timeoutTime = 2000;       //2초

 

변수 적용과 WiFi 접속

void setup() {

  Serial.begin(115200);

  // Connect to Wi-Fi network with SSID and password

  Serial.print("Connecting to ");

  Serial.println(ssid);

  WiFi.begin(ssid, password);

  while (WiFi.status() != WL_CONNECTED) {

    delay(500);

    Serial.print(".");

  }

 

  // Print local IP address and start web server

  Serial.println("");

  Serial.println("WiFi connected.");

  Serial.println("IP address: ");

  Serial.println(WiFi.localIP());

  server.begin();

}

서버(nodeMCU 보드) 와 클라이언트(스마트폰)

void loop(){

  WiFiClient client = server.available();   // 클라이언터 신호 대기


  if (client) {                           

    String currentLine = "";                           

    currentTime = millis();

    previousTime = currentTime;

    while (client.connected() && currentTime - previousTime <= timeoutTime) { 

      currentTime = millis();         

      if (client.available()) {          

        char c = client.read();           

        Serial.write(c);                   

        header += c;

         if (c == '\n') {                  

         if (currentLine.length() == 0) {

             client.println("HTTP/1.1 200 OK");  //응답 :성공 코드 200 OK

             client.println("Content-type:text/html");

             client.println("Connection: close");

             client.println();

             client.println("<!DOCTYPE html><html>");

             client.println("<head></head>");

             client.println("<body>”);

             client.println(“<h1>ESP8266 Web Server</h1>");                     

            client.println("</body>”);

            client.println(“</html>");     

             client.println();       

            break;

          } else {

            currentLine = "";

                  }

        } else if (c != '\r') { 

          currentLine += c;    

                                }

      }//client.available()

    } //while

    header = "";

    client.stop();

    Serial.println("Client disconnected.");

    Serial.println("");

  
} //client

}// End of loop

이 부분이 HTML 언어가 사용 될 부분입니다. 

client.println("<!DOCTYPE html><html>");

             client.println("<head></head>");

             client.println("<body>”);

             client.println(“<h1>ESP8266 Web Server</h1>");                     

            client.println("</body>”);

            client.println(“</html>");     

 

 HTML 코드 구조

              client.println("<body>”);

              <h1>ESP8266 Web Server</h1>");

               client.println("</body>");

 

[코드2] 이전코드에서 client.println,(", “); 를 지우면 [코드 2]와 같습니다.

<body>

<h1>ESP8266 Web</h1>

</body>

 

HTML언어 형식이 됩니다. 시작 <>, 끝</>


<html>

<head></head>        // 코드에 대한 정보

<body>                     //보여주는 문서

<h1>ESP8266 Web</h1>

</body>

</html>

 

       화면 중앙 제목 위치 태그 (div style)

              client.println("<body>") ;           

             client.println("<div style=text-align:center>");

              client.println("<p><h1>ESP8266 Web</h1> </p></div>");

             client.println("</body>");    

 

 

            

 

'코딩 놀이' 카테고리의 다른 글

HTML 2 LED 제어  (0) 2021.03.08
Button(HTML)  (0) 2021.03.08
서버와 스마트폰  (0) 2021.03.07
WiFi 공유기 접속  (0) 2021.03.07
nodeMCU wifi esp8266  (0) 2021.03.06