Arduino Forum

Community => Exhibition / Gallery => Topic started by: JO3RI on Mar 11, 2011, 09:09 pm

Title: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: JO3RI on Mar 11, 2011, 09:09 pm
Finished the project, you can check it out on my project page: http://www.jo3ri.be/arduino/arduino-projects/network-settings-web-page-form-using-eeprom-to-save-submit (http://www.jo3ri.be/arduino/arduino-projects/network-settings-web-page-form-using-eeprom-to-save-submit).

and here you have a picture:

(https://lh6.googleusercontent.com/-3TcshITc4do/Tk5N8GjjA9I/AAAAAAAAABk/iEdLW7LsGEQ/s800/Ethernet_Setup.PNG)

Quote
Before you get drawling, I'm not that far yet. But what I want to accomplish is a little webserver with a page to change your IP, MAC, STATIC or DHCP and save it, don't know how yet, but I'll will get there  :*

So far I have been able to make the webpage:

(https://lh5.googleusercontent.com/_7n_h0hDSpmo/TXqAT-WXJEI/AAAAAAAAACY/Vkl4HhI34uA/s800/Schermafbeelding%202011-03-11%20om%2020.54.54.jpg)

and here you have the code so far:

Code: [Select]
/*
This a a demo webpage trying to reproduce the arduino website look
You will need the arduino ethernet shield

made by JO3RI www.JO3RI.be/arduino
*/

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

// This is the hardware address of the Arduino on your network.
// You won't need to change this. Learn more here.
byte mac[] = { 0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED };

// This is the tcp/ip address of the Arduino on your network.
// You will access the Arduino by typing it in a web browser like
// this: http://192.168.1.177 Learn more here.
// You might want to change this to be the same as your computer's
// IP address except for the last number. Learn more here.
byte ip[] = { 192, 168, 14, 85};

// Create a server named webserver listening on port 80 (http). You
// don't want to change the port number. Learn more about ports or
// the server class.
Server webserver(80);

// Functions that are run once when the Arduino is started
void setup()
{

// Bring the Arduino on the network using the MAC and IP we
//specified before. Learn more about Ethernet.begin().
Ethernet.begin(mac, ip);
// Start a server on the port we specified before. Learn more
// about server.begin().
webserver.begin();

}

// Repeat these functions as long as the Arduino is powered on
void loop()
{

// Create a client named webclient listening for connections to the
// server. Learn more about Client or server.available()
Client webclient = webserver.available();

// If someone connects to the server...
if (webclient) {

// Create a variable to hold whether or not we have received a blank
// line from the web browser
boolean current_line_is_blank = true;

// Run the following code as long as the client remains connected
// Learn more about client.connected()
while (webclient.connected()) {

// If the client has sent us some data...
// Learn more about client.available()
if (webclient.available()) {

// Keep the last letter of whatever they sent us
// Learn more about client.read()
char c = webclient.read();

// If we've gotten to the end of the line (received a newline
// character) and the line is blank, the http request has ended,
// so we can send a reply
if (c == 'n' && current_line_is_blank) {

// Send a basic HTTP response header (the blank line at the end
// is required). Learn more about client.println()
webclient.println("HTTP/1.1 200 OK");
webclient.println("Content-Type: text/html");
webclient.println();

// Now send whatever html you want to appear on the web page
webclient.println("<html><body marginwidth\"0\" marginheight=\"0\" topmargin=\"0\" leftmargin=\"0\" style=\"margin: 0; padding: 0;\">");
webclient.println("<table bgcolor=\"#999999\" border=\"0\" width=\"100%\" cellpadding=\"1\">");
webclient.println("<tr><td><font color=\"white\" size=\"2\" face=\"Verdana\">&nbsp Arduino Ethernet Shield setup page</font></td></tr></table><br>");
webclient.println("<table border=\"0\" width=\"100%\"><tr><td width=110px>&nbsp</td><td width=200px><style>pre {font-size:8pt; letter-spacing:2px; line-height:8pt; font-weight:bold;}</style>");
webclient.println("<pre><font color=\"#00979d\">");
webclient.println("    ###      ###   TM");
webclient.println("  ##   ##  ##   ##  ");
webclient.println(" ##     ####  #  ## ");
webclient.println(" #  ###  ##  ### ## ");
webclient.println(" ##     ####  #  ## ");
webclient.println("  ##   ##  ##   ##  ");
webclient.println("   #####    #####   ");
webclient.println("</font></pre></td><td>&nbsp</td></tr><tr><td width=110px>&nbsp</td>");
webclient.println("<td width=200px><font color=\"#00979d\" size=\"6\" face=\"Verdana\"><strong> ARDUINO</strong></font></td><td>&nbsp</td></tr></table><br>");
webclient.println("<table bgcolor=\"#00979d\" border=\"0\" width=\"100%\" cellpadding=\"3\"><tr><td width=105px></td>");
webclient.println("<td width=120px><font color=\"white\" size=\"2\" face=\"Verdana\">Network info</font></td><td width=120px>");
webclient.println("<font color=\"white\" size=\"2\" face=\"Verdana\">Network setup</font></td><td></td></tr></table></body></html>");

break;

}

// If we received a new line character from the client ...
if (c == 'n') {

// Track that the line is blank
current_line_is_blank = true;

// If we don't receive a new line character and don't receive an r
} else if (c != 'r') {

// Track that we we got some data
current_line_is_blank = false;

}

}

}

// Give the client some time to receive the page
// Learn more about delay()
delay(1);

// Close the connection to the client now that we are finished
// Learn more about client.stop()
webclient.stop();

}

}


I still have to clean up the code so it might use less Binary sketch size: 6522 bytes
Title: Re: Ethernet Shield setup page
Post by: JO3RI on Mar 13, 2011, 10:33 am
This time, I managed to get the logo in the website. I had to change it into base64, so I could put into the sketch itself. This is only as a show-off, because it eats memory, so in the later progress I'll probably ditch it.

(https://lh6.googleusercontent.com/_7n_h0hDSpmo/TXui_-ILFzI/AAAAAAAAAC4/sN_4vHYgAD0/s800/Schermafbeelding%202011-03-12%20om%2017.42.51.jpg)
Title: Re: Ethernet Shield setup page
Post by: JO3RI on Mar 13, 2011, 12:58 pm
Thanks to bubulindo in my other post http://arduino.cc/forum/index.php/topic,55064.0.html (http://arduino.cc/forum/index.php/topic,55064.0.html) I'm able to show the network information of the webserver. Only the word "static" is just html.

(https://lh5.googleusercontent.com/_7n_h0hDSpmo/TXytPQAXfsI/AAAAAAAAADk/Zlahj38b10Q/s800/Schermafbeelding%202011-03-13%20om%2012.38.57.jpg)

Oh, and I managed to show free and used SRAM. As you can see, not much left. next thing I'll do is putting things into Flash memory and probably I need to put configuration info into EEPROM memory. So that it survives reboot.
Title: Re: Ethernet Shield setup page
Post by: JO3RI on Mar 15, 2011, 06:03 pm
This time I managed to get SRAM down to 493 by feeding the HTML from flash memory piece by piece to SRAM. This has it's consequences, Flash got over 8000 bytes. Next step is using EEPROM for config.

(https://lh3.googleusercontent.com/_7n_h0hDSpmo/TX-bAPtXghI/AAAAAAAAAEg/yWZYBuroIGg/s800/Schermafbeelding%202011-03-15%20om%2017.58.24.jpg)
Title: Re: Ethernet Shield setup page
Post by: techadmin on Mar 24, 2011, 05:20 pm
For any followers, this project is in collaboration with this one: http://arduino.cc/forum/index.php/topic,54324.0.html

If your sending your project to someone with no development experience, maybe your dad, or a potential client you've built a prototype for, or your using your Arduino in multiple locations (and not all have DHCP servers), then you just want to be able use the product out of the box on a network, like a home router, plug and play, this will be the solution.
Title: Re: Ethernet Shield setup page
Post by: JO3RI on Mar 24, 2011, 09:00 pm
Ok so I already got this far. I have competed the HTML (using PROGMEM to put it into Flashmemory and a buffer to flow the HTML through strait to the webclient)

EEPROM is now being used to save your choices (put getting the info out of the POST doesn't work yet). The sketch starts with pre-sets and puts those into EEPROM, the second time the sketch is run it will know and automatically read out of EEPROM (hence the reset button to clear the "know" bit => not functional yet)

(https://lh4.googleusercontent.com/_7n_h0hDSpmo/TYuglN_YTmI/AAAAAAAAAFw/Tu6laMkHO54/s800/Schermafbeelding%202011-03-24%20om%2020.50.18.jpg)
Title: Re: Ethernet Shield setup page
Post by: techadmin on Mar 24, 2011, 09:13 pm
Looks very promising.
Title: Re: Ethernet Shield setup page
Post by: JO3RI on Mar 25, 2011, 03:17 pm
@techadmin: I need your help on getting the information out of the form submission, you know: look for an ? read the what has been filled out.
Title: Re: Ethernet Shield setup page
Post by: techadmin on Mar 25, 2011, 06:09 pm
I've been pretty tied up this week.  You'll need to copy that get url into a string or buffer when the html form is submitted then parse the text in the buffer.

I set mine up like this:

Code: [Select]

#define maxLengthWEB 100
String inString = String(maxLengthWEB);


Code: [Select]

  if (client) {
    boolean currentLineIsBlank = true;
    while (client.connected()) {     
      if (client.available()) {
        char c = client.read();
                                         
           if (inString.length() < maxLengthWEB) {   
                inString.concat(c);       
           }


After form:
Code: [Select]

String stringOne = inString;


Then use indexOf to extract the number between the & and = symbols.  This is from my code, should be able to modify to work with yours.

Code: [Select]

        int firstequaltemp = stringOne.indexOf('=');
        int secondequaltemp = stringOne.indexOf('=', firstequaltemp + 1); //firstequal + 1 means the second equal in the get string
       
        int firstandtemp = stringOne.indexOf('&');
        int secondandtemp = stringOne.indexOf('&', firstandtemp + 1);       

Title: Re: Ethernet Shield setup page
Post by: JO3RI on Mar 27, 2011, 05:30 pm
OK, thanks. I'm busy too. Waiting for our third child to be born this week. That will give me some sleepless nights  :smiley-sleep: . But I'll continue the work for sure. 8)
Title: Re: Ethernet Shield setup page
Post by: techadmin on Mar 27, 2011, 11:22 pm
Awesome man, congrats.  Yeah, my 2 year old is a hand full, I'll come to my computer and find chunks of code deleted, or added characters, (I make massive code revisions), she broke my N key off, pulls wires, etc, etc.

I have my code working finally, we'll be posting soon and looking at your code again, very nice structure.
Title: Re: Ethernet Shield setup page
Post by: xanok on Mar 28, 2011, 01:35 am
Beautiful! xD

I imagine that your problem is the sizes of pages, right?
Ever consider storing the pages in SD Card?
Because that is what I plan to do when I receive my ethernet shield and SD shield ;)

Anyway, good luck!
Title: Re: Ethernet Shield setup page
Post by: JO3RI on Apr 02, 2011, 02:21 pm
Hi, all. Our newborn son Siebe is now 6 days old and doing well. Time to get back to Arduino.  :D

@xanok: We know you can use SD, but we don't want to. My final goal is a library for Ethernet Setup. That would make it very easy for other projects to have a network one can easy set up. (more arduino's on the same network)

So It's time to dive into the

Code: [Select]
#define maxLengthWEB 100
String inString = String(maxLengthWEB);
Title: Re: Ethernet Shield setup page
Post by: rainjacks on Apr 13, 2011, 05:39 pm
I'm looking into this as well.  I am especially interested in using the SD card instead of EEPROM.  That way you can create an ini file on the card from another computer that contains all of the settings.  Also, the HTML files can be served from the card freeing up that much more memory.

I've got serving html from an SD card working.  Now I am working on reading data from the card for ethernet settings and being able to save the settings back to the card.

If there is anyone who has already been down this road I'd rather not reinvent the wheel.   :)
Title: Re: Ethernet Shield setup page
Post by: JO3RI on Aug 13, 2011, 10:12 am
I finally found out how to read the data out of the URL, so now I can finish this project. I'll dump all html code and restart with a very simple web page.

DHCP or STATIC
IP
MASK
HW
Title: Re: Ethernet Shield setup page
Post by: JO3RI on Aug 13, 2011, 05:25 pm
This is now how the setup page will look like (for now). I want to keep memory use as low as possible, so ...

(https://lh6.googleusercontent.com/-DxSXCnbBQYo/TkaWFV4qmgI/AAAAAAAABYA/i0EtSrO0wzg/s800/Schermafbeelding%2525202011-08-13%252520om%25252017.14.01.jpg)

Now I'm off putting the code into arduino.
Title: Re: Ethernet Shield setup page
Post by: JO3RI on Aug 13, 2011, 11:10 pm
With this sketch you can already fill out the form and it will stay in the ARduino's memory. You can follow what's happening on the Serial Monitor.

Code: [Select]
#include <SPI.h>
#include <Ethernet.h>
#include <TextFinder.h>

//CHANGE THIS TO MAKE THIS SKETCH WORK

byte IP1 = 192;//the first part of the IP-address
byte IP2 = 168; //the second part of the IP-address
byte IP3 = 1; //the thirth part of the IP-address
byte IP4 = 2; //the fourth part of the IP-address
byte GW1 = 192; //the first part of the GATEWAY
byte GW2 = 168; //the second part of the GATEWAY
byte GW3 = 1; //the thirth part of the GATEWAY
byte GW4 = 1; //the fourth part of the GATEWAY
byte SUB1 = 255; //first part of the SUBNETMASK
byte SUB2 = 255; //the second part of the SUBNETMASK
byte SUB3 = 255; //the thirth part of the SUBNETMASK
byte SUB4 = 0; //the fourth part of the SUBNETMASK
byte TYPE = 1; //the type is set to 1 = static

byte mac[] = { 0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED };
byte ip[] = {IP1,IP2,IP3,IP4};
byte gateway[] = {GW1,GW2,GW3,GW4};
byte subnet[] = {SUB1,SUB2,SUB3,SUB4};
Server server(80);

void setup()
{
  Serial.begin(9600);
  Ethernet.begin(mac, ip, gateway, subnet);
  server.begin();
  Serial.println("ready");
}

void loop()
{
  Client client = server.available();
  if (client) {
    TextFinder  finder(client );
    while (client.connected()) {     
      if (client.available()) {         
        if( finder.find("GET /") ) {
          Serial.println("connection has been made");
          if (finder.findUntil("ST", "\n\r")){
            Serial.println("found static or dhcp");
            TYPE = finder.getValue();
              while(finder.findUntil("DT", "\n\r")){
                int val = finder.getValue();
                if(val >= 0 && val <= 3) {
                  ip[val] = finder.getValue();
                }
                if(val >= 4 && val <= 7) {
                  subnet[val - 4] = finder.getValue();
                }
                if(val >= 8 && val <= 11) {
                  gateway[val - 8] = finder.getValue();
                }
              }
            }
            Serial.println();
            if ( TYPE == 1 ){
              Serial.print("type is static");
            }
            if ( TYPE == 2 ){
              Serial.print("type is dhcp");
            }
            Serial.println();
            Serial.print("The IP address is:");
            Serial.print(ip[0],DEC);
            for (int i= 1; i < 4; i++){
              Serial.print(".");
              Serial.print(ip[i],DEC);
            }
            Serial.println();
            Serial.print("The Subnet is:");
            Serial.print(subnet[0],DEC);
            for (int i= 1; i < 4; i++){
              Serial.print(".");
              Serial.print(subnet[i],DEC);
            }
            Serial.println();
            Serial.print("The gateway is:");
            Serial.print(gateway[0],DEC);
            for (int i= 1; i < 4; i++){
              Serial.print(".");
              Serial.print(gateway[i],DEC);
            }
            Serial.println();
          }           
        client.println("HTTP/1.1 200 OK");
          client.println("Content-Type: text/html");
          client.println();
          client.print("<html><body><table><form><tr><td>TYPE: <select name=\"ST\">");
          client.print("<option value=\"1\">static</option><option value=\"2\">dhcp</option></select></td></tr>");
          client.print("<tr><td>IP: <input type=\"text\" size=\"1\" maxlength=\"3\" name=\"DT0\" value=\"");
          client.print(ip[0],DEC);
          client.print("\">.<input type=\"text\" size=\"1\" maxlength=\"3\" name=\"DT1\" value=\"");
          client.print(ip[1],DEC);
          client.print("\">.<input type=\"text\" size=\"1\" maxlength=\"3\" name=\"DT2\" value=\"");
          client.print(ip[2],DEC);
          client.print("\">.<input type=\"text\" size=\"1\" maxlength=\"3\" name=\"DT3\" value=\"");
          client.print(ip[3],DEC);
          client.print("\"></td></tr><tr><td>MASK: <input type=\"text\" size=\"1\" maxlength=\"3\" name=\"DT4\" value=\"");
          client.print(subnet[0],DEC);
          client.print("\">.<input type=\"text\" size=\"1\" maxlength=\"3\" name=\"DT5\" value=\"");
          client.print(subnet[1],DEC);
          client.print("\">.<input type=\"text\" size=\"1\" maxlength=\"3\" name=\"DT6\" value=\"");
          client.print(subnet[2],DEC);
          client.print("\">.<input type=\"text\" size=\"1\" maxlength=\"3\" name=\"DT7\" value=\"");
          client.print(subnet[3],DEC);
          client.print("\"></td></tr><tr><td>GW: <input type=\"text\" size=\"1\" maxlength=\"3\" name=\"DT8\" value=\"");
          client.print(gateway[0],DEC);
          client.print("\">.<input type=\"text\" size=\"1\" maxlength=\"3\" name=\"DT9\" value=\"");
          client.print(gateway[1],DEC);
          client.print("\">.<input type=\"text\" size=\"1\" maxlength=\"3\" name=\"DT10\" value=\"");
          client.print(gateway[2],DEC);
          client.print("\">.<input type=\"text\" size=\"1\" maxlength=\"3\" name=\"DT11\" value=\"");
          client.print(gateway[3],DEC);
          client.print("\">.</td></tr><tr><td><input type=\"submit\" value=\"SUBMIT\"></td></tr>");
          client.print("</form></table><br><FORM>");
          client.print("'\"></FORM></body></html>");
          client.print("free test SRAM = ");
          client.print(availableMemory());
          client.print(" / SRAM used = ");
          client.print(2048-availableMemory());
          break;
        }
      }
    delay(1);
    client.stop();
  }
}

int availableMemory()
{
  int size = 2048;
  byte *buf;
  while ((buf = (byte *) malloc(--size)) == NULL);
  free(buf);
  return size;
}
Title: Re: Ethernet Shield setup page
Post by: JO3RI on Aug 14, 2011, 03:21 pm
DONE, I managed to make the setup page. I didn't use dhcp or static any longer. Now you can change IP, SUBNETMASK and GATEWAY, but for now you'll have the hard reset. You'll also notice the sketch eats SRAM, which is not good, but you could use a buffer to flow the HTML through it, keeping all the HTML code out of SRAM.

if you want to know how, read this: http://www.jo3ri.be/arduino/arduino-projects/an-integrated-webpage-with-image (http://www.jo3ri.be/arduino/arduino-projects/an-integrated-webpage-with-image)

here you have the sketch:
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: JO3RI on Aug 19, 2011, 02:31 pm
Made it better, follow the link to my project page shown in my very first post http://arduino.cc/forum/index.php/topic,55044.msg394301.html#msg394301 (http://arduino.cc/forum/index.php/topic,55044.msg394301.html#msg394301)
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: vk5oi on Oct 31, 2012, 12:58 am
Hello JO3RI
thankyou or your hard work here, this is exactly what I need to make a PLC network tester, with one small thing missing DHCP/Static choice.
I have been trying, but I can not make this work, it just hangs when DHCP selected. Did you manage to make that work? Why did you remove it?
I have also tried your older code with DHCP but it doesn't seem to stay selected, it changes back to static.
Any help much appreciated
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: JO3RI on Oct 31, 2012, 04:29 pm
Hi vk5oi,

thanks for trying out my code, now for your question.

There is a reason why I ditched DHCP. for DHCP you'll need the Arduino IDE above 1.0, but when you do, it will not compile because it's confusing DNS for some reason (I don't really know why) and it only is with the byte DNS[] = { , , , }

Now in my code you won't find anything on DNS, but I have been working on this thing for other projects and there it has DNS included (needed for things like twitter lookups). Maybe I should continue my work on this and include a choice on DHCP/STATIC. But I'll have to figure out how to get it working on the new IDE.

this is actually how those setup pages look at this moment:

(https://lh4.googleusercontent.com/-cZi-Ejj02L0/T3l7C74j5YI/AAAAAAAAAME/RZnBRuqvlQk/s1600/CastDuinoSlave02.JPG)

from my project CastDuino (CastDuino Slave): http://www.jo3ri.be/arduino/projects/castduino (http://www.jo3ri.be/arduino/projects/castduino)

(http://www.jo3ri.be/arduino/projects/tank-level-measuring-basic/TLM_configeth.PNG)

from my project DUAL TANK LEVEL MEASURING: http://www.jo3ri.be/arduino/projects/tank-level-measuring-basic (http://www.jo3ri.be/arduino/projects/tank-level-measuring-basic)
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: JO3RI on Oct 31, 2012, 04:42 pm
Now if you're willing to help, I could update the code so you have the choice between static and DHCP.

I need to know some things:

- do you need other webpages (look at those screenshots, you'll see more pages for your own stuff)
- do you need that fancy layout (or do you want minimalistic)
- what Arduino IDE are you using?
- do you need the DNS ip (without it, it might be quiet simple to add dhcp support)
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: vk5oi on Nov 05, 2012, 03:42 am
Hello J03RI
sorry for the delay, life interferes with my fun.
Thanks again, for your work, this is (nearly) perfect for me but I could not possibly achieve this alone. Somehow I just can not get the details right.
To answer your questions.

I need only 1 page, just setup, I will use also an LCD to display IP, Gateway, connection to server (ping) ok, if DHCP or Static etc.
The fancy layout is nice, but I need only basic form for entering data.
I can use IDE 1.0 or 1.0.1
I don't think I need DNS, but...maybe to make my ping function work (for example ping www.google.com) to test internet connectivity.

I hope this is ok? I can try to explain my application further if you need, but what you have done is so close except for DHCP/Static.

Cheers, and thanks
John
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: JO3RI on Nov 05, 2012, 10:34 pm
Quote
I hope this is ok? I can try to explain my application further if you need, but what you have done is so close except for DHCP/Static
.

Ok, I'll continue my work and add dhcp/static switch, but you'll have to give me time.

1 more question. What has to be default? Static or dhcp. You'll have to consider a lot, before deciding.
2nd extra question. Does it have to save settings into EEEprom? Once done, you can't fall back on a simple reset button to go back to default settings (or has this to be a possible selection: save to eeprom/don't save to eeprom)
3th question: why don't I make separate program for your needs, but then I need full explanation of your project, better email about it and we'll work together. info at JO3RI.be
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: vk5oi on Nov 05, 2012, 10:46 pm
Hi J03RI
Please take all the time you need, I am the one who needs help, I can wait, no problems.
I think I will email, and explain the idea fully.

Cheers
John
Title: A bug?
Post by: AntonG on Jan 18, 2013, 04:27 pm
Hello JO3RI

thanks for sharing your work!

I used your Webpage with some modifications in my project. Basically, I want to be able to change IP address from browser, transmit some simple data, and have some sensor readings.

I encountered strange bahaviour: first time I load "setup" page, and submit form data, everything works as expected. However, if I use same form to submit data again, values from first submit get transferred. After third try, data from second time finally arrives and so on. Some research showed, that parser gets all values twice: from the form (or request URL) itself, and from "referer" field.

In other words: After we press "submit" button, we also see all form contents in URL in our browser. Next time we press button, we send new form data again, and once more old data as referring URL.

The reason for the bug is that terminate expression in findUntil is wrong, and it leads to referer being parsed. According to Wiki (http://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol#Request_message) the request line and headers must all end with /r/n. And that's what I see in Wireshark. Now, you look for /n/r, i.e. other way around. I guess, you just took example from TextFinder manual, which was wrong.

I hope I understand everything right. Feel free to correct me, if it's not the case.
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: JO3RI on Jan 20, 2013, 10:51 am
Hi AntonG,

Thanks man and you are right. Some time ago, I made an other sketch (a better one) that I'm using in all, but I should make a new one, basic for other people to use, I know and I will. Just need more time.

Have fun and take a look at my other projects: http://www.jo3ri.be (http://www.jo3ri.be)
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: jduncan on Apr 29, 2013, 02:35 am
Wow, this sketch goes 99% of the way I need to go for a project i just started working on.

Unfortunately, when I try to compile it in IDE 1.0.1 on Fedora, I get a TON of compilation errors:

Code: [Select]
hack.cpp:59:1: error: 'prog_char' does not name a type
hack.cpp:60:1: error: 'prog_char' does not name a type
hack.cpp:61:1: error: 'prog_char' does not name a type
hack.cpp:62:1: error: 'prog_char' does not name a type
hack.cpp:63:56: error: variable 'string_table0' must be const in order to be put into read-only section by means of '__attribute__((progmem))'
hack.cpp:63:61: error: 'htmlx0' was not declared in this scope
hack.cpp:63:69: error: 'htmlx1' was not declared in this scope
hack.cpp:63:77: error: 'htmlx2' was not declared in this scope
hack.cpp:63:85: error: 'htmlx3' was not declared in this scope
hack.cpp:65:1: error: 'prog_char' does not name a type
hack.cpp:66:1: error: 'prog_char' does not name a type
hack.cpp:67:1: error: 'prog_char' does not name a type
hack.cpp:68:1: error: 'prog_char' does not name a type
hack.cpp:69:1: error: 'prog_char' does not name a type
hack.cpp:70:1: error: 'prog_char' does not name a type
hack.cpp:71:1: error: 'prog_char' does not name a type
hack.cpp:72:1: error: 'prog_char' does not name a type
hack.cpp:73:56: error: variable 'string_table1' must be const in order to be put into read-only section by means of '__attribute__((progmem))'
hack.cpp:73:61: error: 'htmla0' was not declared in this scope
hack.cpp:73:69: error: 'htmla1' was not declared in this scope
hack.cpp:73:77: error: 'htmla2' was not declared in this scope
hack.cpp:73:85: error: 'htmla3' was not declared in this scope
hack.cpp:73:93: error: 'htmla4' was not declared in this scope
hack.cpp:73:101: error: 'htmla5' was not declared in this scope
hack.cpp:73:109: error: 'htmla6' was not declared in this scope
hack.cpp:73:117: error: 'htmla7' was not declared in this scope
hack.cpp:75:1: error: 'prog_char' does not name a type
hack.cpp:76:1: error: 'prog_char' does not name a type
hack.cpp:77:1: error: 'prog_char' does not name a type


Can someone point me in the right direction?
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: JO3RI on Apr 29, 2013, 08:57 am
Hi there,

Using IDE 1.0.1 You'll need the pgmspace.h library: http://www.arduino.cc/en/Reference/PROGMEM (http://www.arduino.cc/en/Reference/PROGMEM)

But you will encounter other problems to, better is to upgrade to IDE 1.0.3 (no need to look for pgmspace.h library) or higher and you should be ready to continue
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: mariusnet on May 04, 2015, 03:17 pm
hi
i know this is an old post but is there any way that you can fix your sketch?
won`t work on 1.6.3
thank you
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: sakugava on Jun 11, 2015, 08:29 am
Update to compile with Arduino 1.6.4 / 1.6.5.
Read this  (http://forum.arduino.cc/index.php?topic=272313.0)to understand the modifications
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: sakugava on Jun 11, 2015, 04:23 pm
In my last post I uploaded a sketch that I use with the ENC28J60 ethernet controller. If you want to use with the WIZ5100 controller (the Arduino official one), just change the line #include <UIPEthernet.h> to #include <Ethernet.h>.
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: technofreek on Jun 26, 2015, 11:04 am
Hello,
I was able to compile in installed IDE (Not stand alone file) ver 1.0.5-r2, using UIPEthernet library.
successfully compiled EthernetSetup1_1 , will be adding more options like selct DHCP and STATIC.
There is a bug in MAC address field. Eg mac: 00:02:8A:FE:0F , leading zeros are omited.
Any one has a fix ?

One more issue I am running into:
After I add some html code in
Code: [Select]
prog_char htmla0 and
Code: [Select]
prog_char htmla1  it does not save first two digits of mac address.


Thanks
Sudheer

Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: JO3RI on Aug 05, 2015, 09:36 am
Hi, It has been a long time since I visited this forum (very long)

Nice to see people kept working on the code.

Leading zero's is a problem indeed, "posting" a zero = to posting nothing. To be honest, I don't have a clue on how to fix it.
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: overdrive69 on Feb 24, 2016, 08:04 am
Hello,
to reset the Arduino from Software i use this

https://github.com/WickedDevice/SoftReset/tree/e73cf5af75f790e6ff85f9e89ecf3de42e530293

So now everytime i press submit it resets the Arduino if there where some changes in the settings.

Edit: At the moment it only works with ip changes, not with Mac changes
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: mcnobby on Mar 20, 2016, 02:05 pm
Hi I am also using the basic front end of this project for my own..
I made a few discoveries...

Instead of going mad with using progmem to store the HTML, you can use Macro F

Code: [Select]

client.println(F("HTTP/1.1 200 OK")); //send new page
client.println(F("Content-Type: text/html"));
client.println(F("Connection: close"));  // the connection will be closed after completion of the response


really neatens things up for you ...

Also I was wondering about this soft restart...

I was thinking you could call up a line of assembler that would basically do a direct jump to the program start vector...

Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: mcnobby on Mar 20, 2016, 08:33 pm
Im really pleased with mine so far, in the end mine is a long way from where I started with the code on here, it uses some nice simple CSS, JS and DOM
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: xyzbilal on Apr 11, 2016, 09:37 pm
hello everyone,

in addition to this project I want to form this project to setup server address
which is I want to post sensor data to. but I could not manage to change  an store in eeprom web server information which is stored as default string value.  anybody can help me to solve this issue..

thanks for help..
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: mcnobby on Apr 12, 2016, 10:37 am
I saw something on-line about how to do this, I shall try and find the link for it...
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: tushar19 on Jun 26, 2017, 10:58 am
Need help...
Anyone has modified the code for another server entry i.e.
MAC,IP,GW,MASK,SERVER1 on to the webpage.
I tried but the the submit is having some issue-the previous data displays after submitting new!
As I don't know html coding I tried tweaking JO3RI first post code.
TIA.
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: Dias1 on Feb 09, 2019, 03:36 pm
For Server use this:


byte mac[] = {0xDE, 0xAD, 0xBE, 0xAA, 0xFE, 0xAE }; //assign arduino mac address  
byte ip[] = {192, 168, 0, 177 }; // ip in lan assigned to arduino                
byte gateway[] = {192, 168, 0, 1 }; // internet access via router              
byte subnet[] = {255, 255, 255, 0 }; //subnet mask                              
byte serverName[] = { 192, 168, 0, 101 }; // (IP)  web page server IP address  
byte dnsserver[] = {192,168,0,1};        //-------------------
EthernetServer server(80); //server port arduino server will use



// This is the HTML code all chopped up. The best way to do this is, is by typing
// your HTML code in an editor, counting your characters and divide them by 8.
// you can chop your HTML on every place, but not on the \" parts. So remember,
// you have to use \" instead of simple " within the HTML, or it will not work.

const char htmlx0[] PROGMEM = "<html><title>Arduino Ethernet Setup Page</title><body marginwidth=\"0\" marginheight=\"0\" ";
const char htmlx1[] PROGMEM = "leftmargin=\"0\" style=\"margin: 0; padding: 0;\"><table bgcolor=\"#999999\" border";
const char htmlx2[] PROGMEM = "=\"0\" width=\"100%\" cellpadding=\"1\" style=\"font-family:Verdana;color:#fff";
const char htmlx3[] PROGMEM = "fff;font-size:12px;\"><tr><td>&nbsp Arduino Ethernet Setup Page</td></tr></table><br>";
PROGMEM const char* const string_table0[] = {htmlx0, htmlx1, htmlx2, htmlx3};

const char htmla0[] PROGMEM = "<script>function hex2num (s_hex) {eval(\"var n_num=0X\" + s_hex);return n_num;}";
const char htmla1[] PROGMEM = "</script><table><form><input type=\"hidden\" name=\"SBM\" value=\"1\"><tr><td>MAC:";
const char htmla2[] PROGMEM = "<input id=\"T1\" type=\"text\" size=\"2\" maxlength=\"2\" name=\"DT1\" value=\"";
const char htmla3[] PROGMEM = "\">.<input id=\"T3\" type=\"text\" size=\"2\" maxlength=\"2\" name=\"DT2\" value=\"";
const char htmla4[] PROGMEM = "\">.<input id=\"T5\" type=\"text\" size=\"2\" maxlength=\"2\" name=\"DT3\" value=\"";
const char htmla5[] PROGMEM = "\">.<input id=\"T7\" type=\"text\" size=\"2\" maxlength=\"2\" name=\"DT4\" value=\"";
const char htmla6[] PROGMEM = "\">.<input id=\"T9\" type=\"text\" size=\"2\" maxlength=\"2\" name=\"DT5\" value=\"";
const char htmla7[] PROGMEM = "\">.<input id=\"T11\" type=\"text\" size=\"2\" maxlength=\"2\" name=\"DT6\" value=\"";
PROGMEM const char* const string_table1[] = {htmla0, htmla1, htmla2, htmla3, htmla4, htmla5, htmla6, htmla7};

const char htmlb0[] PROGMEM = "\"><input id=\"T2\" type=\"hidden\" name=\"DT1\"><input id=\"T4\" type=\"hidden\" name=\"DT2";
const char htmlb1[] PROGMEM = "\"><input id=\"T6\" type=\"hidden\" name=\"DT3\"><input id=\"T8\" type=\"hidden\" name=\"DT4";
const char htmlb2[] PROGMEM = "\"><input id=\"T10\" type=\"hidden\" name=\"DT5\"><input id=\"T12\" type=\"hidden\" name=\"D";
const char htmlb3[] PROGMEM = "T6\"></td></tr><tr><td>IP: <input type=\"text\" size=\"3\" maxlength=\"3\" name=\"DT7\" value=\"";
const char htmlb4[] PROGMEM = "\">.<input type=\"text\" size=\"3\" maxlength=\"3\" name=\"DT8\" value=\"";
const char htmlb5[] PROGMEM = "\">.<input type=\"text\" size=\"3\" maxlength=\"3\" name=\"DT9\" value=\"";
const char htmlb6[] PROGMEM = "\">.<input type=\"text\" size=\"3\" maxlength=\"3\" name=\"DT10\" value=\"";
PROGMEM const char* const string_table2[] = {htmlb0, htmlb1, htmlb2, htmlb3, htmlb4, htmlb5, htmlb6};

const char htmlc0[] PROGMEM = "\"></td></tr><tr><td>MASK: <input type=\"text\" size=\"3\" maxlength=\"3\" name=\"DT11\" value=\"";
const char htmlc1[] PROGMEM = "\">.<input type=\"text\" size=\"3\" maxlength=\"3\" name=\"DT12\" value=\"";
const char htmlc2[] PROGMEM = "\">.<input type=\"text\" size=\"3\" maxlength=\"3\" name=\"DT13\" value=\"";
const char htmlc3[] PROGMEM = "\">.<input type=\"text\" size=\"3\" maxlength=\"3\" name=\"DT14\" value=\"";
PROGMEM const char* const string_table3[] = {htmlc0, htmlc1, htmlc2, htmlc3};

const char htmld0[] PROGMEM = "\"></td></tr><tr><td>GW: <input type=\"text\" size=\"3\" maxlength=\"3\" name=\"DT15\" value=\"";
const char htmld1[] PROGMEM = "\">.<input type=\"text\" size=\"3\" maxlength=\"3\" name=\"DT16\" value=\"";
const char htmld2[] PROGMEM = "\">.<input type=\"text\" size=\"3\" maxlength=\"3\" name=\"DT17\" value=\"";
const char htmld3[] PROGMEM = "\">.<input type=\"text\" size=\"3\" maxlength=\"3\" name=\"DT18\" value=\"";
PROGMEM const char* const string_table4[] = {htmld0, htmld1, htmld2, htmld3};

const char htmle0[] PROGMEM = "\"></td></tr><tr><td>Server: <input type=\"text\" size=\"3\" maxlength=\"3\" name=\"DT19\" value=\"";
const char htmle1[] PROGMEM = "\">.<input type=\"text\" size=\"3\" maxlength=\"3\" name=\"DT20\" value=\"";
const char htmle2[] PROGMEM = "\">.<input type=\"text\" size=\"3\" maxlength=\"3\" name=\"DT21\" value=\"";
const char htmle3[] PROGMEM = "\">.<input type=\"text\" size=\"3\" maxlength=\"3\" name=\"DT22\" value=\"";
const char htmle4[] PROGMEM = "\"></td></tr><tr><td><br></td></tr><tr><td><input id=\"button\"type=\"submit\" value=\"SUBMIT\" ";
const char htmle5[] PROGMEM = "></td></tr></form></table></body></html>";
PROGMEM const char* const string_table5[] = {htmle0, htmle1, htmle2, htmle3, htmle4, htmle5};



const char htmlf0[] PROGMEM = "Onclick=\"document.getElementById('T2').value ";
const char htmlf1[] PROGMEM = "= hex2num(document.getElementById('T1').value);";
const char htmlf2[] PROGMEM = "document.getElementById('T4').value = hex2num(document.getElementById('T3').value);";
const char htmlf3[] PROGMEM = "document.getElementById('T6').value = hex2num(document.getElementById('T5').value);";
const char htmlf4[] PROGMEM = "document.getElementById('T8').value = hex2num(document.getElementById('T7').value);";
const char htmlf5[] PROGMEM = "document.getElementById('T10').value = hex2num(document.getElementById('T9').value);";
const char htmlf6[] PROGMEM = "document.getElementById('T12').value = hex2num(document.getElementById('T11').value);\"";
const char htmlf7[] PROGMEM = "\"></td></tr><tr><td><br></td></tr><tr><td><input id=\"button\"type=\"button\" onmousedown=location.href=\"/index.html\"  value=\"HOME\" ";
PROGMEM const char* const string_table6[] = {htmlf0, htmlf1, htmlf2, htmlf3, htmlf4, htmlf5, htmlf6, htmlf7};

const byte ID = 0x92; //used to identify if valid data in EEPROM the "know" bit,
// if this is written in EEPROM the sketch has ran before
// We use this, so that the very first time you'll run this sketch it will use
// the values written above.
// defining which EEPROM address we are using for what data
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: Dias1 on Feb 09, 2019, 03:58 pm
void setup(){


ShieldSetup (); //Setup the Ethernet shield
// Ethernet.begin(mac,ip,gateway,gateway,subnet);
// Ethernet.setRetransmissionTimeout(50);  // set the Ethernet controller's timeout to 50 ms
server.begin();
Serial.begin(9600);
//Serial.println("server/client 1.0 test 7/03/12"); // keep track of what is loaded
//Serial.println("Send an g in serial monitor to test client"); // what to do to test client
Serial.print("local IP is  ");
Serial.println(Ethernet.localIP());
Serial.print("local MAC is  ");
Serial.print(mac[0],HEX);
Serial.print(":");
Serial.print(mac[1],HEX);
Serial.print(":");
Serial.print(mac[2],HEX);
Serial.print(":");
Serial.print(mac[3],HEX);
Serial.print(":");
Serial.print(mac[4],HEX);
Serial.print(":");
Serial.println(mac[5],HEX);
Serial.print("remote server's IP is  ");
Serial.print(serverName[0],DEC);
Serial.print(".");
Serial.print(serverName[1],DEC);
Serial.print(".");
Serial.print(serverName[2],DEC);
Serial.print(".");
Serial.println(serverName[3],DEC);
Serial.print("the gateway is  ");
Serial.print(gateway[0],DEC);
Serial.print(".");
Serial.print(gateway[1],DEC);
Serial.print(".");
Serial.print(gateway[2],DEC);
Serial.print(".");
Serial.println(gateway[3],DEC);
Serial.print("the subnet is  ");
Serial.print(subnet[0],DEC);
Serial.print(".");
Serial.print(subnet[1],DEC);
Serial.print(".");
Serial.print(subnet[2],DEC);
Serial.print(".");
Serial.println(subnet[3],DEC);
Serial.print("local server Port is  ");
Serial.print(serverport[0],HEX);


}
Title: Re: Network settings web page FORM using EEPROM to save submit [DONE]
Post by: 9H1LO on Mar 28, 2019, 10:10 pm
has there been any further development with this ? or a new library exists ? looking for a setup page which such as this with ability to setup static or dhcp and server address stored in eeprom and compilable on 1.8+ as these example need lots of tweaks....got the first examples from JO3RI (is it a ham call ??) working but would like to have the dhcp & server address option but he seems to have abandoned the code