레이블이 ioShield-A인 게시물을 표시합니다. 모든 게시물 표시
레이블이 ioShield-A인 게시물을 표시합니다. 모든 게시물 표시

2014년 11월 18일 화요일

Note9 – WebServer controlled LED Sketch

ArduinoNote List-page
PREVIOUS: Note8 - WebServer controlled LED Demo

Web Server controlled LED Sketch



[code lang=cpp]
/*
Web Server

A simple web server that shows the value of the analog input pins.
using an Arduino Wiznet Ethernet shield.

Circuit:
* Ethernet shield attached to pins 10, 11, 12, 13
* Analog inputs attached to pins A0 through A5 (optional)

created 18 Dec 2009
by David A. Mellis
modified 9 Apr 2012
by Tom Igoe
modified 15 Nov 2014
by Soohwan Kim
*/

#include <SPI.h>
#include <Ethernet.h>

// Enter a MAC address and IP address for your controller below.
// The IP address will be dependent on your local network:
#if defined(WIZ550io_WITH_MACADDRESS) // Use assigned MAC address of WIZ550io
;
#else
byte mac[] = {0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED};
#endif

//#define __USE_DHCP__

IPAddress ip(192,168,1,20);
IPAddress gateway( 192, 168, 1, 1 );
IPAddress subnet( 255, 255, 255, 0 );
// fill in your Domain Name Server address here:
IPAddress myDns(8, 8, 8, 8); // google puble dns

// Initialize the Ethernet server library
// with the IP address and port you want to use
// (port 80 is default for HTTP):
EthernetServer server(80);
void check_led_status();
// Define the LED PORT NUMBER
#define LED_PORT 53

void setup() {
// Open serial communications and wait for port to open:
Serial.begin(9600);
while (!Serial) {
; // wait for serial port to connect. Needed for Leonardo only
}

// initialize the LED PORT
pinMode(LED_PORT, OUTPUT);
// initaial value is HIGH
digitalWrite(LED_PORT, HIGH);

// initialize the ethernet device
#if defined __USE_DHCP__
#if defined(WIZ550io_WITH_MACADDRESS) // Use assigned MAC address of WIZ550io
Ethernet.begin();
#else
Ethernet.begin(mac);
#endif
#else
#if defined(WIZ550io_WITH_MACADDRESS) // Use assigned MAC address of WIZ550io
Ethernet.begin(ip, myDns, gateway, subnet);
#else
Ethernet.begin(mac, ip, myDns, gateway, subnet);
#endif
#endif

// start the Ethernet connection and the server:
server.begin();
Serial.println("WebServerControlLED");
Serial.print("server is at ");
Serial.println(Ethernet.localIP());
}


