Web Server

In this example, you will use your Ethernet Shield and your Arduino board to create a simple Web server. Using the Ethernet library, your device will be able to answer a HTTP request with your Ethernet shield. After opening a browser and navigating to your Ethernet shield's IP address, your Arduino will respond with just enough HTML for a browser to display the input values from all six analog pins.

Step 1: What You Need?

1 x Arduino Board ( Arduino UNO used in this tutorial) 
1 x Arduino Ethernet Shield

Don't have components? Don't worry. Just click the component's name. 

Step 2: Build Your Circuit.

The Ethernet shield allows you to connect a WizNet Ethernet controller to the Arduino boards via the SPI bus. It uses pins 10, 11, 12, and 13 for the SPI connection to the WizNet. Later models of the Ethernet shield also have an SD Card on board. Digital pin 4 is used to control the slave select pin on the SD card.

The shield should be connected to a network with an Ethernet cable. You will need to change the network settings in the program to correspond to your network.

In the above image, the Arduino or Genuino board would be stacked below the Ethernet shield.

Step 3: Upload The Code.

1. Select the Arduino board type: Select Tools >> Board >> Select your correct Arduino board used.

2. Find the port number by accessing device manager on Windows. See the section Port (COM&LPT) and look for an open port named "Arduino Uno (COMxx)". If you are using a different board, you will find a name accordingly. What matters is the xx in COMxx part. In my case, it's COM3. So my port number is 3.

Select the right port: Tools >> Port >> Select the port number.

3. You can find this code in the example of Arduino IDE.

Select File >> Examples >> Ethernet >> WebServer

Click press the "upload" button (see the button with right arrow mark).

/*
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 02 Sept 2015
by Arturo Guadalupi */ #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:
byte mac[] = {
0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED
};
IPAddress ip(192, 168, 1, 177); // 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 setup() {
// Open serial communications and wait for port to open:
Serial.begin(9600);
while (!Serial) {
; // wait for serial port to connect. Needed for native USB port only
} // start the Ethernet connection and the server:
Ethernet.begin(mac, ip);
server.begin();
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;
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");
}
}

Warning

This example doesn't require an SD card. If an SD card is inserted but not used, it is possbile for the sketch to hang, because pin 4 is used as SS (active low) of the SD and when not used it is configured as INPUT by default. 

Two possible solutions:

• remove the SD card;
• add these lines of code in the setup()

pinMode(4, OUTPUT);
digitalWrite(4, HIGH);

Download:

Arduino IDE

Sources:https://www.arduino.cc/en/Tutorial/WebServer  

http://news.chivindo.com/687/web-server.html