yank 发表于 2016-4-16 00:17:41

arduino+w5100+无线摄像头

怎么将无线摄像头采集的图像整合在w5100生成的网页里呢? 请求各位大神帮助

我和同学用arduino+W5100 做了一个WIFI控制扫雪车,手机或者电脑登陆网页后进入网页控制界面然后来控制扫雪车的运动和工作。不过还没有解决怎么将摄像头采集的图像和控制界面显示在同一个网页。
上传的图片是网页控制界面和控制原理框架。(做的比较简单)

下面是源程序
#include <SPI.h>
#include <Ethernet.h>

//引脚分配
int pin_Z=8;
int pls_A=0;
int pls_B=0;
int pin_A=3;
int pin_B=5;
int dir_A=4;
int dir_B=6;

//全局变量
int m;
int over_state=0;
int up_state=0;
int down_state=0;
boolean z_state=0;
String POST = "";


// Enter a MAC address and IP address for your controller below.
// The IP address will be dependent on your local network:
byte mac[] = {
0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED };
//服务端IP地址
IPAddress ip(192,136,1,136);

// Initialize the Ethernet server library
// with the IP address and port you want to use
// (port 80 is default for HTTP):
EthernetServer server(80);

void setup()
{
_begin_();
}


void loop()
{
// listen for incoming clients
EthernetClient client = server.available();
if (client)
{
    over_state=1;up_state=1;down_state=1;///////////////////////////////////////////////////////////////////////////////////////////////////////////////
    Serial.println("new client");
    // an http request ends with a blank line
    boolean currentLineIsBlank = true;
    while (client.connected())
    {
      if (client.available())
      {
      char c = client.read();
      Serial.write(c);
      // if you've gotten to the end of the line (received a newline
      // character) and the line is blank, the http request has ended,
      // so you can send a reply
      if (c == '\n' && currentLineIsBlank)
      {
          // it is after the double cr-lf that the variables are
          // read another line!
          String POST = "";
          while(client.available())
          {         
            c = client.read();
            // save the variables somewhere
            POST += c;
          }
          // send a standard http response header
          //打印输出网页代码
          client.println("<html><head><title>car</title>"
            "<body>"
            "<form id='carform' name='carform' method='post' action=''>"
            "<div align='center'><input type='button' name='qian' value='前' accesskey='8' onclick='carform.car.value=8;carform.submit()' /></div>"
            "<div align='center'><input type='button' name='zuo' value='左' accesskey='4' onclick='carform.car.value=4;carform.submit()' />"
            "<input type='button' name='ting' value='停' accesskey='5' onclick='carform.car.value=5;carform.submit()' />"
            "<input type='button' name='you' value='右' accesskey='6' onclick='carform.car.value=6;carform.submit()' /></div>"
            "<div align='center'><input type='button' name='hou' value='后' accesskey='2' onclick='carform.car.value=2;carform.submit()' /></div>"
            "<div align='center'><input type='button' name='zhu' value='主电机' onclick='carform.car.value=7;carform.submit()' />"
            "<input type='button' name='shengjiang' value='减速' onclick='carform.car.value=3;carform.submit()' />"
            "<input type='button' name='sashui' value='盘刷' onclick='carform.car.value=0;carform.submit()' />"
            "<input type='button' name='lihe' value='加速' onclick='carform.car.value=1;carform.submit()' />"
            "<input type='button' name='beng' value='泵' onclick='carform.car.value=9;carform.submit()' /></div>"
            "<div align='center'><input type='text' id='car' name='car' value='' /></div>");
          client.println("</form></body></html>");

          /****网页表单采用POST方式传送到服务端,
         *                                 服务端从POST参数中得到鼠标点击值,
                                           并转换成ASCII码值,码值减去48后可得到实际数值****/


          m=int(int(POST)-48);


          Serial.println("POST:");
          Serial.println(POST);
          Serial.println(m);
          /*********************************************************/

          break;
      }
      if (c == '\n')
      {
          // you're starting a new line
          currentLineIsBlank = true;
      }
      else if (c != '\r')         
      {
          // you've gotten a character on the current line
          currentLineIsBlank = false;
      }
      }
    }
    // give the web browser time to receive the data
    delay(1);
    // close the connection:
    client.stop();
    Serial.println("client disonnected");
}
done();

}