void loop() {
// listen for incoming clients
EthernetClient client = server.available();
if (client) {
Serial.println("new client");
// an http request ends with a blank line
boolean currentLineIsBlank = true;
String buffer = ""; // Declare the buffer variable
while (client.connected()) {
if (client.available()) {
char c = client.read();
buffer += c; // Assign to the buffer
Serial.write(c);
// if you've gotten to the end of the line (received a newline
// character) and the line is blank, the http request has ended,
// so you can send a reply
if (c == 'n' && currentLineIsBlank) {
// send a standard http response header
client.println("HTTP/1.1 200 OK");
client.println("Content-Type: text/html");
client.println();
//client.println("<!DOCTYPE HTML>");
client.println("<html>");
client.println("<body>");

// check the LED status
if (digitalRead(LED_PORT)>0){
client.println("LED is <font color='green'>ON</font>");
}else{
client.println("LED is <font color='red'>OFF</font>");
}

// generate the Form
client.println("<br />");
client.println("<FORM method="get" action="/led.cgi">");
client.println("<P> <INPUT type="radio" name="status" value="1">ON");
client.println("<P> <INPUT type="radio" name="status" value="0">OFF");
client.println("<P> <INPUT type="submit" value="Submit"> </FORM>");

client.println("</body>");
client.println("</html>");
break;
}
if (c == 'n') {
// you're starting a new line
currentLineIsBlank = true;
buffer="";
}
else if ( c == 'r') {
//do cgi parser for LED-On
if(buffer.indexOf("GET /led.cgi?status=1")>=0){
// cgi action : LED-On
digitalWrite(LED_PORT, HIGH);
// send web-page
client.println("HTTP/1.1 200 OK");
client.println("Content-Type: text/html");
client.println();
client.println("<html>");
client.println("<body>");
// check the LED status
if (digitalRead(LED_PORT)>0){
client.println("LED is <font color='green'>ON</font>");
}else{
client.println("LED is <font color='red'>OFF</font>");
}
client.println("<br />");
client.println("<a href="/led.htm">Go to control-page</a>");

client.println("</body>");
client.println("</html>");
currentLineIsBlank = false;
break;
}

//do cgi parser for LED-Off
if(buffer.indexOf("GET /led.cgi?status=0")>=0){
// action : LED-Off
digitalWrite(LED_PORT ,LOW);
// send web-page
client.println("HTTP/1.1 200 OK");
client.println("Content-Type: text/html");
client.println();
client.println("<html>");
client.println("<body>");
// check the LED status
if (digitalRead(LED_PORT)>0){
client.println("LED is <font color='green'>ON</font>");
}else{
client.println("LED is <font color='red'>OFF</font>");
}
client.println("<br />");
client.println("<a href="/led.htm">Go to control-page</a>");

client.println("</body>");
client.println("</html>");
currentLineIsBlank = false;
break;
}
}
else{ //if( c != 'r') {
// you've gotten a character on the current line
currentLineIsBlank = false;
}
}
}
// give the web browser time to receive the data
delay(1);
// close the connection:
client.stop();
Serial.println("client disonnected");
}
}
[/code]

Note8 - WebServer controlled LED DEMO.

ArduinoNote List-page
PREVIOUS: Note7 - WebServer controlled LED

Web Server controlled LED Demo



Web Client(Web-browser)를 이용하여 아래와 같이 Web Server(Arduino)에 접속하여 LED Monitoring과 Remote-Control를 해보자


  • Web-browser의 주소란에 Arduino Board의 IP address와 "/index.htm"입력

    192.168.77.177/index.htm (IP address는 Sketch에서 설정한 값을 이용함)



    • index.htm page : LED Status와 Form을 확인 할 수 있다.

    • index.htm의 Source(HTML)보기: Web-server에서 Generate된 HTML를 확인 할 수 있다.

    • index.htm:WireShark를 이용한 Web-server와 Web Client간의 Message교환
      빨간색 : Web-Client가 GET을 이용하여 Web-page를 요청
      파란색 : Web-Server가 "HTTP/1.1 200 OK~"와 Web-page를 Respones함

    • LED ON submit Web-page: LED Status와 "led.cgi/status=1"를 확인 할 수 있다.

    • LED ON submit Web-page: Source보기

    • LED ON submit Web-page: WireShark를 이용한 Web-server와 Web Client간의 Message교환
      빨간색 : Web-Client가 GET을 "/led.cgi?status=1"를 이용하여 LED ON을 요청
      파란색 : Web-Server가 "HTTP/1.1 200 OK~"와 LED Status를 Respones함


    • LED OFF submit Web-page: LED Status와 "led.cgi/status=1"를 확인 할 수 있다.


    • LED OFF submit Web-page: Source보기

    • LED OFF submit Web-page:WireShark를 이용한 Web-server와 Web Client간의 Message교환
      빨간색 : Web-Client가 GET을 "/led.cgi?status=0"를 이용하여 LED OFF을 요청
      파란색 : Web-Server가 "HTTP/1.1 200 OK~"와 LED Status를 Respones함


  • Link:Wireshark

    "Wireshark is a network protocol analyzer for Unix and Windows"
    쉽게 말해 Packet Capture Program!




NEXT : Note9 - WebServer controlled LED Sketch

Note7 - WebServer controlled LED

