多路温度采集控制系统（8）网页界面

2024-04-18 04:18
文章标签 网页 界面 采集 控制系统 多路 温度

本文主要是介绍多路温度采集控制系统（8）网页界面，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

嵌入式项目实践–多路温度采集控制系统（8）网页界面

嵌入式开发培训（阶段1）基础应用开发视频地址
多路温度采集系统视频地址

网页界面

这里写图片描述

网页界面html源码

<TABLE WIDTH=800 BORDER=0 CELLPADDING=0 CELLSPACING=0>
<TR>
<TD COLSPAN=5><IMG SRC="/images/temp_1.jpg" WIDTH=1024 HEIGHT=92></TD>
<TD><IMG SRC="/images/spacer.gif" WIDTH=1 HEIGHT=92></TD>
</TR>
<TR>
<TD COLSPAN=2><IMG SRC="/images/temp_21.jpg" WIDTH=400 HEIGHT=108></TD>
...
</TABLE>

网页界面CGI程序源码

 printf("<TABLE WIDTH=800 BORDER=0 CELLPADDING=0 CELLSPACING=0><TR><TD COLSPAN=5>");printf("<IMG SRC=\"/images/temp_1.jpg\" WIDTH=1024 HEIGHT=92></TD><TD>");printf("<IMG SRC=\"/images/spacer.gif\" WIDTH=1 HEIGHT=92></TD></TR><TR>");if(g_dev->temp_data[0] <= (float)g_dev->temp_max[0])printf("<TD COLSPAN=2><IMG SRC=\"/images/temp_21.jpg\" WIDTH=400 HEIGHT=108></TD>");elseprintf("<TD COLSPAN=2><IMG SRC=\"/images/temp_22.jpg\" WIDTH=400 HEIGHT=108></TD>");...

网页同主控通信

首先通过消息队列发送更新数据请求，主控程序更新共享内存，然后读取共享内存数据在网页上显示。

if(msg_send(msgid)==0){if((shm_dev=(struct st_sys*)set_web_shm())==NULL){printf("shm_web error\n");  exit(1);}else{for(i=0;i<DEF_MAX_CHANNEL;i++){g_dev->temp_max[i] = shm_dev->temp_max[i];g_dev->temp_data[i] = shm_dev->temp_data[i];g_dev->status[i] = shm_dev->status[i] ;}g_dev->update_time = shm_dev->update_time;}
}

网页界面程序代码

HTML函数头文件 


#include<stdio.h>void html_begin(void);
void html_body(void);
void html_body_noimg(void);
void html_end(void);
void html_refresh(char* second, char* url);/*---------html begin tag-------------*/
void html_begin(void)
{printf("Content-type:text/html\r\n\r\n");printf("<html>");printf("<title>TC90000多路温度采集控制系统</title>");printf("<link href=\"/noneline.css\" rel=\"stylesheet\" type=\"text/css\">");}/*---------html refresh tag-------------*/
void html_refresh(char* second, char* url)
{printf("<META HTTP-EQUIV=\"REFRESH\" CONTENT=\"%s;URL=%s\">", second, url);}/*---------html body tag-------------*/
void html_body(void)
{printf("<body background=\"/bg_black.gif\">");printf("<div align=\"center\">");
}/*---------html body tag-------------*/
void html_body_noimg(void)
{printf("<body><div align=\"center\">");
}/*---------html end tag-------------*/
void html_end(void)
{printf("</div></body></html>");
}

网页CGI程序


