何处不江南 发表于 2013-11-21 11:43:21

教你如何完美使用Ethernet模块

本帖最后由 何处不江南 于 2013-11-21 13:50 编辑

今天在QQ空间找到了arduino炫项目，是通过web来控制电器，地址为：http://user.qzone.qq.com/1485592365/blog/1366299761#!app=2&via=QZ.HashRefresh&pos=1366299761，分享给大家,以下是正文，颤抖吧：大致步骤：

访问服务器端WEB主页面》》》
主页面向Arduino发送POST请求数据》》》
Arduino接收并解码主页的请求，同时将变更的值进行合成出子页面，传给主页面的iframe》》》

主页面延时一定时间，等待Arduino反馈的页面并进行局部iframe刷新>OK！

恩，我自己看都觉得复杂，不过响应速度相当好！（平均20ms内）

老子好像变成程序员了 = =！



WEB端程序：

<!doctype html>
<html lang="en">
<head><meta charset="utf-8" />
<meta name="viewport" content="width=200px"/>
<title>Light-Microduino</title>
<link rel="stylesheet" href="jquery-ui.css" />
<style>


.STYLE4 {
    color:#CCCCCC;
    margin: 0 auto;
    bottom: 10%;
    left:42%;
}
.STYLE6 {
    font-size: medium;
    color: #CCCCCC;
    font-family: Arial, Helvetica, sans-serif;
}
.STYLE8 {
    font-size: x-large;
    color: #CCCCCC;
    font-family: Arial, Helvetica, sans-serif;
}
.STYLE9 {font-size: large}
.STYLE10 {font-size: small}
</style>
<script src="jquery-1.9.1.js"></script>
<script src="jquery-ui.js"></script>
<script>

function show(){
      $("#s1").attr("src", "http://192.168.1.122");
      document.getElementById("#s1").contentDocument.location.reload(true);
}

    $(document).ready(function (){

      $("#button10").click(function(){
      status1=10;
      $.post("http://192.168.1.122",{"lightstatus":status1});
      t = setTimeout("show()",60);
      });
      $("#button11").click(function(){
      status1=11;
      $.post("http://192.168.1.122",{"lightstatus":status1});
      t = setTimeout("show()",60);
      });

      $("#button20").click(function(){
      status2=20;
      $.post("http://192.168.1.122",{"lightstatus":status2});
      t = setTimeout("show()",60);
      });
      $("#button21").click(function(){
      status2=21;
      $.post("http://192.168.1.122",{"lightstatus":status2});
      t = setTimeout("show()",60);
      });
      
      $("#button30").click(function(){
      status3=30;
      $.post("http://192.168.1.122",{"lightstatus":status3});
      t = setTimeout("show()",60);
      });
      $("#button31").click(function(){
      status3=31;
      $.post("http://192.168.1.122",{"lightstatus":status3});
      t = setTimeout("show()",60);
      });
      
      $("#button40").click(function(){
      status4=40;
      $.post("http://192.168.1.122",{"lightstatus":status4});
      t = setTimeout("show()",60);
      });
      $("#button41").click(function(){
      status4=41;
      $.post("http://192.168.1.122",{"lightstatus":status4});
      t = setTimeout("show()",60);
      });
      
      clearTimeout(t);
      
      });

</script>

</head>

<div id="zoom">

<body style="background-color:black";>
<div style="width:540px; height:920px; top:44%; margin:0 auto; padding-left:1%; padding-right:1%; ">

<div style="margin:0 auto; margin-left: 7px; margin-top:-46px;">
    <iframe id="s1" name="s1" src="http://192.168.1.122" frameborder="0" scrolling="no" height="115" width="520"></iframe>
</div>

<div style="font:bold 14px verdana; text-align:left; margin-top: -36px;">
<br/>
<br/>
<table width="510" height="182" border="0">
<tr>
    <td><button type="button" id="button10" style="background:url('OFF.png');border-style:none;width:115px;height:44px;
background-repeat:no-repeat;"/>?</td>
    <td><button type="button" id="button20" style="background:url('OFF.png');border-style:none;width:115px;height:44px;
background-repeat:no-repeat;"/>?</td>
    <td><button type="button" id="button30" style="background:url('OFF.png');border-style:none;width:115px;height:44px;
background-repeat:no-repeat;"/>?</td>
    <td><button type="button" id="button40" style="background:url('OFF.png');border-style:none;width:115px;height:44px;
background-repeat:no-repeat;"/>?</td>
</tr>
<tr>
    <td><button type="button" id="button11" style="background:url('ON.png');border-style:none;width:115px;height:44px;
background-repeat:no-repeat;"/>?</td>
    <td><button type="button" id="button21" style="background:url('ON.png');border-style:none;width:115px;height:44px;
background-repeat:no-repeat;"/>?</td>
    <td><button type="button" id="button31" style="background:url('ON.png');border-style:none;width:115px;height:44px;
