Control Arduino Remotely over net via HTML forms

Here is a crude way of controlling your arduino over the net. It uses HTML forms or CGI-URL encoded data. All of the network programming is done in python. In other words, you could write something like www.hostname.com/script.py?message=Hello+World! to send "Hello World!" to the Arduino. Or you can create an HTML form as I did in the demonstration in this video: http://www.youtube.com/watch?v=Lv26TEB98_E. The package contains CGI script to get the data from the net and sockets to pass on the info to a client computer which has a socket-serial bridge to your Arduino. This is certainly not meant to be an actual software release as much as it is just a guide to forming your own system. Here is the link: http://blog.datasingularity.com/?p=50. Feel free to e-mail me about getting help if you want to use it for your project.

Pretty cool! I have done some of the same stuff myself only using php for frontend and Visual Basic for backend. This was back when I interfaced with my computers printerport (not yet knowing about the Arduino :P). Kinda cool to have a website with live logs for my door and a couple of other things, controllable christmaslights and a few leds and a webcam, and see friends in California and the Netherlands control physical stuff in my room. ^^

A little off topic, but I have also made a couple of incarnations of a web-controllable mediaplayer also using VB as backend and php as frontend. It was kinda annoying, though very cool, to have both those projects running at the same time. Music playing (and always the worst possible music they could find on my computer ::)), lights going on and off..

But I think just about the coolest part of that project was the mini version of the online controlpanel I made for access with my cellphone. 8-)

Pretty cool! I have done some of the same stuff myself only using php for frontend and Visual Basic for backend. This was back when I interfaced with my computers printerport (not yet knowing about the Arduino :P). Kinda cool to have a website with live logs for my door and a couple of other things, controllable christmaslights and a few leds and a webcam, and see friends in California and the Netherlands control physical stuff in my room. ^^

A little off topic, but I have also made a couple of incarnations of a web-controllable mediaplayer also using VB as backend and php as frontend. It was kinda annoying, though very cool, to have both those projects running at the same time. Music playing (and always the worst possible music they could find on my computer ::)), lights going on and off..

But I think just about the coolest part of that project was the mini version of the online controlpanel I made for access with my cellphone. 8-)

Any chance you could post your source? I'd like to modify this for a web controlled RC Car, and I'm much more familiar with PHP than CGI.

Cool stuff! I have done some python network stuff for a small robot. I wrote a client in python that used TKInter for a gui. The client talked to a python socket server running on another machine that in turn connected to the robot via a blueSMiRF. It allows real time control over the web. It was a really fun project.

edit: I forgot that I didn't use TKinter for the client GUI. It was PYGame.

Any chance you could post your source? I’d like to modify this for a web controlled RC Car, and I’m much more familiar with PHP than CGI.

