• 郑州建网站

    |

    郑州网站建设

    |

    郑州网站制作

    |

    APP开发

    |

    软件开发

  • 郑州网站建设电话: 15937160052
  • 玩个黑科技?WEB端显示室内温湿度,wifi温湿度器采集至云端
  • 发表日期:2016-10-15   浏览:2938   关键词: App开发 wifi温度器
  • 上次APP开发android,ios实现了温湿度器采集至云端,wifi功能二次开发。

    这次我们来实现通过arduino测量室内温度并在浏览器上显示出来。

    【所需材料】

    硬件:LM35温度传感器,arduino uno板,面包板,若干导线,wifi模块。

    软件:socket.io,cylonJs, express等

    【准备-硬件部分】

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

    wifi温度器

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

    看看我连的:

    在web浏览器上显示室内温度wifi温度器

    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:

    当前温度是:--

    抱歉上面花屏了:

    var socket = io;

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

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

    });

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

    html,body{

    margin: 0;

    padding: 0;

    background-color: #242424;

    }

    .temperature{

    color: white;

    width: 400px;

    height: 400px;

    position: absolute;

    margin: auto;

    left: 0;

    right: 0;

    top: 0;

    bottom: 0;

    text-align: center;

    line-height: 400px;

    }

    .t-val {

    font-size: 40px;

    font-family: KaiTi;

    }

    然后看执行效果:页面刷新之后我就用手指捏住传感器,所以温度上升,松开又下降了。在web浏览器上显示室内温度

    然后我去看了看公司的空调设置温度是25.5(传感器一开始显示的是25.4),有图为证:

    wifi温度器

    目前只是实现了在本地wifi温湿度器,之后我再研究研究怎么连接到服务器,初步的思路有:

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

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

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

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

  • 相关新闻
    • 如何搭建景区网站建设?
      搭建一个景区网站建设的很有必要的,因为做了网站可以增加客户对旅游景点的信任,还有一方面是能让旅游企业获得更多
      日期:2022-09-02 浏览:1350
      电商网站建设为什么要独立开发?
      线上购物的基础就来源于企业的电商网站建设,做好电商网站,才能让客户在线上购物,而且现在市面上有很多的电商网站
      日期:2022-03-24 浏览:1960
      郑州建网站细节分析说明
      郑州建网站要重视产品介绍和展示,作为网站建设,其最重要的一个特点就是能够较好的进行产品的推广和宣传
      日期:2021-12-26 浏览:2145
  • 一个企业的成长,从无到有,从一个人到一群人,从一种元素到元素集合;或多或少、都要有品牌意识的存在……