单页网站模板上海做核酸最新通知

当前位置： 首页 > news >正文

单页网站模板,上海做核酸最新通知,重庆免费公司建网站,定制网站费用架构#xff1a; 介绍#xff1a; 硬件端#xff1a;设备端使用modbus slave来模拟#xff08;服务器端#xff09;#xff0c;通过Modbus TCP协议与Modbus 采集控制程序#xff08;客户端#xff09;进行通信 通信#xff1a;#xff08;进程间通信#xff09; 对于…   架构 介绍 硬件端设备端使用modbus slave来模拟服务器端通过Modbus TCP协议与Modbus 采集控制程序客户端进行通信 通信进程间通信 对于采集的传感器数据Modbus 采集控制程序执行modbus tcp的03功能将传感器数据从slave一侧读出通过共享内存将数据交给网页服务器最终在网页上显示出来 对于控制信息网页端点击操作后网页服务器收到相应的数据即要实现的指令并通过消息队列将指令传给Modbus 采集控制程序然后Modbus 采集控制程序再通过modbus tcp的05功能实现对slave的控制 网页端搭建一个简易的网页服务器通过HTTP协议实现网页服务器与网页之间的请求与响应 演示 【基于webserver工业数据采集小项目】 https://www.bilibili.com/video/BV18xMbzqEMn/?share_sourcecopy_webvd_sourceca8d891b9994089253ad45652f349b9e 主要代码 Modbus 采集控制程序 #include pthread.h #include string.h #include sys/types.h #include sys/socket.h #include netinet/in.h #include netinet/ip.h #include arpa/inet.h #include sys/types.h #include sys/ipc.h #include sys/shm.h #include sys/msg.h #include unistd.h #include stdlib.h #include modbus.h #include stdio.h #include errno.h // modbus clientmodbus_t *ctx1,*ctx2;//从mobus slave端读取传感器数据并通过共享内存将读到的数据送到网页服务器 void *handler1(void *arg) {int num;// 拿到keykey_t k ftok(a.c, a);// 获取共享内存号int shmid;shmid shmget(k, sizeof(uint16_t)*128, IPC_CREAT | IPC_EXCL | 0777);if (shmid 0){if (errno EEXIST){shmid shmget(k, sizeof(uint16_t)128, 0777);}else{perror(shmget err);return NULL;}}// 将共享内存映射到用户空间拿到共享内存地址uint16_t data ( uint16_t)shmat(shmid, NULL, 0);if (data ( uint16_t)-1){perror(shmat err);return NULL;}while (1){// 执行03功能num modbus_read_registers(ctx1, 0, 4, data);for (int i 0; i num; i){printf(%d , data[i]);}putchar(10);sleep(1);} }struct msgbuf {/消息类型正整数/long type;//必须有/消息正文　自定义/int order; }; //网页服务器通过消息队列发来的控制命令对modbus slave端的硬件设备进行控制 void *handler2(void *arg) {key_t key;key ftok(a.c,a);if(key0){perror(ftok err);return NULL;}//创建或打开消息队列int msgidmsgget(key,IPC_CREAT|IPC_EXCL|0777);if(msgid0){if (errnoEEXIST){msgidmsgget(key,0777);}else{perror(msgget err);return NULL;}}/读取消息///定义一个结构体变量用来接收消息struct msgbuf m;while (1){msgrcv(msgid,m,sizeof(m)-sizeof(long),1,IPC_NOWAIT);int orderm.order;if (order 0) //LED on{modbus_write_bit(ctx2, 0, 1);}else if (order 1) //LED off{modbus_write_bit(ctx2, 0, 0);}else if (order 2) //buzzer on{modbus_write_bit(ctx2, 1, 1);}else //buzzer off{modbus_write_bit(ctx2, 1, 0);}}return NULL; }int main(int argc, char const argv[]) {// 创建modbus实例//用于采集数据ctx1 modbus_new_tcp(argv[3], atoi(argv[1]));if (ctx1 NULL){perror(modbus_new_tcp err);return -1;}else{printf(创建实例成功\n);}// 设置从机IDif (modbus_set_slave(ctx1, 1) 0){perror(modbus_set_slave err);return -1;}else{printf(从机ID设置成功\n);}// 建立连接if (modbus_connect(ctx1) 0){perror(modbus_connect err);return -1;}else{printf(连接成功\n);}//用于控制ctx2 modbus_new_tcp(argv[3], atoi(argv[2]));if (ctx2 NULL){perror(modbus_new_tcp err);return -1;}else{printf(创建实例成功\n);}// 设置从机IDif (modbus_set_slave(ctx2, 2) 0){perror(modbus_set_slave err);return -1;}else{printf(从机ID设置成功\n);}// 建立连接if (modbus_connect(ctx2) 0){perror(modbus_connect err);return -1;}else{printf(连接成功\n);}pthread_t tid1, tid2;pthread_create(tid1, NULL, handler1, NULL);printf(输入指令来设置线圈状态(0:LED开 1:LED关 2:buzzer开 3:buzzer关)\n);pthread_create(tid2, NULL, handler2, NULL);pthread_join(tid1,NULL); pthread_join(tid2,NULL);// 关闭套接字modbus_close(ctx1);modbus_close(ctx2);// 关闭连接modbus_free(ctx1);modbus_free(ctx2);return 0; }WEB服务器主要使用函数 /********************************************************************************** Copy right: hqyj Tech. Author: jiaoyue Date: 2023.07.01 Description: http请求处理 ***********************************************************************************/#include sys/types.h #include sys/socket.h #include custom_handle.h#define KB 1024 #define HTML_SIZE (64 * KB)// 普通的文本回复需要增加html头部 #define HTML_HEAD Content-Type: text/html\r\n \Connection: close\r\nstatic int handle_login(int sock, const char *input) {char cpy[128];strcpy(cpy, input);char reply_buf[HTML_SIZE] {0};// strstr函数返回子串在主串中首次出现时的位置char *p strstr(cpy, password);char *passwd p strlen(password);char *temp passwd;while (*temp ! )temp;temp \0;(p) \0;char *uname strstr(cpy, username);uname strlen(username);// 创建和打开数据库sqlite3 *db;if (sqlite3_open(userDB.db, db) ! SQLITE_OK){fprintf(stderr, open err:%s\n, sqlite3_errmsg(db));return -1;}else{printf(打开数据库成功\n);}// 创建表char *errmsg;if (sqlite3_exec(db, create table if not exists usermsg (name string,password int), NULL, NULL, errmsg) ! SQLITE_OK){fprintf(stderr, create table err:%s\n, errmsg);return -1;}else{printf(打开表成功\n);}char a1[5] no;char a2[5] yes;char sql[128];sprintf(sql, select * from usermsg where name%s and password%s, uname, passwd);printf(sql%s\n, sql);char result NULL; // 用于存储查询到的结果int row 0, column 0; // 记录行数和列数sqlite3_get_table(db, sql, result, row, column, errmsg);if (row0){send(sock, a1, 5, 0);printf(%s\n, a1);}else{send(sock, a2, 5, 0);printf(%s\n, a2);}return 0; }static int handle_add(int sock, const char *input) {int number1, number2;// input必须是data11data26类似的格式注意前端过来的字符串会有双引号sscanf(input, \data1%ddata2%d\, number1, number2);printf(num1 %d\n, number1);char reply_buf[HTML_SIZE] {0};printf(num %d\n, number1 number2);sprintf(reply_buf, %d, number1 number2);printf(resp %s\n, reply_buf);send(sock, reply_buf, strlen(reply_buf), 0);return 0; }/* brief 处理自定义请求在这里添加进程通信* param input* return*/ int count 0; // 采集数据 int commuwithsensor(int sock, const char *input) {// 拿到keykey_t k ftok(/home/hq/25041/day55/a.c, a);// 获取共享内存号int shmid;shmid shmget(k, sizeof(uint16_t) * 128, IPC_CREAT | IPC_EXCL | 0777);if (shmid 0){if (errno EEXIST){shmid shmget(k, sizeof(uint16_t) * 128, 0777);}else{perror(shmget err);return -1;}}// 将共享内存映射到用户空间拿到共享内存地址uint16_t *data (uint16_t *)shmat(shmid, NULL, 0);if (data (uint16_t *)-1){perror(shmat err);return -1;}// 将传感器数据从共享内存中拿到发送给网页char reply_buf[HTML_SIZE] {0};sprintf(reply_buf, %d %d %d %d \n, data[0], data[1], data[2], data[3]);printf(resp %s\n, reply_buf);send(sock, reply_buf, strlen(reply_buf), 0);// 将记录插入数据库char sql[128];char buf[128];sprintf(buf, 传感器%d 加速度_x: %d 加速度_y:%d 加速度_z:%d , data[0], data[1], data[2], data[3]);sprintf(sql, insert into sensordata(id, data) values(%d,%s), count, buf);commuwithdb(sql);return 0; }// 控制 int commuwithcoil(int sock, const char *input) {int order;sscanf(input, \order%d\, order);printf(order %d \n, order);// 拿到key值key_t key;key ftok(/home/hq/25041/day55/a.c, a);if (key 0){perror(ftok err);return -1;}// 创建或打开消息队列int msgid msgget(key, IPC_CREAT | IPC_EXCL | 0777);if (msgid 0){if (errno EEXIST){msgid msgget(key, 0777);}else{perror(msgget err);return -1;}}/制作消息/// 先定义一个结构体变量struct msgbuf msg;// 变量初始化msg.type 1;msg.order order;/添加消息/msgsnd(msgid, msg, sizeof(msg) - sizeof(long), 0);// 将记录插入数据库char sql[128];char data[20];if (order 0){strcpy(data, LED on);}else if (order 1){strcpy(data, LED off);}else if (order 2){strcpy(data, buzzer on);}else{strcpy(data, buzzer off);}sprintf(sql, insert into sensordata(id, data) values(%d,%s), count, data);commuwithdb(sql); }int commuwithdb(char *sql) {// 创建和打开数据库sqlite3 *db;if (sqlite3_open(userDB.db, db) ! SQLITE_OK){fprintf(stderr, open err:%s\n, sqlite3_errmsg(db));return -1;}else{printf(打开数据库成功\n);}// 创建表char *errmsg;if (sqlite3_exec(db, create table if not exists sensordata (id int ,data string,time DATETIME DEFAULT CURRENT_TIMESTAMP), NULL, NULL, errmsg) ! SQLITE_OK){fprintf(stderr, create table err:%s\n, errmsg);return -1;}else{printf(打开表成功\n);}if (count 0){if (sqlite3_exec(db, delete from sensordata , NULL, NULL, errmsg) ! SQLITE_OK){fprintf(stderr, clear table err:%s\n, errmsg);return -1;}else{printf(清空表成功\n);}}if (sqlite3_exec(db, sql, NULL, NULL, errmsg) ! SQLITE_OK){fprintf(stderr, insert err:%s\n, errmsg);return -1;}else{printf(插入成功\n);} }int parse_and_process(int sock, const char *query_string, const char *input) {// query_string不一定能用的到// 先处理登录操作if (strstr(input, username) strstr(input, password)){return handle_login(sock, input);}// 处理求和请求else if (strstr(input, data1) strstr(input, data2)){return handle_add(sock, input);}// 读取传感器数据else if (strstr(input, light) strstr(input, ax) strstr(input, ay) strstr(input, az)){return commuwithsensor(sock, input);}else if (strstr(input, order)){return commuwithcoil(sock, input);}else // 剩下的都是json请求这个和协议有关了{// 构建要回复的JSON数据const char json_response {\message: \Hello, client!};// 发送HTTP响应给客户端send(sock, json_response, strlen(json_response), 0);}return 0; }登录页面 !DOCTYPE html html langzh-CNheadmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0title智能系统登录/titlestylekeyframes float {0%,100% {transform: translateY(0);}50% {transform: translateY(-10px);}}keyframes fadeIn {from {opacity: 0;transform: translateY(20px);}to {opacity: 1;transform: translateY(0);}}body {font-family: Segoe UI, Tahoma, Geneva, Verdana, sans-serif;margin: 0;padding: 0;display: flex;justify-content: center;align-items: center;min-height: 100vh;background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);color: #fff;overflow: hidden;}.login-container {width: 90%;max-width: 400px;background: rgba(255, 255, 255, 0.1);backdrop-filter: blur(12px);border-radius: 20px;padding: 40px;box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);border: 1px solid rgba(255, 255, 255, 0.1);text-align: center;animation: fadeIn 0.8s ease-out forwards;transform-origin: center;transition: transform 0.3s ease;}.login-container:hover {transform: scale(1.02);}.logo {font-size: 2.5rem;font-weight: 600;margin-bottom: 30px;background: linear-gradient(to right, #fff, #e0e0e0);-webkit-background-clip: text;background-clip: text;color: transparent;animation: float 4s ease-in-out infinite;}.input-group {margin-bottom: 25px;text-align: left;}label {display: block;margin-bottom: 8px;font-size: 0.9rem;color: rgba(255, 255, 255, 0.8);transform: translateX(5px);transition: all 0.3s ease;}input {width: 100%;padding: 12px 15px;border-radius: 8px;border: 1px solid rgba(255, 255, 255, 0.3);background: rgba(255, 255, 255, 0.1);color: white;font-size: 1rem;transition: all 0.3s ease;}input:focus {outline: none;border-color: rgba(255, 255, 255, 0.6);background: rgba(255, 255, 255, 0.2);box-shadow: 0 0 10px rgba(255, 255, 255, 0.2);}input:focuslabel {color: white;transform: translateX(0);}.btn {width: 100%;padding: 12px;border-radius: 8px;border: none;background: rgba(255, 255, 255, 0.3);color: white;font-size: 1rem;font-weight: 500;cursor: pointer;transition: all 0.3s ease;margin-top: 10px;position: relative;overflow: hidden;}.btn:hover {background: rgba(255, 255, 255, 0.4);}.btn:active {transform: scale(0.98);}.btn::after {content: ;position: absolute;top: 50%;left: 50%;width: 5px;height: 5px;background: rgba(255, 255, 255, 0.5);opacity: 0;border-radius: 100%;transform: scale(1, 1) translate(-50%, -50%);transform-origin: 50% 50%;}.btn:focus:not(:active)::after {animation: ripple 1s ease-out;}keyframes ripple {0% {transform: scale(0, 0);opacity: 0.5;}100% {transform: scale(20, 20);opacity: 0;}}.footer {margin-top: 30px;font-size: 0.8rem;color: rgba(255, 255, 255, 0.6);animation: fadeIn 1s ease-out 0.3s both;}a {color: rgba(255, 255, 255, 0.8);text-decoration: none;transition: color 0.3s ease;position: relative;}a:hover {color: white;}a::after {content: ;position: absolute;width: 0;height: 1px;bottom: -2px;left: 0;background-color: white;transition: width 0.3s ease;}a:hover::after {width: 100%;}/style /headbodydiv classlogin-containerdiv classlogo智能系统/divdiv classinput-groupinput typetext idusername placeholder requiredlabel forusername用户名/label/divdiv classinput-groupinput typepassword idpassword placeholder requiredlabel forpassword密码/label/divbutton classbtn idloginBtn登 录/buttondiv classfootera href#忘记密码?/a | a href#注册账号/a/div/divscriptdocument.getElementById(loginBtn).addEventListener(click, function () {// 如果需要验证后再跳转可以使用以下代码const u document.getElementById(username).value;const p document.getElementById(password).value;var x new XMLHttpRequest();x.open(post, , true);//true:异步通知var s \ username u password p \;x.send(s);x.onreadystatechange function () {// :不区分数据类型的判等// :区分数据类型的判等if (x.readyState 4 x.status 200) {var r x.responseText;//响应正文 // console.log(encodeURIComponent®); if (r.slice(0,2) no){alert(用户名密码错误请重新输入);}else {window.location.href needsensor.html;}}}/// 直接跳转window.location.href needsensor.html;*/});/script /body/html 主页 !DOCTYPE html html langzh-CNheadmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0title智能设备控制面板/titlestylebody {font-family: Segoe UI, Tahoma, Geneva, Verdana, sans-serif;margin: 0;padding: 0;display: flex;justify-content: center;align-items: center;min-height: 100vh;background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);color: #fff;}.container {width: 90%;max-width: 800px;background: rgba(255, 255, 255, 0.1);backdrop-filter: blur(12px);border-radius: 20px;padding: 30px;box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);border: 1px solid rgba(255, 255, 255, 0.1);}h1 {text-align: center;margin-bottom: 30px;font-weight: 600;font-size: 2.2rem;background: linear-gradient(to right, #fff, #e0e0e0);-webkit-background-clip: text;background-clip: text;color: transparent;}.section {margin-bottom: 30px;padding: 25px;border-radius: 15px;background: rgba(255, 255, 255, 0.15);backdrop-filter: blur(5px);}h2 {margin-top: 0;margin-bottom: 20px;font-weight: 500;color: #f0f0f0;}.sensor-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));gap: 20px;}.sensor-card {background: rgba(255, 255, 255, 0.2);border-radius: 12px;padding: 20px;transition: transform 0.3s ease;}.sensor-card:hover {transform: translateY(-5px);}.sensor-name {font-size: 1rem;margin-bottom: 10px;color: rgba(255, 255, 255, 0.8);}.sensor-value {font-size: 1.8rem;font-weight: 700;margin-bottom: 5px;}.unit {font-size: 0.9rem;color: rgba(255, 255, 255, 0.6);}.controls {display: grid;grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));gap: 20px;}.control-group {background: rgba(255, 255, 255, 0.2);border-radius: 12px;padding: 20px;}.radio-option {display: flex;align-items: center;margin-bottom: 15px;}input[typeradio] {appearance: none;width: 20px;height: 20px;border: 2px solid rgba(255, 255, 255, 0.5);border-radius: 50%;margin-right: 10px;position: relative;cursor: pointer;}input[typeradio]:checked {background: rgba(255, 255, 255, 0.3);border-color: #fff;}input[typeradio]:checked::after {content: ;position: absolute;width: 10px;height: 10px;background: #fff;border-radius: 50%;top: 3px;left: 3px;}label {cursor: pointer;font-size: 1rem;}/style /headbodydiv classcontainerh1智能设备控制面板/h1div classsectionh2传感器数据/h2div classsensor-griddiv classsensor-carddiv classsensor-name光照强度/divdiv classsensor-value idlight-value0/divdiv classunitlux/div/divdiv classsensor-carddiv classsensor-name加速度 X轴/divdiv classsensor-value idaccel-x0.00/divdiv classunitm/s²/div/divdiv classsensor-carddiv classsensor-name加速度 Y轴/divdiv classsensor-value idaccel-y0.00/divdiv classunitm/s²/div/divdiv classsensor-carddiv classsensor-name加速度 Z轴/divdiv classsensor-value idaccel-z9.81/divdiv classunitm/s²/div/div/div/divdiv classsectionh2设备控制/h2div classcontrolsdiv classcontrol-groupdiv classradio-optioninput typeradio idled-on nameled onclickset0()label forled-onLED灯开启/label/divdiv classradio-optioninput typeradio idled-off nameled checked onclickset1()label forled-offLED灯关闭/label/div/divdiv classcontrol-groupdiv classradio-optioninput typeradio idbuzzer-on namebuzzer onclickset2()label forbuzzer-on蜂鸣器开启/label/divdiv classradio-optioninput typeradio idbuzzer-off namebuzzer onclickset3() checkedlabel forbuzzer-off蜂鸣器关闭/label/div/div/div/div/divscript//每隔一秒刷新一次获取到的传感器数据function updateSensorData() {var x new XMLHttpRequest();x.open(post, , true);//true:异步通知x.send(\light1ax2ay3az4);x.onreadystatechange function () {// :不区分数据类型的判等// :区分数据类型的判等if (x.readyState 4 x.status 200) {var r x.responseText;//响应正文var s r.split( );document.getElementById(light-value).textContent s[0];document.getElementById(accel-x).textContent s[1]document.getElementById(accel-y).textContent s[2]document.getElementById(accel-z).textContent s[3]}}}setInterval(updateSensorData, 1000);updateSensorData();//控制function set0() {var x new XMLHttpRequest();x.open(post, , true);//true:异步通知x.send(order0);}function set1() {var x new XMLHttpRequest();x.open(post, , true);//true:异步通知x.send(\order1);}function set2() {var x new XMLHttpRequest();x.open(post, , true);//true:异步通知x.send(\order2);}function set3() {var x new XMLHttpRequest();x.open(post, , true);//true:异步通知x.send(\order3);}/script/body/html 问题 可以再扩展一下注册页面 还有一个让我超级无语的错误o(╥﹏╥)o 就是这个登录页面的判断判断用户名和密码是否在数据库中我在服务器端使用SQL语句查询数据库之后若能找到对应的用户名密码会给网页响应yes否则就响应no然后我明明 r 打印出来就是no,结果 rno的判断就是0我真的好一顿捣鼓确认就是判等的问题后我就去查了查结果令我十分无语用console.log(encodeURIComponent®);  显示了一下完整的字符串no后面跟了一堆%00,这要能等才神奇我就切片了一下果然就成功进去了。。。(ー)