Hm… not sure I can give you the source code I used… I haven’t done any automation work in over a year (except for the Mediaplayer-thing) and as I am an uncurable perfectionist I have made numerous incarnations of the scripts though never getting 100% satisfaction with any of them. x(

The source you want, is it the VB part or the php part? For the php part I think I can type up a quick example here, but if you want an example VB application I’d have to hack something together. Just tell me though, I’d be happy to help! :slight_smile:

example: backend.php

<?php
if(!empty($_GET['port']) && is_numeric($_GET['port']) && !empty($_GET['data']))
{
    $fp = @fsockopen('localhost', 1000);
    if($fp)
    {
        fputs($fp, "set:".$_GET['port'].":".$_GET['data'].":\r\n"
    }
    else
    {
        die('Could not connect to server!');
    }
    fclose($fp);
}
?>

This is a pretty simple example. The file backend.php takes 2 paramenters, port and data, opens a connection to a server (localhost is this case), and sends a command.

If you create a link to backend.php?port=3&data=ON it will send “set:3:ON:” to the server.

Of course, you need a backend that recieves the connection, and sends the data on to the Arduino.

Just let me know if you need any help! d(^_^)

You think you know a language, until you have a true pro tell you a bit of code XD
(It’s ok, I sorta understand it)

I was hoping you still had the original files so you didn’t have to put in extra effort, but thanks a bunch.

As far as what I was looking for, just something that’ll be easy to modify(php) that’ll allow me to interface with the arduino over web forms, buttons, etc.

Only question I have with that code is how it picks out the pin. It seems that that code calls the port and tells it to turn on, but I’m confused as to whether by port you mean pin or COM port?

I apologize in advance for uber noobishness(I try to sound semi-inteligent)

Here’s where I stand coding-wise

HTML > Know the basics, look up the specific tags for anything beyond and <a href=> :confused:

PHP > Know very little, but I have a natural ability to read code and interpret it to human terms(That’s why yours throws me off, it has many odd characters, but I can piece together the jist)

VB/C > Pretty much nothing, played around with the install on my uncles computer, he let me have one of his multi-user business licences(the company crashed) read a basics book a while back, don’t remember much, but’ll go back to the book when needed.

Arduno Code > Havn’t written anything, but am scouring the internets for other peoples projects bookmarking them so I can piece together something that works.

So yeah, I know a little bit of everything, but not enough of something to make something solo.

P.S. I be 14, but have access to electronic components, own a soldering iron, etc.

Bleh, I tend to have a problem with overwriting here’s a summary,

I know the very basics of most of the code needed(PHP, HTML, VB, Arduino)
I’m looking for a way to interface the arduino with webcode, forms, buttons, links(Mbe flash, but I can figure that out myself)
I understand how the system would have to work.

User input > PHP > VB backend > Arduino

But just don’t have the experience or knowledge to pull it off solo.

Thanks a TON in advance.

Got milk?

Ok, typed up something to hopefully get you started. The rar-archive (unpach with winzip, winrar, 7zip, etc.) contains:

..a VB project that accepts a connection from a client (php script) and passes the data directly to a serial connection. You need to set the correct COM-port in the source-code.

..a couple of php files that sends data to the VB backend (and thus to a COM port)

..a file called scetch.txt that I just threw together that should check if it has recieved more than 2 bytes. If it has, it treats the first as the pin-number, and the second as ON/OFF (1 = ON, whatever else = OFF)

This might not be the smoothest way to do things, but I hope it will at least get you started. If you have any questions (which I am sure you will have, trying to understand my code, heh..), feel free to ask! 8-)

Oh, almost forgot the link! -_-'

http://zpider.globelan.net/plastbox2/arduinoproxy.rar

I don't have time to look over it completely(school) but a quick look over of the php and I have one question,

What's the "do" variable do A sorta-educated guess leads me to something like a password, ie if it's correct then it lets you, else you go back?

Edit:

Sadface, I'm not home right now, and was planning on Remote desktoping to mah comp to try out the code, but turns out that somebody accedently bumped the network cables for BOTH my computers, so I have no access. I may or may not be able to stop by home tonight and get them fixed, but if I don't, then I have to take a bus home tomorrow to fix it. Till then, I can't see the VB code :( (I'm on a mac)

Ok, well I got the computer situation worked out(turns out we didn’t pay the cable bill, and the modem refused to connect, so we just brought the whole computer with us)

Anyways, looking over the code, seems fairly straightforward, just a couple things,

First, how would the “front-end” php code be modified so that a form changes the url(or sends data) ie

if()

append X to final url
ELSE
do nothing

Something like that, or something that would modify the output data based on form selections.

So maybe use an RGB LED(how original :/) wire it up to the PWM pins, and set up a couple preset colors.
Then have a form that changes the LED values based on a Drop box selection,
ie user picks color from dropbox, php sends command to alter color.

Well that’s actually it(had a second, but figured it out by looking at code as a whole)

Disregard the “What’s the ‘do’ do”
it controls whether it’s on or off. It just confused me because the do command tends to be used alot in other parts of PHP
(It’s late, sorry for cufsionism in writing :/)

When I(We?)figure this out, I’ll post a how-to on the Playground(if it’s ok with you)

Can’t wait till my Arduino arrives, June 2nd Paypal goes through, then like 3-4 days shipping :slight_smile:

