如何从网页控制arduino?

描述

当我们完成一些Arduino项目后,比如Arduino控制灯的项目或者Arduino控制舵机的项目,等等。这时你或许会思考一个问题,是否可以通过网页实现对灯或舵机的控制。当然,自带网络版本的Arduino是首选,比如Arduino Yun。下面来看看怎么去实现它。首先,我们需要创建一个简单的网页,使它可以与Arduino通信。在本文中将逐一讨论。

如何从网页控制arduino

在本文中,我们将通过一块以太网功能的扩展板和Arduino共同完成,目的是使我们能通过web浏览器控制蓝色LED的开关(当然,如果你愿意,你可以使用其他颜色的LED)。

首先,当然是将网络功能扩展板与Arduino UNO连接。在这个项目中使用的是Ethernet W5100 网络扩展板模块。

电路连接

网页

对于控制LED这种项目,其实只使用Arduino 引脚13的板载LED也可以实现。但是如果要考虑添加W5100扩展板,这种方法就存在一些问题。首先,由于LED会被扩展板覆盖住,想看到LED颈椎受不了!第二个更严重的问题是,W5100以太网扩展板本身使用了引脚13。所以在本文中,我们将一个蓝色LED接一个10K欧姆的电阻后,再将它连接到Arduino的第二个引脚上。

Arduino连接LED

这就是电路的全部内容,是不是超级简单。当然这里的引脚均需要从W5100扩展板上对应连接,连接OK后,通过USB将Arduino插到PC机上。将以下代码上传到Arduino。现在就可以开始从网页控制Arduino了!

注意:需要将下面代码中的IP地址(192.168.1.212)更改为适合你自己家中局域网的IP地址。除此之外,不需要调整其他任何东西。

// Basemu - Controlling an Arduino Pin from a WebPage

// link to www.basemu.com

#include "SPI.h"

#include "Ethernet.h"

byte mac[] = { 0xDE, 0xAD, 0xBE, 0xAD, 0xEE, 0xBE }; //physical mac address

byte ip[] = { 192, 168, 1, 212 }; // IP address in LAN – need to change according to your Network address

byte gateway[] = { 192, 168, 1, 1 }; // internet access via router

byte subnet[] = { 255, 255, 255, 0 }; //subnet mask

EthernetServer server(80); //server port

String controlString; // Captures out URI querystring;;

int blueLEDPin = 2; // pin where our blue LED is connected

void setup(){

pinMode(blueLEDPin, OUTPUT); // change pin 2 to OUTPUT pin

// Initialize the Ethernet

Ethernet.begin(mac, ip, gateway, subnet);

server.begin();

}

void loop(){

// Create a client connection

EthernetClient client = server.available();

if (client) {

while (client.connected()) {

if (client.available()) {

char c = client.read();

//read the HTTP request

if (controlString.length() < 100) {

// write characters to string

controlString += c;

}

//if HTTP request has ended– 0x0D is Carriage Return \n ASCII

if (c == 0x0D) {

client.println("HTTP/1.1 200 OK"); //send new page

client.println("Content-Type: text/html");

client.println();

client.println("

");

client.println("

");

client.println("

");

client.println("");

client.println("

");

client.println("

");

client.println("

LED ON/OFF FROM WEBPAGE

");

client.println("

");

client.println("

);

client.println("");

client.println("");

delay(10);

//stopping client

client.stop();

// control arduino pin

if(controlString.indexOf("?GPLED2ON") > -1) //checks for LEDON

{

digitalWrite(blueLEDPin, HIGH); // set pin high

}

else{

if(controlString.indexOf("?GPLED2OFF") > -1) //checks for LEDOFF

{

digitalWrite(blueLEDPin, LOW); // set pin low

}

}

//clearing string for next read

controlString="";

}

}

}

}

}

下面打开Windows的命令窗口(WIN键+R,打开后输入CMD即可),输入ping 192.168.1.212(对应你的IP地址),应该看到以下内容,这里可以验证你的Arduino是否已正确连接到网络:

网页


Windows的命令窗口(WIN键+R,打开后输入CMD即可)

如果成功Ping通,下面打开浏览器,输入http://192.168.1.212((对应你的IP地址),应该看到以下屏幕:

网页


Arduino WEB控制LED

这时,点击”Turn On The Blue LED”应该会点亮LED,点击“Turn Off the Blue LED”应该会关闭LED。

代码解释

W5100以太网扩展板与Arduino是通过SPI接口进行通信的,因此,使用W5100扩展板需要将“SPI.h”和“Ethernet.h”都include到项目中。

#include "SPI.h"

#include "Ethernet.h"

代码的下一部分是将MAC地址和IP地址分配给W5100,并配置服务器端口80,这是标准的web服务器端口。

byte mac[] = { 0xDE, 0xAD, 0xBE, 0xAD, 0xEE, 0xBE };

byte ip[] = { 192, 168, 1, 212 };

byte gateway[] = { 192, 168, 1, 1 };

byte subnet[] = { 255, 255, 255, 0 };

EthernetServer server(80);

接下来,需要一个用于蓝色LED引脚的变量,以及一个用于捕获URI查询字符串数据的“控制”变量。我们将发送“?GPLED2ON”到网页上来关闭LED,发送“?GPLED2OFF”来关闭LED。controlString将捕获这些命令。

String controlString;

int blueLEDPin = 2;

代码的设置部分,设置引脚2为输出,以便当我们设置引脚2为高电平时,可以为LED供电。Ethernet.begin 启动W5100并给它分配前面指定的MAC地址和IP地址。server.begin 启动在端口80上侦听web服务器。

pinMode(blueLEDPin, OUTPUT);

Ethernet.begin(mac, ip, gateway, subnet);

server.begin();

打开APP阅读更多精彩内容
声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉

全部0条评论

快来发表一下你的评论吧 !

×
20
完善资料,
赚取积分