#include <unistd.h>
#include <stdlib.h>
#include <stdio.h>
#include <string.h>
#include <sys/types.h>
#include <sys/stat.h>
#include <sys/ipc.h>
#include <sys/msg.h>
#include <sys/shm.h>
#include "html.h"#define DEF_MAX_CHANNEL 4       //采集的路数
//消息队列接收时索引值
#define TEMP_SMG_INDEX_BASE 10
#define WEB_SMG_INDEX 2
#define WEB_UPDATE_SMG_INDEX 3
#define UPDATE_TIME_SMG_INDEX 4//系统总体数据结构
struct st_sys{int temp_max[DEF_MAX_CHANNEL];      //设置每路温度报警最大值float temp_data[DEF_MAX_CHANNEL];   //每路温度char status[DEF_MAX_CHANNEL];       //每路状态char update_time;                   //网页刷新秒数
};struct st_sys g_dev[1];//消息队列数据结构
struct st_msg_req{long int index;char req;       
};int msg_send(int msgid)
{struct st_msg_req cmd;cmd.index = WEB_UPDATE_SMG_INDEX;cmd.req = 0x1;if(msgsnd(msgid,(void*)&cmd,1,0)==-1)return -1;return 0;
}int get_msgid(void)
{int id = -1;id = msgget((key_t)1234,0666|IPC_CREAT);if(id == -1){printf("msgget error\n");exit(1);}return id;
}void* set_web_shm(void)
{int shmid;void* shmaddr=(void*)0;if((shmid=shmget((key_t)2345,sizeof(struct st_sys),0666|IPC_CREAT))<0){
        return NULL;}else{  if((shmaddr=shmat(shmid,(void*)0,0))==(char *)-1){return NULL;}}printf("set shm ok...\n");return shmaddr;
}char area_name[4][16]={"锅炉区","螺栓区...","电缆区...","汽电区..."};//在网页上显示四路温度数据 
void show_temp_table()
{int i;printf("<table width=\"1024\" border=\"0\"><tr>");for(i=0;i<4;i++){
        printf("<td><table width=\"250\" border=\"0\"><tr><td colspan=\"2\" bgcolor=#CCFFFF>");printf("<div align=center>第%d路</div></td></tr>",i+1);printf("<tr><td width=\"82\" bgcolor=#33CCFF>监控区域：</td>");printf("<td width=\"158\" bgcolor=#33CCFF>%s</td></tr>",area_name[i]);                printf("<tr><td bgcolor=#33CCFF>连接状态：</td>");if(g_dev->status[i]==1)printf("<td bgcolor=#33CCFF>%s</td></tr>","连通");elseprintf("<td bgcolor=#33CCFF>%s</td></tr>","断开");                printf("<tr><td bgcolor=\"#33CCFF\">当前温度：</td>");printf("<td bgcolor=\"#33CCFF\">%4.2f</td></tr>",g_dev->temp_data[i]);   printf("<tr><td bgcolor=\"#33CCFF\">报警上限：</td>");printf("<td bgcolor=\"#33CCFF\">%d</td></tr></table></td>",g_dev->temp_max[i]);}       printf("</tr></table>");
}void show_sys_area(void)
{printf("<TABLE WIDTH=800 BORDER=0 CELLPADDING=0 CELLSPACING=0><TR><TD COLSPAN=5>");printf("<IMG SRC=\"/images/temp_1.jpg\" WIDTH=1024 HEIGHT=92></TD><TD>");printf("<IMG SRC=\"/images/spacer.gif\" WIDTH=1 HEIGHT=92></TD></TR><TR>");if(g_dev->temp_data[0] <= (float)g_dev->temp_max[0])printf("<TD COLSPAN=2><IMG SRC=\"/images/temp_21.jpg\" WIDTH=400 HEIGHT=108></TD>");elseprintf("<TD COLSPAN=2><IMG SRC=\"/images/temp_22.jpg\" WIDTH=400 HEIGHT=108></TD>");if(g_dev->temp_data[1] <= (float)g_dev->temp_max[1])    printf("<TD COLSPAN=2 ROWSPAN=2><IMG SRC=\"/images/temp_31.jpg\" WIDTH=381 HEIGHT=133></TD>");elseprintf("<TD COLSPAN=2 ROWSPAN=2><IMG SRC=\"/images/temp_32.jpg\" WIDTH=381 HEIGHT=133></TD>");  printf("<TD ROWSPAN=4><IMG SRC=\"/images/temp_4.jpg\" WIDTH=243 HEIGHT=409></TD>");printf("<TD><IMG SRC=\"/images/spacer.gif\" WIDTH=1 HEIGHT=108></TD></TR><TR>");if(g_dev->status[2]==1){if(g_dev->temp_data[2] <= (float)g_dev->temp_max[2])printf("<TD ROWSPAN=3><IMG SRC=\"/images/temp_51.jpg\" WIDTH=193 HEIGHT=301></TD>");elseprintf("<TD ROWSPAN=3><IMG SRC=\"/images/temp_52.jpg\" WIDTH=193 HEIGHT=301></TD>");}else{printf("<TD ROWSPAN=3><IMG SRC=\"/images/temp_5.jpg\" WIDTH=193 HEIGHT=301></TD>");}if(g_dev->status[3]==1){    if(g_dev->temp_data[3] <= (float)g_dev->temp_max[3])printf("<TD ROWSPAN=3><IMG SRC=\"/images/temp_61.jpg\" WIDTH=207 HEIGHT=301></TD>");elseprintf("<TD ROWSPAN=3><IMG SRC=\"/images/temp_62.jpg\" WIDTH=207 HEIGHT=301></TD>");}else{printf("<TD ROWSPAN=3><IMG SRC=\"/images/temp_6.jpg\" WIDTH=207 HEIGHT=301></TD>");     }   printf("<TD><IMG SRC=\"/images/spacer.gif\" WIDTH=1 HEIGHT=25></TD></TR><TR>");printf("<TD COLSPAN=2><IMG SRC=\"/images/temp_7.jpg\" WIDTH=381 HEIGHT=141></TD>");printf("<TD><IMG SRC=\"/images/spacer.gif\" WIDTH=1 HEIGHT=141></TD></TR><TR>");printf("<TD><IMG SRC=\"/images/temp_8.jpg\" WIDTH=178 HEIGHT=135></TD><TD>");printf("<IMG SRC=\"/images/temp_9.jpg\" WIDTH=203 HEIGHT=135></TD><TD>");printf("<IMG SRC=\"/images/spacer.gif\" WIDTH=1 HEIGHT=135></TD></TR></TABLE>");
}int main(int argc, char *argv[])
{int i,msgid;char update_time[4];struct st_sys* shm_dev;if((msgid=get_msgid()) < 0){printf("msg_web id error\n");  }       if(msg_send(msgid)==0){if((shm_dev=(struct st_sys*)set_web_shm())==NULL){printf("shm_web error\n");  exit(1);}else{for(i=0;i<DEF_MAX_CHANNEL;i++){g_dev->temp_max[i] = shm_dev->temp_max[i];g_dev->temp_data[i] = shm_dev->temp_data[i];g_dev->status[i] = shm_dev->status[i] ;}g_dev->update_time = shm_dev->update_time;}}html_begin();bzero(update_time,4);sprintf(update_time,"%d",g_dev->update_time);html_refresh(update_time,"/cgi-bin/show.cgi");  //页面秒自动刷新html_body_noimg();show_sys_area();//显示系统监控区域图片show_temp_table();//显示多路数据表格printf("<form method=\"get\" action=\"/cgi-bin/show.cgi\">");printf("<input type=\"submit\" value=\"刷新状态\"></form>");html_end(); return 0;
}