Well, for RGB colormixing I should think it best if you modify the backend.php and Arduino sketch somewhat. As it is now, php sends (depending on ‘do’ and ‘pin’) 2 bytes. The Arduino checks if the serial buffer is bigger than 2 bytes, and if it is, fetches the 2 bytes and does it’s thing. One thing that dawned on me now is that I wrote “if (Serial.available() > 2)” but it should be “if (Serial.available() > 1)”. After all, >2 won’t trigger unless there is more than 2 bytes available, which is kinda silly as we are sending 2 byte commands.

If you want to make color-mixing, I will gladly help you with sourcecode. If you want to make a playground tutorial, Great! =D What I am thinking is to simply send 3 bytes. For colormixing you need to send 3 values of 0-255 right? Well, that is coincidentally the exact number of values covered in one byte. :wink:

backend.php:

<?php
if(isset($_REQUEST['r']) && is_numeric($_REQUEST['r']) && isset($_REQUEST['g']) && is_numeric($_REQUEST['g']) && isset($_REQUEST['b']) && is_numeric($_REQUEST['b']))
{
      $fp = @fsockopen('127.0.0.1', 1000, $errno, $errstr, 3);
      if($fp)
      {
            fputs($fp, chr($_REQUEST['r']).chr($_REQUEST['g']).chr($_REQUEST['b']));
      }
      else
      {
            die('<b>Error('.$errno.'):</b>'.$errstr);
      }
}
header('Location: index.php');
?>

That code will accept data from both a form (POST) or from the url (GET). $_REQUEST covers them both. The thought is that each color (red, green, blue) is sent to backend.php where the numeric values are replaced with their corresponding ASCII-characters using the chr()-funksjon and sent to the VB application.

Don’t think you’ll need to change the VB application, but the Arduino sketch needs a bit of change. Something like this:

int val;
int ledPin1 = 9;
int ledPin2 = 10;
int ledPin3 = 11;

void setup()
{
      //begin the serial communication
      Serial.begin(9600);
      pinMode(ledPin1, OUTPUT);
      pinMode(ledPin2, OUTPUT);
      pinMode(ledPin3, OUTPUT);
}

void loop()
{
      //check if data has been sent from the computer
      if (Serial.available() > 2) {
            //fetch first byte and set output (value of RED)
            val = Serial.read();
            analogWrite(ledPin1, val);

            //fetch second byte and set output (value of GREEN)
            val = Serial.read();
            analogWrite(ledPin2, val);

            //fetch third byte and set output (value of BLUE)
            val = Serial.read();
            analogWrite(ledPin3, val);
      }
}

Checks if 3 or more bytes are available on the serial buffer, fetches the 3 bytes and sets values analog pins 9, 10 and 11 to the ASCII values of the 3 bytes. If you send AbC to the Arduino, pin9 will be set to 65, pin10 to 98 and pin11 to 67.

Ok, I’ve done a little tinkering and here is a new and improved index.php for colormixing. It has dropdown lists for setting any the color value possible, and also 6 links demonstrating how you can use pre-defined colors. Hope this helps! =)

<?php
echo '<form action="backend.php" method="post">
<pre>
Red:  <select name="r">';
for($num = 0; $num < 256; $num++)
{
      echo '<option value="'.$num.'">'.$num.'</option>'."\r\n";
}
echo '</select>
Green:<select name="g">';
for($num = 0; $num < 256; $num++)
{
      echo '<option value="'.$num.'">'.$num.'</option>'."\r\n";
}
echo '</select>
Blue: <select name="b">';
for($num = 0; $num < 256; $num++)
{
      echo '<option value="'.$num.'">'.$num.'</option>'."\r\n";
}
echo '</select>
      <input type="submit" value="Set color" /></form></pre>';
?>
<a href="backend.php?r=255&g=0&b=0">Red</a>

<a href="backend.php?r=0&g=255&b=0">Green</a>

<a href="backend.php?r=0&g=0&b=255">Blue</a>



<a href="backend.php?r=255&g=255&b=0">Yellow</a>

<a href="backend.php?r=255&g=0&b=255">Pinkish</a>

<a href="backend.php?r=0&g=255&b=255">Turquoise</a>

