上次的nodejs操作arduino入门篇中实现了如何连接arduino。这次我们来实现通过arduino测量室内温度并在浏览器上显示出来。

【所需材料】

硬件：LM35温度传感器，arduino uno板，面包板，若干导线。

软件：socket.io , cylonJs , express等

【准备-硬件部分】

1、首先当然是连接电路板：

注意这个ANALOG IN是传感器的输入，就是读取温度的入口。

看看我连的：

2、然后按照 nodejs操作arduino入门篇先连接上arduino试试吧。

【准备-软件部分】

1、安装socket.io,express，package.json中这样写：

{

  "name": "robot",

  "version": "1.0.0",

  "description": "robot",

  "main": "main.js",

  "scripts": {

    "test": "echo \"Error: no test specified\" && exit 1"

  },

  "author": "yourname",

  "license": "ISC",

  "devDependencies": {

    "cheerio": "^0.22.0",

    "cylon-firmata": "*"

  },

  "dependencies": {

    "cylon-firmata": "^0.24.0",

    "cylon-gpio": "^0.29.0",

    "cylon-i2c": "^0.26.1",

    "express": "^4.14.0",

    "socket.io": "^1.5.0"

  }

}

执行npm install安装依赖包

2、编写主文件，就是读取温度，在main.js中写入：

var Cylon = require('cylon');

var express = require('express');

var http = require('http');

var app = express();

var server = http.Server(app);

var io = require('socket.io')(server);

var port = 3000;

app.use(express.static(__dirname+'/'));//设置静态文件目录

app.get('/',function(req,res){

      res.sendFile('index.html');//渲染一个html文件，在这个html文件中来展示温度

});

server.listen(port,function(){

  console.log("正在监听%d端口...",port);

});

Cylon.api('http');

Cylon.robot({

  connections: {

    arduino: { adaptor: 'firmata', port: '/dev/cu.wchusbserial1420' }

  },

  devices: {

    sensor: { driver: 'analog-sensor', pin: 2, lowerLimit: 100, upperLimit: 900 }//2号analog in口，后面是最低和最高读取值

  },

  work: function(my) {

      var analogValue = 0;

      io.on('connection', function(socket){

        every((1).second(), function() {//频率是1Hz,就是1秒读取一次温度

          analogValue = my.sensor.analogRead();//读取传感器数值

          io.emit('news', (analogValue*500/1023).toFixed(1));//analogValue*500/1023是将传感器数值转换成摄氏度。取一位小数

          //用socket.io把数值绑定在news这个名字上，前端也会用这个名字来读取这个值

        });

        console.log('a user connected');

        socket.on('disconnect', function(){

          console.log('user disconnected');

        });

    });

  }

}).start();

3、前端代码--index.html:

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>温度</title>

    <script src="http://cdn.bootcss.com/jquery/2.2.2/jquery.min.js"></script>

    <link rel="stylesheet" href="./css/index.css">

</head>

<body>

    <div class="temperature">

        <div class="t-val">

            当前温度是：<span id="t">--</span>

        </div>

    </div>

</body>

<script src="./lib/socket.io.js"></script>

<script>

  var socket = io();

  socket.on('news',function(msg){

      $('#t').text(msg+'\'C');

  });

</script>

</html>

抱歉上面花屏了：

var socket = io();

  socket.on('news',function(msg){

      $('#t').text(msg+'\'C');

  });

然后执行node main.js，在浏览器中输入localhost:3000应该就能看到效果，再贴上css代码：

html,body{

    margin:;

    padding:;

    background-color: #242424;

}

.temperature{

    color: white;

    width: 400px;

    height: 400px;

    position: absolute;

    margin: auto;

    left:;

    right:;

    top:;

    bottom:;

    text-align: center;

    line-height: 400px;

}

.t-val {

    font-size: 40px;

    font-family: KaiTi;

}

然后看执行效果：页面刷新之后我就用手指捏住传感器，所以温度上升，松开又下降了。

然后我去看了看公司的空调设置温度是25.5（传感器一开始显示的是25.4），有图为证：

目前只是实现了在本地，之后我再研究研究怎么连接到服务器，初步的思路有：

1、使用树莓派，将arduino连接树莓派，再在树莓派上搭建服务器，再用花生棒或者其他端口映射的方法连接到公网，这样就能在公网上看到数据。

2、通过Ethernet扩展板实现网络远程访问

3、使用 wifi模块，再连接路由器实现网络访问（网上说的是推荐 esp8266模块，经济实惠）

4、GPRS模块，这个可以让arduino移动到任何地方，但是感觉如果要做到一直测的话，电话卡的流量得很多啊，这个我也只是瞎猜，没用过。

恩，差不多就这些了，过程很简单，目前我需要做的就是慢慢上手，争取用做一些有意思的东西出来。

最后说一下硬件的大概价格吧（没仔细记价格）：

arduino30多块，面包板好像5块吧，线2块钱足够了，LM35传感器2块5好像，也就是说加起来一共不到50块，感兴趣的可以买来玩玩。

有问题或建议欢迎留言。

