--- title: "How to use with Arduino - Ethernet Shield W5100 (Web server)" url: "https://maker.wiznet.io/minsu/projects/How-to-use-with-Arduino-Ethernet-Shield-W5100-Web-server/" markdown_url: "https://maker.wiznet.io/minsu/projects/How-to-use-with-Arduino-Ethernet-Shield-W5100-Web-server/md" type: "UCC: User Created Content" author: "minsu" author_url: "https://maker.wiznet.io/minsu/" original_author: "minsu" original_url: "http://blogmasterwalkershop.com.br/arduino/arduino-utilizando-o-ethernet-shield-w5100-via-web-server/" published: "2019-04-02" language: "en" hardware: ["WIZnet W5100 ethernet shield"] likes: 0 views: 1300 comments: 0 source: "WIZnet Makers (https://maker.wiznet.io/)" --- # How to use with Arduino - Ethernet Shield W5100 (Web server) > How to use with Arduino - Ethernet Shield W5100 (Web server) Original author: minsu (source: http://blogmasterwalkershop.com.br/arduino/arduino-utilizando-o-ethernet-shield-w5100-via-web-server/) ## Components - **WIZnet W5100 ethernet shield** x 1 ([docs](https://www.wiznet.hk/en/open-source-hardware/102-w5100s-ethernetshield.html?search_query=W5100+ethernet+shield&results=84)) ## Documents and links - [MasterWalker Shop](https://www.youtube.com/watch?v=81LkZRGf1Ow) ## Article **- Description:** The??**Ethernet Shield W5100**??is a card that allows the Arduino to connect to a local network or the internet.?It has the Wiznet W5100 chip and supports up to four socket connections simultaneously.?The shield has a memory card slot (micro SD), where you can store files that can be sent over the local network / internet, and also has libraries for use by Arduino. Due to the need to connect the Arduino to the world wide web, the??**Ethernet Shield W5100**?was developed?**.?**Many projects developed with Arduino need access / control remotely and when using the Ethernet Shield W5100 this need is supplied in a simple and practical way, simply attach the shield to the Arduino, connect the shield to the router / modem through a RJ45 network cable, insert the correct source code into the Arduino and enjoy the benefits. By inserting Arduino on the internet, you can access it from anywhere in the world, whether with a computer, smartphone or tablet and get information or request that actions be performed.?For projects involving integration between Arduino and Android or iOS applications, the??**Ethernet Shield W5100**??becomes an important member of the project.?Because it is a shield, even attached to the top of the Arduino, you can still use most of the digital and analog ports on the board. **- Specifications and features:** -?Supported protocols: TCP / IP, UDP, ICMP, IPv4 ARP, IGMP, PPPoE, Ethernet?- Support (Full-duplex and half-duplex)?- Controller: W5100 - Operating voltage: 3.3V - 5VDC - Connection speed: 10 / 100Mb?-Duplex)?- Support ADSL connection (PPPoE with PAP / CHAP in authentication mode)?- Support 4 independent connections simultaneously?- Internal Memory: 16Kb for Tx / Rx buffers?- Arduino connection via SPI **?Practice wiring diagram:** [![img01_como_usar_com_arduino_ethernet_shield_w5100_uno_mega_2560_nano_internet_automacao_residencial_android_telefone_rele_web_server](https://maker.wiznet.io/upload/mirror/body/fd88997772bcdb291846.jpg)](http://blogmasterwalkershop.com.br/wp-content/uploads/2016/10/img01_como_usar_com_arduino_ethernet_shield_w5100_uno_mega_2560_nano_internet_automacao_residencial_android_telefone_rele_web_server.jpg) #include <SPI.h> //INCLUSAO DE BIBLIOTECA #include <Ethernet.h> //INCLUSAO DE BIBLIOTECA byte mac[] = { 0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED }; //ATRIBUICAO DE ENDERECO MAC AO ETHERNET SHIELD W5100 byte ip[] = { 192, 168, 0, 175 }; //COLOQUE UMA FAIXA DE IP DISPONIVEL DO SEU ROTEADOR. EX: 192.168.1.110?? ISSO VARIA, NO MEU CASO E: 192.168.0.175 byte gateway[] = {192, 168, 0, 1}; //GATEWAY DE CONEXAO (ALTERE PARA O GATEWAY DO SEU ROTEADOR) byte subnet[] = {255, 255, 255, 0}; //MASCARA DE REDE (ALTERE PARA A SUA MASCARA DE REDE) EthernetServer server(80); //PORTA EM QUE A CONEXAO SERA FEITA const int ledPin = 9; //PINO DIGITAL UTILIZADO PELO LED String readString = String(30); //VARIAVEL PARA BUSCAR DADOS NO ENDERECO (URL) int status = 0; //DECLARACAO DE VARIAVEL DO TIPO INTEIRA(SERA RESPONSAVEL POR VERIFICAR O STATUS ATUAL DO LED) void setup(){ ??Ethernet.begin(mac, ip, gateway, subnet); //PASSA OS PARAMETROS PARA A FUNCAO QUE VAI FAZER A CONEXAO COM A REDE ??server.begin(); //INICIA O SERVIDOR PARA RECEBER DADOS NA PORTA 80 ??pinMode(ledPin, OUTPUT); //DEFINE O PINO COMO SAIDA ??digitalWrite(ledPin, LOW); //LED INICIA DESLIGADO ??} void loop(){ EthernetClient client = server.available(); //CRIA UMA CONEXAO COM O CLIENTE ??if (client) { // SE EXISTE CLIENTE, FAZ ????while (client.connected()) {//ENQUANTO EXISTIR CLIENTE CONECTADO, FAZ ?? if (client.available()) { //SE O CLIENTE ESTA HABILITADO, FAZ ????char c = client.read(); //LE CARACTERE A CARACTERE DA REQUISICAO HTTP ????if (readString.length() < 100) //SE O ARRAY FOR MENOR QUE 100, FAZ ??????{ ????????readString += c; // "readstring" VAI RECEBER OS CARACTERES LIDO ??????}?? ????????if (c == 'n') { //SE ENCONTRAR "n" E O FINAL DO CABECALHO DA REQUISICAO HTTP ??????????if (readString.indexOf("?") <0){ //SE ENCONTRAR O CARACTER "?", FAZ ??????????} ??????????else //SENAO,FAZ ????????if(readString.indexOf("ledParam=1") >0) //SE ENCONTRAR O PARAMETRO "ledParam=1", FAZ ?????????? { ???????????? digitalWrite(ledPin, HIGH); //LIGA O LED ???????????? status = 1; //VARIAVEL RECEBE VALOR 1(SIGNIFICA QUE O LED ESTA LIGADO) ?????????? }else{ //SENAO, FAZ ???????????? digitalWrite(ledPin, LOW); //DESLIGA O LED ???????????? status = 0; //VARIAVEL RECEBE VALOR 0(SIGNIFICA QUE O LED ESTA DESLIGADO)???????????? ?????????? } ??????????client.println("HTTP/1.1 200 OK"); //ESCREVE PARA O CLIENTE A VERSAO DO HTTP ??????????client.println("Content-Type: text/html"); //ESCREVE PARA O CLIENTE O TIPO DE CONTEUDO(texto/html) ??????????client.println(""); ??????????client.println("<!DOCTYPE HTML>"); //INFORMA AO NAVEGADOR A ESPECIFICACAO DO HTML ??????????client.println("<html>"); //ABRE A TAG "html" ??????????client.println("<head>"); //ABRE A TAG "head" ??????????client.println("<link rel='icon' type='image/png' href='http://blogmasterwalkershop.com.br/arquivos/artigos/sub_wifi/logo_mws.png'/>"); //DEFINICAO DO ICONE DA PAGINA ??????????client.println("<title>MasterWalker Shop - Controle de Led via Web server</title>"); //ESCREVE O TEXTO NA PAGINA ??????????client.println("</head>"); //FECHA A TAG "head" ??????????client.println("<body style=background-color:#ADD8E6>"); //DEFINE A COR DE FUNDO DA PAGINA ??????????client.println("<center><font color='blue'><h1>MASTERWALKER SHOP</font></center></h1>"); //ESCREVE "MASTERWALKER SHOP" EM COR AZUL NA PAGINA ??????????client.println("<h1><center>CONTROLE DE LED</center></h1>"); //ESCREVE "CONTROLE DE LED" NA PAGINA ??????????if (status == 1){ //SE VARIAVEL FOR IGUAL A 1, FAZ ??????????//A LINHA ABAIXO CRIA UM FORMULARIO CONTENDO UMA ENTRADA INVISIVEL(hidden) COM O PARAMETRO DA URL E CRIA UM BOTAO APAGAR (CASO O LED ESTEJA LIGADO) ??????????client.println("<center><form method=get name=LED><input type=hidden name=ledParam value=0 /><input type=submit value=APAGAR></form></center>"); ??????????}else{ //SENAO, FAZ ??????????//A LINHA ABAIXO CRIA UM FORMULARIO CONTENDO UMA ENTRADA INVISIVEL(hidden) COM O PARAMETRO DA URL E CRIA UM BOTAO ACENDER (CASO O LED ESTEJA DESLIGADO) ??????????client.println("<center><form method=get name=LED><input type=hidden name=ledParam value=1 /><input type=submit value=ACENDER></form></center>"); ??????????} ??????????client.println("<center><font size='5'>Status atual do LED: </center>"); //ESCREVE "Status atual do LED:" NA PAGINA ??????????if (status == 1){ //SE VARIAVEL FOR IGUAL A 1, FAZ ??????????????client.println("<center><font color='green' size='5'>LIGADO</center>"); //ESCREVE "LIGADO" EM COR VERDE NA PAGINA ??????????}else{ //SENAO, FAZ ??????????????client.println("<center><font color='red' size='5'>DESLIGADO</center>"); //ESCREVE "DESLIGADO" EM COR VERMELHA NA PAGINA ??????????}???? ??????????client.println("<hr/>"); //TAG HTML QUE CRIA UMA LINHA HORIZONTAL NA PAGINA ??????????client.println("<hr/>"); //TAG HTML QUE CRIA UMA LINHA HORIZONTAL NA PAGINA ??????????client.println("</body>"); //FECHA A TAG "body" ??????????client.println("</html>"); //FECHA A TAG "html" ??????????readString=""; //A VARIAVEL E REINICIALIZADA ??????????client.stop(); //FINALIZA A REQUISICAO HTTP E DESCONECTA O CLIENTE ????????????} ??????????} ????????} ??????} } --- Source: https://maker.wiznet.io/minsu/projects/How-to-use-with-Arduino-Ethernet-Shield-W5100-Web-server/