这篇关于多路温度采集控制系统（8）网页界面的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/913744。

相关文章

问题-windows-VPN不正确关闭导致网页打不开

问题-windows-VPN不正确关闭导致网页打不开

为什么会发生这类事情呢？ 主要原因是关机之前vpn没有关掉导致的。 至于为什么没关掉vpn会导致网页打不开，我猜测是因为vpn建立的链接没被更改。 正确关掉vpn的时候，会把ip链接断掉，如果你不正确关掉，ip链接没有断掉，此时你vpn又是没启动的，没有域名解析，所以就打不开网站。 你可以在打不开网页的时候，把vpn打开，你会发现网络又可以登录了。 方法一 注意：方法一虽然方便，但是可能会有
阅读更多...
vue同页面多路由懒加载-及可能存在问题的解决方式

vue同页面多路由懒加载-及可能存在问题的解决方式

先上图，再解释 图一是多路由页面，图二是路由文件。从图一可以看出每个router-view对应的name都不一样。从图二可以看出层路由对应的组件加载方式要跟图一中的name相对应，并且图二的路由层在跟图一对应的页面中要加上components层，多一个s结尾，里面的的方法名就是图一路由的name值，里面还可以照样用懒加载的方式。 页面上其他的路由在路由文件中也跟图二是一样的写法。 附送可能存在
阅读更多...
WordPress网创自动采集并发布插件

WordPress网创自动采集并发布插件

网创教程：WordPress插件网创自动采集并发布 阅读更新：随机添加文章的阅读数量，购买数量，喜欢数量。 使用插件注意事项 如果遇到404错误，请先检查并调整网站的伪静态设置，这是最常见的问题。需要定制化服务，请随时联系我。 本次更新内容 我们进行了多项更新和优化，主要包括： 界面设置：用户现在可以更便捷地设置文章分类和发布金额。代码优化：改进了采集和发布代码，提高了插件的稳定
阅读更多...
小红书商家电话采集软件使用指南