ArduinoNote List-page
PREVIOUS: Note6 - WebServer

Hand-on #4: WebServer controlled LED



-Ethernet Shield를 이용한 Remote Control(LED On/Off)과 Monitoring(LED Status)을 함께 해보자

Common Gateway Interface




WWW 서버와 서버 상에서 등장하는 다른 프로그램이나 스크립트와의 인터페이스. 폼을 사용한 메일의 송신이나 게임 등, HTML에서는 불가능한 인터랙티브(interactive)한 요소를 홈페이지에 받아들여 쓸 수 있다.
[네이버 지식백과] CGI [common gateway interface] (컴퓨터인터넷IT용어대사전, 2011.1.20, 일진사)



  • Get Request / Receive Req. / CGI parser
    Get Request:cgi


  • Run the CGI App: run CGI scripts
    Run the CGI App.


  • Response: call web_server_send from CGI app. and back to Response
    Web Response




Hardware



Arduino / WIZ550io / LED
* LED를 적절한 포트에 연결한다. 이때, LED에 과전류를 방지하기 위해 저항을 달아준다.

Install Ethenret Library





Network Configuration



Network Configuration


  • Network Configuration on PC side
    Network Configuration
    위와 같이 "Internet Protocol Properies"에서 Network구성을 Test를 위해 아래와 같이 설정해보자
    IP address : 192.168.1.2
    Subnet mask : 255.255.255.0



Default gateway : 192.168.1.1



WebServerControlLED Skeleton




  • Fixed IP address



[code lang=cpp]
//#define __USE_DHCP__

IPAddress ip(192,168,1,20);
IPAddress gateway( 192, 168, 1, 1 );
IPAddress subnet( 255, 255, 255, 0 );
// fill in your Domain Name Server address here:
IPAddress myDns(8, 8, 8, 8); // google puble dns
}
[/code]


  • Port Setting



[code lang=cpp]
// Initialize the Ethernet server library
// with the IP address and port you want to use
// (port 80 is default for HTTP):
EthernetServer server(80);
[/code]


  • setup()



[code lang=cpp]
// Define the LED PORT NUMBER
// ...insert codes... #define LED_PORT XX

void setup() {
// Open serial communications and wait for port to open:
Serial.begin(9600);
while (!Serial) {
; // wait for serial port to connect. Needed for Leonardo only
}


// initialize the LED PORT
// ...insert codes ...
// initaial value is HIGH
// ...insert codes ...


// initialize the ethernet device
#if defined __USE_DHCP__
#if defined(WIZ550io_WITH_MACADDRESS) // Use assigned MAC address of WIZ550io
Ethernet.begin();
#else
Ethernet.begin(mac);
#endif
#else
#if defined(WIZ550io_WITH_MACADDRESS) // Use assigned MAC address of WIZ550io
Ethernet.begin(ip, myDns, gateway, subnet);
#else
Ethernet.begin(mac, ip, myDns, gateway, subnet);
#endif
#endif

// start the Ethernet connection and the server:
server.begin();
// ...insert codes ... Welcome messages
Serial.print("server is at ");
// ...insert codes ... print localIP
}

[/code]


  • loop()



