DSCF2311

Arduino Project: HTML to LCD

The original source code for this project can be found Here, and an updated version of it for Arduino-1.0 can be found Here.

WHAT YOU NEED:

  1. Arduino (I use the UNO, but I think the older revisions should also work)
  2. An Ethernet Shield
  3. 16×2 Basic Character LCD (There are many more colour options than just white on black)
  4. An Ethernet cable (I just used an old one lying around)
  5. A Breadboard  or some other means to connect the LCD to the Arduino and one 2.2 kΩ resistor

WHAT IT DOES:

This project combines the above to turn the Arduino into web server which is hooked up to the LCD. It produces a simple HTML web page, from which the user may see what text is currently displayed on the LCD, and provides them the opportunity to change the text using simple input forms. The hardware side of this project is fairly simple, and there were no physical hacks or modifications that needed to be made. The real challenge to this project were working within the limitations of the Arduino as a computing device.

SETUP AND OPERATION:

As we can see, the Ethernet shield is plugged into the Arduino, and is hooked up to the breadboard and LCD according to the scheme outlined in the comments of the source code. This one is completely set up and running, since there is already some text displayed on the LCD. The Arduino’s digital pins 4, 10, 11, 12 and 13 are left free since they are utilized by the shield. All the remaining pins are used by the LCD, so unfortunately this means all of the digital IO pins are used which restricts future additions to this project . The Arduino is also being powered over the USB cable, since this allows me to use the serial monitor to debug, and also because the Wiznet chip and voltage regulator get very hot when my 9V wall adapter is used. I have read that this may be because the shield draws a fair amount of current, and the linear voltage regulator reduces the voltage in accordance with the equation       P = I*ΔV. The power is proportional to the current draw, and it is dissipated by the voltage regulator in the form of heat.

With those notes aside, we can connect to the web page by typing in the local network IP address of the Arduino, which I have set up to be fixed using my router’s DHCP reservation functionality. The Arduino did not automatically receive an IP address when the Ethernet cable was first plugged in, so it was necessary to manually add the it to the router’s client list using the mac address on the underside of the shield.

On the web page served by the Arduino it tells us what is currently displayed by the LCD, and it provides us with two boxes to enter more text, one for each row. Each row is limited by the HTML code to 16 characters which provides instant feedback about the limitations of our setup to the user.

Typing in a couple of new lines and clicking the submit button causes the page to refresh and update with what we just entered! In a related issue, due to the RAM limitations of the Arduino and the way symbols are encoded for a URL (a % sign followed by two Hex digits), symbols initially use three times as many bytes as normal alpha-numeric characters. Therefore, if a user were to enter nothing but symbols in each field, the Arduino would crash due to memory issues. To solve this problem I added some code to limit the length of the raw text accepted, but this means that if a user enters too many symbols, the second line will be truncated. In fact, if nothing but symbols are entered into both lines, the second line will be truncated to nothing. It is an unsatisfactory solution, but it’s not an issue if the user uses symbols responsibly.

 Putting these issues aside and returning to our example, we can see that the the web page is now displaying what we entered earlier, and that the LCD also reflects the changes made on the web page.

While my Arduino is only hooked up to my local area network, it is possible to release it into the wild world of the Internet, though there is some risk (which I lack the expertise to properly assess) to doing so on your home network. There are some instructions for implementing this at http://sheepdogguides.com/arduino/art5serv.htm involving changing the settings on your home router and utilizing DynDNS to get a readable and static domain name.

The most difficult aspect of this whole project was without a doubt managing the heavy use of strings within the Arduino’s small amount of  RAM. Lots of work went into preventing any major or obvious memory leaks, but I am not entirely sure that I have gotten them all. To ration the memory effectively, I also utilized the ability of the Arduino to store constants in flash memory for the strings of HTML code that are sent to the client’s browser. This means I have at most only a single line of HTML stored in RAM at any time.

That wraps up my first post and first major Arduino project that involved some real coding and which was more than just random experimentation and tinkering. There is still some work that could be done debugging, and I intend to work on some extreme and border conditions to see if there are any bugs remaining that will cause it to crash or do some other bad thing.

(what fun is it if you don’t try to break it?)

As a reminder, the source code for this project can be found Here.

About these ads