//启动加速过程
void b_up_v()
{
      int i;
      for(i=1;i<9;i++)
      {
                analogWrite(pin_A, pls_A);
                analogWrite(pin_B, pls_B);
                delay(100);
                pls_A=10*i;
                pls_B=10*i;
      }
}

//急停减速过程
void e_down_v()
{
      int i;
      for(i=9;i>0;i--)
      {
                analogWrite(pin_A, pls_A);
                analogWrite(pin_B, pls_B);
                delay(100);
                pls_A-=pls_A/i;
                pls_B-=pls_B/i;
      }
      pls_A=0;
      pls_B=0;
      analogWrite(pin_A, pls_A);
      analogWrite(pin_B, pls_B);
}

//直行加速过程(每档增加20)
void s_up_v()
{
      int i;
      for(i=1;i<11;i++)
      {
                analogWrite(pin_A, pls_A);
                analogWrite(pin_B, pls_B);
                delay(100);
                pls_A+=2;
                pls_B+=2;
      /////////////////////限速保护,不超过240///////////////
                if(pls_A>240) pls_A=240;
                if(pls_B>240) pls_B=240;
      }
}

//直行减速过程(每档减少20)
void s_down_v()
{
      int i;
      for(i=1;i<11;i++)
      {
                analogWrite(pin_A, pls_A);
                analogWrite(pin_B, pls_B);
                delay(100);
                pls_A-=2;
                pls_B-=2;
      /////////////////////限速保护,不低于0///////////////
                if(pls_A<0) pls_A=0;
                if(pls_B<0) pls_B=0;
      }
}

//左转变速过程
void l_t_v()
{
      int i;
      for(i=8;i>=0;i--)
      {
                analogWrite(pin_A, pls_A);
                analogWrite(pin_B, pls_B);
                delay(100);
                pls_A-=pls_A/4;
      }
}

//右转变速过程
void r_t_v()
{
      int i;
      for(i=8;i>=0;i--)
      {
                analogWrite(pin_A, pls_A);
                analogWrite(pin_B, pls_B);
                delay(100);
                pls_B-=pls_B/4;
      }
}



//停止
void over()
{
      s_down_v();
      pls_A=0;
      pls_B=0;
      analogWrite(pin_A, 0);
      analogWrite(pin_B, 0);
}
//前进
void foward()
{
      over();
      digitalWrite(dir_A,1);
      digitalWrite(dir_B,0);
      s_up_v();
}

//后退
void back()
{
      over();
      digitalWrite(dir_A,0);
      digitalWrite(dir_B,1);
      s_up_v();
}

//左转
void left()
{
      digitalWrite(dir_A,1);
      digitalWrite(dir_B,0);
      l_t_v();
}


//右转
void right()
{
      digitalWrite(dir_A,1);
      digitalWrite(dir_B,0);
      r_t_v();
}


//主电机启停
void z_start()
{
      if(m==7)
      {
                z_state=~z_state;
                if(z_state)
                        digitalWrite(pin_Z,1);
                else
                        digitalWrite(pin_Z,0);
      }
}


//初始化
void _begin_()
{
Serial.begin(9600);
while (!Serial)
{
    ; // wait for serial port to connect. Needed for Leonardo only
}


// start the Ethernet connection and the server:
Ethernet.begin(mac, ip);
server.begin();
Serial.print("server is at ");
Serial.println(Ethernet.localIP());

pinMode(pin_Z, OUTPUT);
pinMode(pin_A, OUTPUT);
pinMode(pin_B, OUTPUT);
pinMode(dir_A, OUTPUT);
pinMode(dir_B, OUTPUT);

digitalWrite(pin_Z,0);
digitalWrite(pin_A,0);
digitalWrite(pin_B,0);
digitalWrite(dir_A,0);
digitalWrite(dir_B,0);

int over_state=0;
int up_state=0;
int down_state=0;
m=0;
z_state=0;
}