小红书商家电话采集软件使用指南

使用小红书商家电话采集软件可以提高商家电话的采集效率，以下是使用指南及附带代码。 步骤一：安装Python和相关库 首先，确保你的电脑已经安装了Python运行环境（建议安装Python3版本）。安装完成后，同样需要安装一些相关的库，如requests、beautifulsoup4等。在命令行窗口中输入以下命令进行安装： pip install requestspip install bea
阅读更多...
温湿度采集及OLED显示

温湿度采集及OLED显示

目录 软件I2C和硬件I2C每隔2秒钟采集一次温湿度数据，显示到OLED上，同时通过串口发送到上位机的“串口助手”软件 软件I2C和硬件I2C "I2C"代表Inter-Integrated Circuit，是一种用于在数字电路之间进行通信的串行通信协议。软件I2C和硬件I2C是两种实现这种协议的方式。 软件I2C是通过软件来模拟I2C通信协议的实现方式。在这种情况下，微控制
阅读更多...
网页脚本输入这么简单

网页脚本输入这么简单

如何在网页中进行脚本操作呢？ 研究了一下，很简单，用google浏览器的Console直接操作javaScript。思路： Created with Raphaël 2.1.0 开始 输入(如何输入) 点击（如何点击） 结束 下面是，通过脚本刷直播屏的实现，直接在Console输入即可 var words=new Arra
阅读更多...
【Qt6.3 基础教程 17】 Qt布局管理详解：创建直观和响应式UI界面

【Qt6.3 基础教程 17】 Qt布局管理详解：创建直观和响应式UI界面

文章目录 前言布局管理的基础为什么需要布局管理器？ 盒布局：水平和垂直排列小部件示例：创建水平盒布局 栅格布局：在网格中对齐小部件示例：创建栅格布局 表单布局：为表单创建标签和字段示例：创建表单布局 调整空间和伸缩性示例：增加弹性空间 总结 前言 当您开始使用Qt设计用户界面(UI)时，理解布局管理是至关重要的。布局管理不仅关系到UI的外观，更直接影响用户交互的体验。本篇博
阅读更多...
物联网系统运维——移动电商应用发布，Tomcat应用服务器，实验CentOS 7安装JDK与Tomcat,配置Tomcat Web管理界面

物联网系统运维——移动电商应用发布，Tomcat应用服务器，实验CentOS 7安装JDK与Tomcat,配置Tomcat Web管理界面

一.Tomcat应用服务器 1.Tomcat介绍 Tomcat是- -个免费的开源的Ser Ivet容器，它是Apache基金会的Jakarta 项目中的一个核心项目，由Apache， Sun和其他一 些公司及个人共同开发而成。Tomcat是一一个小型的轻量级应用服务器，在中小型系统和并发访问用户不是很多的场合下被普遍使用，是开发和调试JSP程序的首选。 在Tomcat中，应用程序的成部署很简
阅读更多...
【单片机毕业设计选题24024】-房间自动除湿控制系统

【单片机毕业设计选题24024】-房间自动除湿控制系统

系统功能: 系统分为手动和自动模式，上电默认为自动模式。自动模式下如果获取到湿度 值大于设定的湿度值则自动打开风扇，手动模式下手动开关风扇。 系统上电后显示“欢迎使用除湿控制系统请稍后”，两秒钟后进入主页面显示。 第一行显示系统模式，手动或自动模式 第二行显示获取到的温湿度 第三行显示设置的湿度阈值 第四行显示风扇状态和系统报警状态，风扇状态有开关状态，系统状态和OK和 NG状态。
阅读更多...
【STM32c8t6】AHT20温湿度采集

【STM32c8t6】AHT20温湿度采集

【STM32c8t6】AHT20温湿度采集 一、探究目的二、探究原理2.1 I2C2.1. 硬件I2C2.1. 软件I2C 2.2 AHT20数据手册 三、实验过程3.1 CubeMX配置3.2 实物接线图3.3 完整代码3.4 效果展示 四、探究总结 一、探究目的 学习I2C总线通信协议，使用STM32F103完成基于I2C协议的AHT20温湿度传感器的数据采集，并将采集的温
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2