29 thoughts on “Arduino Project: HTML to LCD”

  1. Line 163 & 164 need some work. This will strip any ligitimate “0”‘s from the message. I.e. “101” becomes “11”

    1. Sorry for the delayed response, I have fixed the problem by replacing only the last zero with a blank character. The source code in the links has been updated to reflect this. Hopefully this cheap fix didn’t break something else that I haven’t noticed yet.

  2. Thank you for this tutorial! I will be following it and hoping to expand on it for a larger project I have in mind.

    I am fairly new to Arduino and have a question– Is there a way to make this project wifi-enabled? I am poking around trying to figure it out. I don’t want to use xBee because i think it only works within a certain range and ideally i would like the LCD/Arduino to be quite far. Wifi would be the only option, especially if theres no where to plug in the ethernet.

    Thanks again!

    1. You could try the WiFly modules, as they claim to work up to 100m, and there’s even an arduino shield with one integrated. Unfortunately I have no experience with either of these products, so I can’t offer any real insight into how well they would suit your needs.

      Also thanks for showing an interest in this. I got busy and haven’t been able to update this blog for months, but now I feel like I should pick up where I left off.

  3. Nice idea. It gave me the right inputs on Arduino 0.22 :-)
    Now I’ve installed Arduino 1.0 and I can’t compile it. Have replaced the ethernet “Client” and “Server” with “EthernetClient” and “EthernetServer” but i get error:

    HTML_to_LCD.cpp: In function ‘void htmlToHuman(String)':
    HTML_to_LCD:184: error: no match for ‘operator=’ in ‘URLstring = URLstring.String::replace(((const String&)(& String(((const char*)”L1=”)))), ((const String&)(& String(((const char*)””)))))’

    Anybody got some good idea’s?

    1. Replacing each instance of URLstring = URLstring.replace( ~~~ ); with just URLstring.replace( ~~~ ); makes it so that the code compiles. I’m fairly certain the former was used in place of the latter originally because the latter did not work properly; I’m not sure it will work now either quite frankly.

      Unfortunately my Arduino has moved on to other projects, so I can’t easily test this modification to make sure it works. Hopefully it does, but I’ll keep troubleshooting the bugs with you if it doesn’t.

  4. Hello!

    Just wanted to let you know a friend and I took the time to set this up last night. We found the best group of malicious users we could and managed to find several security problems. The first and biggest was a XSS attack / injection attack, and we managed to smash it by disallowing the usage of “”. (Just took your html symbol conversions out) I would like to eventually rework this to only allow A-Z, a-z, and 0-9.

    We started with an UNO and eventually swapped boards for my MEGA which yielded amazing results. We had at most around 100 users constantly smashing this thing with messages. It seems to do well, but we did run into several crashes. I love this project and we intend to take it much further. Of course, we linked all of the posts back to this website and credited all of your code that we’re using with your name and website.

    Our biggest problem is flooding. If we can manage to code a way to keep individuals from “refresh spamming” text we can make this into a pretty neat internet message system. I’m planning on mounting this in a project box and putting it on my desk.

    If you have free time, get back to me as I would like your insight with changing the code around. Thank you so much for your hard work, MANY people appreciate it.

    1. I noticed a lot of the abuse on the 4chan thread this morning. I kind of knew when I initially designed this project that I wasn’t securely dealing with the strings, but I wasn’t really satisfied with disallowing non alphanumeric characters (even though I frown upon emoticons, I feel bad denying their use to others). The problem is that the arduino’s ram limitations made properly escaping the hazardous characters problematic, so I decided to leave the issue unfixed and limited access to my LAN since no one there is skilled enough to do anything bad. As for the userload, I never really anticipated it becoming an issue (this blog has a whole 2100 page views since it was created!), but it may be possible to identify a user (perhaps by their IP address or something in their user agent) and then deny additional connections, or at least the message changing form to them for a short period. Unfortunately this would require more ram that the UNO doesn’t have, but the mega may be able to handle it. Other potential options are the LeafLabs Maple (I don’t know if the Ethernet library works yet) or the Raspberry Pi (if/when they finally release the darn thing). I really like the idea of the Raspberry Pi with some sort of LED matrix (think https://www.adafruit.com/products/420 though this particular one would be hard to interface) since the Raspberry Pi would be capable of way more features.

      1. Glad to see you caught the thread! We were originally going to go public using reddit, but the arduino forum is slow, and I wanted to see what kind of malicious work anon’s could come up with.

        I certainly hope you didn’t see the video chat, seeing as we both looked like tools. We were getting spammed so bad that legitimate questions couldn’t be answered.

        I’m sitting down to review your code now that I can think straight. While we’re both Network Engineers, I’m pretty new with arduino and my friend is brand new to arduino. After seeing this project last night he’s going to be buying an UNO kit to play around with. I hope we managed to get someone interested in arduino with that thread. Once I get a better hardware appliance to use as a router / firewall we’ll try opening it back up again. I’m going to work on flood detection and prevention in the meantime.

  5. What i do not realize is if truth be told how you’re not actually much more smartly-favored than you may be now. You are very intelligent. You understand therefore considerably when it comes to this matter, made me in my view imagine it from a lot of various angles. Its like women and men don’t seem to be involved until it is something to do with Woman gaga!
    Your own stuffs excellent. At all times maintain it up!

  6. dear all, i also did same project “HTML TO LCD”, but i got i error that’s GET /favicon.ico arduino lcd display error. how can i fix this problem. can u give sugestions?

    1. I don’t know how you are getting a favicon error, there isn’t anything in the source that attempts to load one. Have you tried using a different web browser? I’ve moved my arduino on to other projects so I can’t easily test this and try to replicate the error.

      1. yes . i was change browser also. i checked firebox and Google chrome also. same error i got that. but i didn’t check internet explore. can u give ur email id. i can give my source code.

  7. I am curious to find out what blog system you’re utilizing? I’m
    having some small security problems with my latest blog and I’d like to find something more secure. Do you have any suggestions?

  8. I know this if off topic but I’m looking into starting my own weblog and was wondering what all is needed to get set up? I’m assuming having a blog like yours would cost a pretty penny?

    I’m not very internet smart so I’m not 100% sure.
    Any recommendations or advice would be greatly appreciated.

    Appreciate it

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s