//指令解析
void assign()
{
switch(m)
{
case 8:
    foward();
    break;
case 2:
    back();
    break;
case 4:
    left();
    break;
case 6:
    right();
    break;
case 5:
    over();
    break;
case 7+48:
    z_start();
    break;
case 0+1:
    s_up_v();
    break;
case 0+3:
    s_down_v();
    break;
default:
    break;
}
}

//指令执行
void done()
{
    assign();
}

yank 发表于 2016-4-17 13:13:35

谁有 无线摄像头wiCam模块 的用法介绍和购买链接吗?急求!!!

yank 发表于 2016-4-16 00:19:37

拜托各位指点啦

happyhu 发表于 2016-4-16 13:21:33

本帖最后由 happyhu 于 2016-4-16 13:22 编辑

要是无线网络摄像头,创建一个html文件就行了!

cjnt007 发表于 2016-4-16 16:39:31

一般无线摄像头采集到的图像可以生成jpeg图像流,firefox、chrome等浏览器直接输入无线摄像头的地址就可以在页面上显示jpeg流,IE貌似不行,你可以把这个页面做成子页面嵌入到小车控制页面中就可以了。

yank 发表于 2016-4-16 23:44:16

cjnt007 发表于 2016-4-16 16:39 static/image/common/back.gif
一般无线摄像头采集到的图像可以生成jpeg图像流,firefox、chrome等浏览器直接输入无线摄像头的地址就可以在 ...

不过我学的网页编程比较浅,不知道怎么将一个网页嵌入到另一个网页,有推荐的贴吧或者文章吗,我学习一下。谢谢啦

yank 发表于 2016-4-16 23:46:24

happyhu 发表于 2016-4-16 13:21 static/image/common/back.gif
要是无线网络摄像头,创建一个html文件就行了!

我是新手,我不太懂怎么将一个html文件,加入到w5100产生的网页里,能具体指导一下吗?谢谢啦

22881916 发表于 2016-4-17 00:32:20

想看扫雪车的图,,,好好奇

cjnt007 发表于 2016-4-17 12:31:26

yank 发表于 2016-4-16 23:46 static/image/common/back.gif
我是新手,我不太懂怎么将一个html文件,加入到w5100产生的网页里,能具体指导一下吗?谢谢啦

iframe标签啊

yank 发表于 2016-4-17 12:43:02

22881916 发表于 2016-4-17 00:32 static/image/common/back.gif
想看扫雪车的图,,,好好奇

小车是同学们设计和用型材搭建的,我主要是做控制的

yank 发表于 2016-4-17 12:46:21

cjnt007 发表于 2016-4-17 12:31 static/image/common/back.gif
iframe标签啊

{:3_57:}额。。。不怎么懂啦,我是学机械的,网页编程只是要用,就临时学习了一点

yank 发表于 2016-4-17 12:48:23

cjnt007 发表于 2016-4-17 12:31 static/image/common/back.gif
iframe标签啊

你能给我一个示例吗?我学学,谢谢啦

cjnt007 发表于 2016-4-17 12:49:24

yank 发表于 2016-4-17 12:46 static/image/common/back.gif
额。。。不怎么懂啦,我是学机械的,网页编程只是要用,就临时学习了一点

http://www.w3school.com.cn/tags/tag_iframe.asp

http://www.w3school.com.cn/tiy/t.asp?f=html_iframe
学习下吧,很简单的

yank 发表于 2016-4-17 12:58:24

cjnt007 发表于 2016-4-17 12:49 static/image/common/back.gif
http://www.w3school.com.cn/tags/tag_iframe.asp

http://www.w3school.com.cn/tiy/t.asp?f=html_ifra ...

蟹蟹啦{:2_37:}
页: [1]
查看完整版本: arduino+w5100+无线摄像头