Oh that's great, thanks, I'd loveto check it out, but I gotta go to bed, and school tomm. but I'll check it out right after school.

And I'll start coming up with something to put this all together for.

Just one more thing,

On the VB file, you placed a text box at the top, but it doesn't seem to link to anything. Was it a forgotten "send manual commad" field, or is it something that gets auto-created by the comm stacks?

Me and my impulsive posting :confused:
I got too excited about this and decided to update the code.

Looks pretty cool, and my guess was sorta right, the blank field is like a monitor for the comm stack. But for me it just shows boxes when I send a signal :confused:

Thanks a TON for this.

BTW, reading about the arduino reminded me about an older failed project, I’m gonna combine tht rider bar he best of both worlds and mbe get a user controllable knight rider bar.

http://www.arduino.cc/cgi-bin/yabb2/YaBB.pl?num=1211676697

Ah, the text-box. When the php-script sends data to the VB-application, the data is displayed in the textbox. This is complete nonsence right now, though, as the data sent range from chr(0) to chr(255) and only a few of these are alphanumerical characters (stuff that can actually be seen) while others are backspace, newline, tab, end-of-line, and a host of other special characters there would be very little point in putting in a textbox.

You can just delete it, and delete the line of code that says "Text1.text = Buf" d(^-^)

Bleh, can't sleep now XD

Any chance it could be modified to display the current RGB values?

Bleh, can't sleep now XD

Any chance it could be modified to display the current RGB values?

Indeed it could! Replace "Text1.text = Buf" with the following code:

Form1.BackColor = RGB(Asc(Mid$(Buf, 1, 1)), Asc(Mid$(Buf, 2, 1)), Asc(Mid$(Buf, 3, 1)))

Ok, did the changes myself (and a couple of others, including making the program work even if the correct COM-port doesn't exist). If you want to, you can download the new sourcecode for the VB-app from http://zpider.globelan.net/plastbox2/arduinoproxy_vb.rar

last night right before I fell asleep, I was gonna ask for that, some form of box to show the current color.

But I was thinking placing the "swatch" on the php page. I think I've decided what my first project's gonna be,

I'm gonna combine my nightrider bar, an RGB LED and a diffuser vase to make some sort of "choose your color" thing on my site. Then have a 1 second update webcam :)

last night right before I fell asleep, I was gonna ask for that, some form of box to show the current color.

But I was thinking placing the "swatch" on the php page. I think I've decided what my first project's gonna be,

I'm gonna combine my nightrider bar, an RGB LED and a diffuser vase to make some sort of "choose your color" thing on my site. Then have a 1 second update webcam :)

Sounds very, very cool! Looking forward to bugging you with changing the color of your RGB-thing. ;) Hehe. What are you planning to do with the Knightrider bar, exactely? To add more than RGB-control you'd need to implement commands of some sort, so instead of just sending 3 bytes that are interpreted as RGB-values, you'd use something like 2 bytes pr color, with R/G/B followed by a byte to specify the value of the color.

That way, you could add a command like K and have the following byte speficy one of 256 pre-programmed patterns for the Knightrider bar, or even use the pin-numbers as the command byte and the second byte as the value to write to the pin.

Looking forward to seeing your results!

By the way, where have you gotten RGB leds with matched light intensities? Tried some colormixing once myself, with trash leds I had lying around but of course the intensities of the 3 colors were nowhere near the same so it didn't work at all. x)

Btw2, by '"swatch" on the php page.'", do you mean you want to see the current color of the leds represented on the webpage? A simple thing to do, if one knows how. I'll see if I can't hack something up for ya. ^^

I'm not really sure what I'm going to do with the bar, when we first found it, I had the idea of turning it into a VU meter, my uncle helped me get the first code done in BASIC, which basically made the LED's alternate. My job was to figure out the rest.

But I could never figure out how to read the timing chart, so it went in the closet.

As far as LED's, I havn't bought them yet, so I don't know yet.

You should probably go with an RGB led. I'd assume the strength of the 3 leds it contains are more closely matched than most 3 seperate leds you could find. Let me know how things go for you, and feel free to ask if there is anything I can help you with. ^^