Arduino的Web服务器更新 [英] Arduino Webserver Update

查看:280
本文介绍了Arduino的Web服务器更新的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有code小珍闻我对我的Arduino连接到以太网屏蔽网络服务器:

<$p$p><$c$c>client.println(\"<html><head><title>ArduServ</title></head><body>\");
client.print(当前温度:); client.println(getTMP());
client.println(&LT;形式方法=获取&GT;输入:&LT;输入类型=文字大小= 25名= INP&GT;&LT;输入类型=提交值=提交&GT;&LT; /表格&gt;中);
client.println(&LT; /身体GT;&LT; / HTML&gt;中);

有没有办法我可以更新使用JavaScript的温度,这样我就不必重绘页面每一秒?我可以改变温度?


解决方案

我个人不会使用Arduino的作为有两个原因HTTP服务器。


  1. 性能 - 作为一个微控制器,你只有有限的资源。如果你想要的互动是实时的服务于所有的标题和内容,可以是昂贵的。


  2. 管理性 - 我敢肯定,你知道,这是很无奈有管理的网页通过多条线路上像双引号字符串源


解决方案

我发现,做了一个Arduino网络控制器接口的最有效的方法是在本地,甚至地方举办页面您的计算机上的服务器上,如果你有一个。然后,使Arduino的网络套接字服务器,而不是HTTP服务器。

这将让您可以轻松地使用JavaScript中的的WebSocket 类通信,而不必担心托管Web内容的开销。

我用 网络套接字服务器执行的Arduino它的伟大工程。

下面是一个基于你向我们展示了一个基本的例子。

的Arduino

假设以太网 EthernetServer 插座是一个 WebSocketServer

  //初始化设置了以太网和插座服务器()这里...无效循环(无效)
{
    EthernetClient客户= ethernet.available();    如果(client.connected()及&放大器; socket.handshake(客户端))
    {
        而(client.connected())
        {
            字符串响应;            //温度添加到响应
            响应+ = getTMP();            //发送到JavaScript接口,响应
            socket.sendData(响应);            //更新每250毫秒
            延迟(250);
        }
    }    //迫不及待地让客户完全脱节
    延迟(100);
}

的JavaScript

  //假设你有类似&LT; D​​IV ID =温度&GT;&LT; / DIV&GT;在文件中
变种温度=的document.getElementById(温度);//任意IP被分配到EthernetServer
VAR IP ='192.168.0.99';VAR插座=新的WebSocket(WS://+ IP);socket.onmessage =功能(E){
    //更新温度文本
    temperature.innerHTML = e.data;
};

您可以找到有关JavaScript的网页插座 这里

I have a small tidbit of code for my webserver on my arduino connected to an ethernet shield:

client.println("<html><head><title>ArduServ</title></head><body>");
client.print("Current Temperature: ");client.println(getTMP());
client.println("<form method=get>Input:<input type=text size=25 name=inp><input type=submit value=submit></form>");
client.println("</body></html>");

Is there a way I can update the temperature using javascript so that I don't have to redraw the page every second? I can just change the temperature?

解决方案

I personally would not use the Arduino as an HTTP server for a couple of reasons.

  1. Performance - as a micro controller, you have limited resources. Serving all of the headers and content can be expensive if you want the interaction to be real time.

  2. Manageability - as I'm sure you're aware, it's really frustrating having to manage the source of the web page through strings in double quotes on multiple lines like that.

The Solution

I've found that the most effective way to make a web controller interface for an Arduino is to host the page somewhere on your computer locally or even on a server if you have one. Then, make the Arduino a web socket server instead of HTTP server.

This will allow you to easily communicate using the WebSocket class in JavaScript, while not having to worry about the overhead of hosting the web content.

I've used this web socket server implementation for Arduino and it works great.

Here's a basic example based on what you showed us.

Arduino

Assuming ethernet is an EthernetServer, and socket is a WebSocketServer.

// initialize the ethernet and socket server in setup() here ...

void loop(void)
{
    EthernetClient client = ethernet.available();

    if (client.connected() && socket.handshake(client))
    {
        while (client.connected())
        {
            String response;

            // add the temperature to the response 
            response += getTMP();

            // send the response to the JavaScript interface
            socket.sendData(response);

            // update every 250 milliseconds
            delay(250);
        }
    }

    // wait to let the client fully disconnect
    delay(100);
}

JavaScript

// assuming you have something like <div id="temperature"></div> in the document
var temperature = document.getElementById('temperature');

// whatever IP that was assigned to the EthernetServer
var ip = '192.168.0.99';

var socket = new WebSocket('ws://'+ ip);

socket.onmessage = function(e) {
    // update the temperature text
    temperature.innerHTML = e.data;
};

You can find more information about JavaScript web sockets here.

这篇关于Arduino的Web服务器更新的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