[code lang=cpp]
void loop() {
// listen for incoming clients
EthernetClient client = server.available();
if (client) {
Serial.println("new client");
// an http request ends with a blank line
boolean currentLineIsBlank = true;
String buffer = ""; // Declare the buffer variable
while (client.connected()) {
if (client.available()) {
char c = client.read();
buffer += c; // Assign to the buffer
Serial.write(c);
// if you've gotten to the end of the line (received a newline
// character) and the line is blank, the http request has ended,
// so you can send a reply
if (c == 'n' && currentLineIsBlank) {
// send a standard http response header
client.println("HTTP/1.1 200 OK");
client.println("Content-Type: text/html");
client.println();
//client.println("<!DOCTYPE HTML>");
client.println("<html>");
client.println("<body>");

// check the LED status
// ...insert codes ...

// generate the Form
// ...insert codes ...

client.println("</body>")
client.println("</html>");
break;
}
if (c == 'n') {
// you're starting a new line
currentLineIsBlank = true;
buffer="";
}
else if ( c == 'r') {
//do cgi parser for LED-On
//if(...insert codes ...
// action : LED-On
//digitalWrite(...insert codes ...
// send web-page
client.println("HTTP/1.1 200 OK");
client.println("Content-Type: text/html");
client.println();
client.println("<html>");
client.println("<body>");
// check the LED status
// ...insert codes ...
client.println("<br />");
client.println("<a href="/led.htm">Go to control-page</a>");

client.println("</body>");
client.println("</html>");
currentLineIsBlank = false;
break;
}

//do cgi parser for LED-Off
//if(...insert codes ...
// action : LED-Off
//digitalWrite(...insert codes ...
// send web-page
client.println("HTTP/1.1 200 OK");
client.println("Content-Type: text/html");
client.println();
client.println("<html>");
client.println("<body>");
// check the LED status
// ...insert codes ...
client.println("<br />");
client.println("<a href="/led.htm">Go to control-page</a>");

client.println("</body>");
client.println("</html>");
currentLineIsBlank = false;
break;
}
}
else{ //if( c != 'r') {
// you've gotten a character on the current line
currentLineIsBlank = false;
}
}
}
// give the web browser time to receive the data
delay(1);
// close the connection:
client.stop();
Serial.println("client disonnected");
}
}
[/code]

NEXT : Note8 - WebServer controlled LED Demo

Note6 - WebServer

ArduinoNote List-page
PREVIOUS: Note5 - isShield-A

Hand-on #3: WebServer



-Ethernet Shield를 이용한 Remote monitoring을 해보자

Web-Server?



Web-Server는 Web-site를 hosting하고 있는 서버로 간단하게 아래의 그림과 같이 Web brower와 같은 Client가 Web-server에 저장되어 있는 Web-page에 대한 Request 요청했을 경우 해당 Wep-page를 Client에세 Reponse하는 Server는 말한다. 이때 Web-server와 Client는 Hypertext Transfer Protocol (HTTP)통해서 hypertext를 Trasfer/Exchange한다.

Network Configuration

Get Request:index.htm

Install Ethenret Library





Network Configuration on PC side



Network Configuration

위와 같이 "Internet Protocol Properies"에서 Network구성을 Test를 위해 아래와 같이 설정해보자

    IP address : 192.168.1.2
Subnet mask : 255.255.255.0
Default gateway : 192.168.1.1


Web Server Sketch




  • Fixed IP address



[code lang=cpp]
IPAddress ip(192, 168, 1, 20);
IPAddress gateway(192, 168, 1, 1);
IPAddress subnet(255, 255, 255, 0);
// fill in your Domain Name Server address here:
IPAddress myDns(8, 8, 8, 8); // google puble dns
void setup() {
...
#if defined(WIZ550io_WITH_MACADDRESS) // Use assigned MAC address of WIZ550io
Ethernet.begin(ip, myDns, gateway, subnet);
#else
Ethernet.begin(mac, ip, myDns, gateway, subnet);
#endif
...
}
[/code]


  • Port Setting



[code lang=cpp]
// Initialize the Ethernet server library
// with the IP address and port you want to use
// (port 80 is default for HTTP):
EthernetServer server(80);
[/code]


  • setup()



[code lang=cpp]
void setup()
{
// Open serial communications and wait for port to open:
Serial.begin(9600);
while (!Serial)
{
; // wait for serial port to connect. Needed for Leonardo only
}

// start the Ethernet connection and the server:
#if defined(WIZ550io_WITH_MACADDRESS) // Use assigned MAC address of WIZ550io
Ethernet.begin(ip, myDns, gateway, subnet);
#else
Ethernet.begin(mac, ip, myDns, gateway, subnet);
#endif
server.begin();
Serial.print("server is at ");
Serial.println(Ethernet.localIP());
}

[/code]


  • loop()



