前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >搭建简易的物联网服务端和客户端-网络控制(二十)

搭建简易的物联网服务端和客户端-网络控制(二十)

作者头像
治电小白菜
发布2020-08-25 11:27:03
1.1K0
发布2020-08-25 11:27:03
举报
文章被收录于专栏:技术综合技术综合技术综合

网络控制,就是通过前端页面点击控制按钮,然后通过ajax来出发后端函数将命令存入数据库,然后后端TCP服务端将命令从数据库取出,发送给单片机。当然只是简单的一个命令实现。 代码地址:https://github.com/klren0312/stm32_wifi 2017.5.1

搭建简易的物联网服务端和客户端目录

网络控制

1.建立一个存储命令的表

(1)比如staus表

数据库.jpg

2.编写express接口

提供给前端按钮通过AJAX触发

(1)当触发/buttonclick1,则将命令1存入数据库; 当触发/buttonclick0,则将命令0存入数据库。

//按钮api
app.get('/buttonclick1',function(req,res){
    //增加
    var post = {status:1};
    conn.query('INSERT INTO status SET ?', post ,function(error,result,fields){
        if(error) throw error;
    });
    res.send("1");
    res.end();// 如果不执行end(), 那么前端网页则会一直等待response
})
app.get('/buttonclick0',function(req,res){
    //增加
    var post = {status:0};
    conn.query('INSERT INTO status SET ?', post ,function(error,result,fields){
        if(error) throw error;
    });
    res.send("0");
    res.end();// 如果不执行end(), 那么前端网页则会一直等待response
})

3.编写前端按钮

(1)HTML

就两个button,一个开,一个关

<button onclick="buttonclk1()">开启</button> 
<button onclick="buttonclk0()">关闭</button> 

(2)javascript

ajax触发,使用fetch

function status(response){
     if(response.status>=200 && response.status<300){
        return Promise.resolve(response);
     }else{
        return Promise.reject(new Error(response.statusText));
     }
}
function json(response){
    return response.json();
}
//开启按钮触发函数
function buttonclk1(){
    fetch("http://127.0.0.1:3000/buttonclick1")//后端提供的buttonclick1接口
        .then(status)
        .then(json)
        .then(function(data){
           console.log("请求成功,JSON解析后的响应数据为:",data);
        })
        .catch(function(err){
            console.log("Fetch错误:"+err);
    });
}   
//关闭按钮触发函数
function buttonclk0(){
    fetch("http://127.0.0.1:3000/buttonclick0")///后端提供的buttonclick0接口
        .then(status)
        .then(json)
        .then(function(data){               console.log("请求成功,JSON解析后的响应数据为:",data);
    })
    .catch(function(err){
        console.log("Fetch错误:"+err);
    });
}

(3)点击触发结果

前端.jpg

4.TCP服务端

在和单片机建立通信后,就会一直从数据库获取最新的命令,然后发送给单片机。

(1)代码

将其写入socket.on内

conn.query('SELECT * FROM status',function(err,rows,fields){
    if (err) throw err;
    socket.write(rows[rows.length-1].status+"");//必须要字符串才能发,用toString()报错,有人知道为啥吗?
})          

5.STM32代码

当然还是基于onenet的代码,感谢中移物联,代码写的很易读!具体只放处理数据的代码。

(1)处理数据,控制LED的开关

void Net_Event(unsigned char *dataPtr){
    if(strstr((char *)dataPtr, "1"))
    {
        UsartPrintf(USART_DEBUG, "¿ª\r\n");
        Led4_Set(LED_ON);
    }
    else if(strstr((char *)dataPtr,"0")){
        UsartPrintf(USART_DEBUG,"¹Ø\r\n");
        Led4_Set(LED_OFF);
    }
}

6.串口截图

串口显示.jpg

@治电小白菜20170501

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 网络控制
    • 1.建立一个存储命令的表
      • 2.编写express接口
        • 3.编写前端按钮
          • 4.TCP服务端
            • 5.STM32代码
              • 6.串口截图
              相关产品与服务
              数据库
              云数据库为企业提供了完善的关系型数据库、非关系型数据库、分析型数据库和数据库生态工具。您可以通过产品选择和组合搭建,轻松实现高可靠、高可用性、高性能等数据库需求。云数据库服务也可大幅减少您的运维工作量,更专注于业务发展,让企业一站式享受数据上云及分布式架构的技术红利!
              领券
              问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档