在web浏览器上显示室内温度（nodeJs+arduino+socket.io）的更多相关文章

  1. WebDNN：Web浏览器上最快的DNN执行框架

    WebDNN:Web浏览器上最快的DNN执行框架 为什么需要WebDNN? 深层神经网络(DNN)在许多应用中受到越来越多的关注. 然而,它需要大量的计算资源,并且有许多巨大的过程来设置基于执行环境的 ...

  2. 后台启动weblogic成功后，在web浏览器上无法访问

    后台启动weblogic成功后,在web浏览器上无法访问,可尝试重启服务器.

  3. 使用 x3dom 框架及 WebGL 在浏览器上显示 3 维模型

    如果需要在浏览器上显示 3D 画面的话, 现在一般会使用 ​WebGL, 典型的例如 three.js(​http://mrdoob.github.com/three.js/), 但是 WebGL 对 ...

  4. flexpaper 开源轻量级的在浏览器上显示各种文档的组件

    FlexPaper是一个开源轻量级的在浏览器上显示各种文档的组件,被设计用来与PDF2SWF一起使用, 使在Flex中显示PDF成为可能,而这个过程并无需PDF软件环境的支持.它可以被当做Flex的库 ...

  5. nodejs+express+socket.io

    其实官网文档清楚了  https://socket.io/get-started/chat/ 但是因为之前写的是nodejs+express, socket.io是后加的, 还是有小坑 服务器端: 官 ...

  6. nodejs之socket.io 聊天实现

    写在前面:最近很火的“996”话题,可谓是引起一片热议,马老师说:能够996应该是幸运的,996是对奋斗者的一种机遇(记得不是很清楚).996缺少的是自己的空闲时间了,当我是空闲的时候偶尔996挺好的 ...

  7. Storm 安装时 部分supervisor启动成功，并不在web ui上显示

    今天帮公司搭建集群时,发现启动了三个Supervisor 发现只有一个显示在Web UI 上. 于是我就简单地检查了下另外两台没有启动的 storm supervisor的日志, 发现没有报出什么异常 ...

  8. NodeJS+Express+Socket.io的一个简单例子

    关键字:NodeJS,Express,Socket.io. OS:Windows 8.1 with update pro. 1.安装NodeJS:http://nodejs.org/. 2.初始化一个 ...

  9. nodejs之socket.io模块——实现了websocket协议

    Nodejs实现websocket的4种方式:socket.io.WebSocket-Node.faye-websocket-node.node-websocket-server,主要使用的是sock ...

随机推荐

  1. jquery.Callbacks的实现

    前言 本人是一个热爱前端的菜鸟,一直喜欢学习js原生,对于jq这种js库,比较喜欢理解他的实现,虽然自己能力有限,水平很低,但是勉勉强强也算是能够懂一点吧,对于jq源码解读系列,博客园里有很多,推荐大 ...

  2. pt-online-schema-change中update触发器的bug

    pt-online-schema-change在对表进行表结构变更时,会创建三个触发器. 如下文测试案例中的t2表,表结构如下: mysql> show create table t2\G . ...

  3. Linux常用命令操作

    系统信息 arch 显示机器的处理器架构(1) uname -m 显示机器的处理器架构(2) uname -r 显示正在使用的内核版本 dmidecode -q 显示硬件系统部件 - (SMBIOS ...

  4. 【NLP】Python NLTK获取文本语料和词汇资源

    Python NLTK 获取文本语料和词汇资源 作者:白宁超 2016年11月7日13:15:24 摘要:NLTK是由宾夕法尼亚大学计算机和信息科学使用python语言实现的一种自然语言工具包,其收集 ...

  5. Javacript实现字典结构

    字典是一种用[键,值]形式存储元素的数据结构.也称作映射,ECMAScript6中,原生用Map实现了字典结构. 下面代码是尝试用JS的Object对象来模拟实现一个字典结构. <script& ...

  6. 高效而稳定的企业级.NET Office 组件Spire（.NET组件介绍之二）

    在项目开发中,尤其是企业的业务系统中,对文档的操作是非常多的,有时几乎给人一种错觉的是”这个系统似乎就是专门操作文档的“.毕竟现在的很多办公中大都是在PC端操作文档等软件,在这些庞大而繁重的业务中,单 ...

  7. SAP CRM 将组件整合至导航栏中

    到现在,我们已经可以让组件独立地显示.我们只是运行它.让它显示在Web UI中.让我们把组件整合进导航栏,使我们可以在正常登录Web UI时访问它. 步骤一: 为你的UI组件主窗体创建一个内向插件. ...

  8. IIS8 使用FastCGI配置PHP环境支持 过程详解

    平时帮朋友们配置过一些PHP环境的服务器,但是一直使用的都是Apache HTTP+PHP,今天呢,我吧IIS+PHP配置方式给大家发一下下~呵呵. 在这里,我使用的是FastCGI模块映射的方式配置 ...

  9. 超详细mysql left join,right join,inner join用法分析

    下面是例子分析表A记录如下: aID        aNum 1           a20050111 2           a20050112 3           a20050113 4   ...

  10. Linux设备文件简介(转载)

    Linux 中的设备有2种类型:字符设备(无缓冲且只能顺序存取).块设备(有缓冲且可以随机存取).每个字符设备和块设备都必须有主.次设备号,主设备号相同的设 备是同类设备(使用同一个驱动程序).这些设 ...