background-repeat:no-repeat;"/>?</td>
    <td><button type="button" id="button41" style="background:url('ON.png');border-style:none;width:115px;height:44px;
background-repeat:no-repeat;"/>?</td>
</tr>
<tr>
    <td>    <div align="center"><span class="STYLE6">NO.1</span> <span class="STYLE8">通风</span></div></td>
    <td>    <div align="center"><span class="STYLE6">NO.2</span> <span class="STYLE8">加热</span></div></td>
    <td>    <div align="center"><span class="STYLE6">NO.3</span> <span class="STYLE8">加湿</span></div></td>
    <td>    <div align="center"><span class="STYLE6">NO.4</span> <span class="STYLE8">采光</span></div></td>
</tr>
</table>
</div>

    <div class="STYLE4">
    <div align="center" style="margin:0 auto; width: 100%;">
    <span class="STYLE9">智能农业系统 </span><span class="STYLE10">Via_JJU</span>    </div>
</div>
</div>

</body>
</div>
</html>


Arduino端程序：

#include <EtherCard.h>

#define NUM    4

#define PIN1    A0
#define PIN2    A1
#define PIN3    A2
#define PIN4    A3

int RELAY_PIN;
uint8_t lightStatus;

int light;

static byte mymac[] = {
0x74,0x69,0x69,0x2D,0x30,0x31 };
static byte myip[] = {
192,168,1,122 };
static byte gwip[] = {
192,168,1,1};

byte Ethernet::buffer;


void setup () {

Serial.begin(9600);
Serial.println("Light Microduino");

if(!ether.begin(sizeof Ethernet::buffer, mymac,10))
    Serial.println( "Failed to access Ethernet controller");
else
    Serial.println("Ethernet controller initialized");

if(ether.staticSetup(myip, gwip)){
    Serial.println("Set static IP ok!");
}
else{
    Serial.println("Set static IP Failed!");
}

RELAY_PIN=PIN1;
RELAY_PIN=PIN2;
RELAY_PIN=PIN3;
RELAY_PIN=PIN4;

for(int a=0;a<NUM;a++)
{
    pinMode(RELAY_PIN, OUTPUT);
    digitalWrite(RELAY_PIN, LOW);
    lightStatus=0;
}
}

void loop() {

word len = ether.packetReceive();
word pos = ether.packetLoop(len);

if(pos) {
    if(strstr((char *)Ethernet::buffer + pos, "POST") !=0) {
      sscanf((char *)strstr((char *)Ethernet::buffer + pos, "lightstatus"),"lightstatus=%d",&light);
    }

    switch(light)
    {
    case 10:lightStatus=0;break;
    case 11:lightStatus=1;break;
    case 20:lightStatus=0;break;
    case 21:lightStatus=1;break;
    case 30:lightStatus=0;break;
    case 31:lightStatus=1;break;
    case 40:lightStatus=0;break;
    case 41:lightStatus=1;break;
    }
    for(int a=0;a<NUM;a++)
    {
      if (lightStatus){
      digitalWrite(RELAY_PIN, HIGH);
      }
      else{
      digitalWrite(RELAY_PIN, LOW);
      }   

      Serial.print(lightStatus);
      Serial.print(",");
    }

      Serial.println(" ");

    BufferFiller bfill = ether.tcpOffset();
    bfill.emit_p(PSTR("HTTP/1.1 200 OK\r\n"
      "Content-Type: text/html\r\n"
      "Pragma: no-cache\r\n\r\n"
      "<!DOCTYPE html><html lang=\"en\"><head><meta charset=\"UTF-8\"/>"
      "<meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge,chrome=1\">"
      "<meta name=\"viewport\" content=\"width=device-width,initial-scale=1.0\">"
      "<title>Button</title><style type=\"text/css\"> body {background-color: #000000;} </style></head>"
      "<body><table width=\"500\" border=\"0\"><tr>"
      "<td><img src=\"http://www.mudi-china.com/pkj/arduino/GREEN/$D.jpg\"></td><td><img src=\"http://www.mudi-china.com/pkj/arduino/GREEN/$D.jpg\"></td>"
      "<td><img src=\"http://www.mudi-china.com/pkj/arduino/GREEN/$D.jpg\"></td><td><img src=\"http://www.mudi-china.com/pkj/arduino/GREEN/$D.jpg\"></td>"
    "</tr></table></body></html>"),lightStatus,lightStatus,lightStatus,lightStatus);
    ether.httpServerReply(bfill.position());
}
}




lauren 发表于 2013-11-21 13:13:58

不错，收藏，web端家里测试能运行在电脑上吗？

何处不江南 发表于 2013-11-21 13:43:47

lauren 发表于 2013-11-21 13:13
不错，收藏，web端家里测试能运行在电脑上吗？

arduino端可以编译，Web端真心无解。。 不会测试。。求大神测试，附上Arduino端的lib

页: [1]
查看完整版本: 教你如何完美使用Ethernet模块