[code lang=cpp]
void loop() {
// listen for incoming clients
EthernetClient client = server.available();
if (client) {
Serial.println("new client");
// an http request ends with a blank line
boolean currentLineIsBlank = true;
while (client.connected()) {
if (client.available()) {
char c = client.read();
Serial.write(c);
// if you've gotten to the end of the line (received a newline
// character) and the line is blank, the http request has ended,
// so you can send a reply
if (c == 'n' && currentLineIsBlank) {
// send a standard http response header
client.println("HTTP/1.1 200 OK");
client.println("Content-Type: text/html");
client.println("Connection: close"); // the connection will be closed after completion of the response
client.println("Refresh: 5"); // refresh the page automatically every 5 sec
client.println();
client.println("<!DOCTYPE HTML>");
client.println("<html>");
// output the value of each analog input pin
for (int analogChannel = 0; analogChannel < 6; analogChannel++) {
int sensorReading = analogRead(analogChannel);
client.print("analog input ");
client.print(analogChannel);
client.print(" is ");
client.print(sensorReading);
client.println("<br />");
}
client.println("</html>");
break;
}
if (c == 'n') {
// you're starting a new line
currentLineIsBlank = true;
}
else if (c != 'r') {
// you've gotten a character on the current line
currentLineIsBlank = false;
}
}
}
// give the web browser time to receive the data
delay(1);
// close the connection:
client.stop();
Serial.println("client disconnected");
}

[/code]

Compile




  • IDE 메뉴의 스케치>확인/컴파일
    Verify



Program




  • IDE 메뉴의 파일>프로그램어를통해업로드
    Upload



Web-Client (Web-browser)를 이용하여 Web-server (Arduino Board)에 접속




  • web-browser을 실행하고 주소창에 아래와 같이 입력한다.

    http://"Arduino board IP address":"port number
    http://192.168.1.20:80

  • Web-browser실행 화면
    실제로 port에서 입력된 값을 Web-page를 통해 보여줌으로써 Remote Monitoring이 가능함을 보여준다. 5개의 값들은 ADC입력 값을 출력한다. 현재 ADC에 입력이 없기 때문에 Dummy값이 출력되는 것을 볼수 있다.
    Web-browser
    Serial Monitor를 통해 Log값을 볼수 있다. Welcome message와 Web-Client로 부터 수신한 내용을 확인 할 수 있다.
    Serial Monitor



NEXT : Note7 - WebServer controlled LED

Note5 - ioShield-A

ArduinoNote List-page
PREVIOUS: Note4 - Ethernet shield

ioShield-A



ioSheild-A

ioShield-A는 Arduino Platform을 Internet에 연결하게 해주는 Ethernet Shield의 하나이다. Ethernet Shield는 TCP/IPCore Chip으로 W5100의 기반으로 하였으나, ioShield는 W5500을 적용하였다. W5500은 동시에 W5100보다 많은 소켓 수(8Socket)지원 할 수 있으며, Fast SPI (upto 80MHz)를 지원한다. 특별히, 이 Ethenret Shield는 WIZ550io와 Installing Board로 구성되어 있으며, WIZ550io에서 embedded된 MAC Address를 지원하기 때문에 별도의 MAC Address구매없이 Real MAC Address를 사용할 수 있다.

ioShield-A
* WIZ550io: wizwiki
* Schematic: ioshield-a_v1.1_sch.pdf
* Ethernet Library: WIZ_Ethernet_Library
* SPI port: ICSP Header사용
* Github: frizing project for WIZ550io

WIZ Ethernet Library Install




  • Download Library: WIZ_Ethernet_Library-master.zip


  • 압축해제 한뒤 Ethernet폴더를 Copy한다.
    Ethernet폴더


  • 기존의 Sketch IDE를 설치하고 생긴 C:/Program Files/Arduino/Ethernet폴더와 Replace한다.
    Ethernet폴더 replace


  • Ethernet Library에 /Arduino/Ethernet/examples 아래와 같이 다양한 example들이 포함되어 있다.
    Ethernet Library




NEXT : Note6 - WebServer