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

驱动轴相机参数设置Web前端界面开发

news 2025/7/5 1:59:53

一、基于Django的Web应用界面的开发：

在Realtimeresults.html上添加一个按钮组件，获取检测到的轴型和车轮信息，点击后可以获取package.json里存放的json数据，效果如下：

实现逻辑：需要从URL设置、视图函数、html代码三方面来实现。

1、需要先在django项目下的urls.py里设置路由，当浏览器端请求的URL与该URL匹配成功时，django会调用项目下里的view.py里的视图函数realtimeresults_page，该函数先把该json文件读取出来，并连同Realtimeresults.html一起返回，保证在Realtimeresults.html可以使用到该数据。

关于文件的路径：

在settings.py里需要先加载django项目的根路径(BASE_DIR)，再加上json文件的相对路径。

package.json如下：

2、装车辆信息的盒子如下：

分别将json数据的字段加入到对应的盒子即可。

2、将django项目共享给同一局域网下所有主机进行查看。

在setting.py里设置：

再通过该命令python .\manage.py runserver 0.0.0.0:8000，可启动服务器。浏览器输入本机ip:192.168.1.231:8000即可访问该django项目。

二、通过jQuery库来实现浏览器端与服务器端的json数据交换

效果如下：

jQuery 是一个 JavaScript 库，jQuery 极大地简化了 JavaScript 编程，相比于原生js代码来说更加易于开发，代码更加简洁，集成性更强。

对于jQuery的使用，可以在官方下载静态库文件jquery.js，也可以在<head>标签里通过CDN(内容分发网络)来引用：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js">

AJAX 是与服务器交换数据的框架，在不重载全部页面的情况下，实现了对部分网页的更新。AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML)。

通过 jQuery AJAX 方法，可以使用 HTTP Get 和 HTTP Post 从远程服务器上请求文本、HTML、XML 或 JSON，同时能够把这些外部数据直接载入网页的被选元素中。

实现逻辑：

定义了getResult函数如下：

以Get方式向服务器来发送Ajax请求，若请求成功时，执行回调函数，当update_flag为1时，则服务器端有新数据需要发送，

将装对应的html内容的盒子填入json数据的内容即可。setInterval是设置定时器，8s会调用一次getResult函数。

如果没有新的json数据内容，则对应的html内容显示无即可，

可以看到不断地在发送get请求：

有个问题待优化：利用递归调用请求结果的函数的方式来从服务器端读取数据，请求的次数会不断增加，需要考虑服务器是否可以承载？

相关文章：

驱动轴相机参数设置Web前端界面开发

一、基于Django的Web应用界面的开发&#xff1a; 在Realtimeresults.html上添加一个按钮组件&#xff0c;获取检测到的轴型和车轮信息&#xff0c;点击后可以获取package.json里存放的json数据&#xff0c;效果如下&#xff1a; 实现逻辑&#xff1a;需要从URL设置、视图函数、…...

编程日记 2023/9/9 1:27:56

论文简读 LORA: LOW-RANK ADAPTATION OF LARGE LANGUAGE MODELS

论文地址&#xff1a;https://arxiv.org/pdf/2106.09685.pdf 项目地址&#xff1a;https://github.com/microsoft/LoRA 全文翻译地址&#xff1a;https://zhuanlan.zhihu.com/p/611557340 本来想自行翻译的&#xff0c;但最近没有空 1、关键凝练 1.1 LORA是什么&#xff1f; …...

编程日记 2023/9/9 1:26:55

23062网络编程day7

网络聊天室编写&#xff08;基于UDP&#xff09; 服务器 #include <myhead.h>#define PORT 8888 //端口号&#xff1a;接收方绑定的端口号 #define IP "192.168.114.56" //本机IP#define ERR_MSG(msg) do{\fprintf(stderr, "__%d__:&…...

编程日记 2023/9/9 1:25:52

Java面向对象学习笔记-2

前言 本文介绍了Java中类的定义和对象的创建的基本概念。我们通过示例代码演示了如何定义不同类型的类&#xff0c;包括管理员信息、顾客信息、学校信息和访客信息&#xff0c;并展示了如何创建这些类的对象以及如何访问它们的属性和方法。这些示例有助于理解面向对象编程的基…...

编程日记 2023/9/9 1:24:50

入栏需看——学习记忆

记忆方法千千种&#xff0c;本栏意在梳理其中道道来&#xff0c;旦有小得&#xff0c;肥肠幸耶。从不同角度分析学习记忆。 逻辑篇 有逻辑 用思维导图 思维导图记忆有逻辑的文本/内容 理论 巧记书本结构–思维导图 模仿 HCIE-Cloud Computing LAB备考第一步&#xff1a…...

编程日记 2023/9/9 1:23:49

[C++]杨辉三角

目录 题目 解题思路 代码实现 获取数字 打印函数 主函数 全部代码 运行结果 题目 给定一个非负整数numRows &#xff0c;生成「杨辉三角」的前numRows行。 在「杨辉三角」中&#xff0c;每个数是它左上方和右上方的数的和。 解题思路 第k列的第i个数字的值第k-1列的(…...

编程日记 2023/9/9 1:22:48

算法通关村十三关-白银：数字与数学高频问题

有很多解题技巧&#xff0c;需要持续积累 1.数组实现加法专题 如果让你用数组来表示一个数&#xff0c;如何实现加法呢&#xff1f; 理论上仍然从数组末尾向前挨着计算就行了&#xff0c;但是实现的时候会发现很多问题&#xff0c;例如需要进位该怎么办&#xff1f; 进一步拓…...

编程日记 2023/9/9 1:21:46

【Linux】线程安全-互斥同步

文章目录 线程安全问题的引入线程互斥互斥概念互斥锁互斥锁的计数器当中如何保证原子性互斥锁基础API初始化互斥锁变量函数动态初始化静态初始化 加锁函数阻塞加锁非阻塞加锁带有超时时间的加锁 解锁函数销毁互斥锁函数 线程同步线程同步的必要性条件变量条件变量的使用原理条件…...

编程日记 2023/9/9 1:20:45

1.初识爬虫

爬虫是批量模拟网络请求的程序&#xff0c;想百度谷歌这种搜索类网站本质上就是爬虫 使用爬虫的时候不应该对别人的网站有严重的影响&#xff0c;比如你爬的频率太高了&#xff0c;让人家的网站崩溃了。不应该爬取网页上显示不到的内容&#xff0c;比如有一个直播的网站&#…...

编程日记 2023/9/9 1:19:44

TLA+学习记录1——hello world

0x01 TLA是个好工具 编程人员一个好习惯是凡事都想偷懒&#xff0c;当然是指要科学地偷懒&#xff0c;而不是真的偷懒。一直想找到一种能检验写出的代码&#xff0c;做出的设计是否真的完全正确&#xff0c;而不是靠经验检视、代码Review、反复测试去检验。因为上述方法不管怎…...

编程日记 2023/9/9 1:18:43

基于QWebEngine实现无头浏览器

无头浏览器 无头浏览器&#xff08;Headless Browser&#xff09;是一种没有图形用户界面&#xff08;GUI&#xff09;的浏览器。它通过在内存中渲染页面&#xff0c;然后将结果发送回请求它的用户或程序来实现对网页的访问&#xff0c;而不会在屏幕上显示网页。这种方式使得无…...

编程日记 2023/9/9 1:17:42

编译Micropython固件For树莓派Raspberry Pi Pico

1. 前言 由于想把自己编写的py文件打包的固件中&#xff0c;所以记录下如何编译micropython固件和打包。 2. 编译 最简单的方式就是在你的树莓派上进行&#xff0c;我用的是RP Pi2 下载所需文件&#xff1a; $ cd ~/ $ mkdir pico $ cd pico $ git clone -b pico https://gi…...

编程日记 2023/9/9 1:16:40

基于googlenet网络的动物种类识别算法matlab仿真

目录 1.算法运行效果图预览 2.算法运行软件版本 3.部分核心程序 4.算法理论概述 5.算法完整程序工程 1.算法运行效果图预览 2.算法运行软件版本 matlab2022a 3.部分核心程序 ................................................................. % 获取输入层的尺寸 Inp…...

编程日记 2023/9/9 1:15:39

如何用Jmeter编写脚本压测？

随着商业业务不断扩张&#xff0c;调用adsearch服务频率越来越高&#xff0c;所以这次想做个压测&#xff0c;了解目前多少并发量可以到达adsearch服务的界值。 这次选用的jmeter压测工具&#xff0c;压测思路如图&#xff1a; 一、日志入参 日志选取的adsearch 的 getads部分…...

编程日记 2023/9/9 1:14:36

SpingMVC之拦截器使用详解

拦截器概述 SpringMVC的处理器拦截器,类似于Servlet开发中的过滤器Filter&#xff0c;用于对处理器进行预处理和后处理。 过滤器和拦截器区别 过滤器&#xff1a;依赖于servlet容器。在实现上基于函数回调&#xff0c;可以对几乎所有请求进行过滤&#xff0c;但是缺点是一个过…...

编程日记 2023/9/9 1:13:35

motionface respeak新的aigc视频与音频对口型数字人

在当今的数字化时代&#xff0c;人工智能&#xff08;AI&#xff09;正在逐渐渗透到我们生活的方方面面。其中&#xff0c;AI技术在视频制作和处理领域的应用也日益广泛。本文将探讨如何利用AI技术实现视频中人脸与音频同步对口型的方法&#xff0c;旨在进一步丰富视频制作的效…...

编程日记 2023/9/9 1:12:33

【计算机网络】 静态库与动态库

文章目录 静态库实践使用方法总结 动态库实践使用方法总结 静态库与动态库的优缺点静态库优点缺点 动态库缺点优点 库有两种&#xff1a;静态库&#xff08;.a、.lib&#xff09;和动态库&#xff08;.so、.dll&#xff09;。所谓静态、动态是指链接。静态库是将整个库文件都拷…...

编程日记 2023/9/9 1:11:32

web端调用本地摄像头麦克风+WebRTC腾讯云，实现直播功能

目录 关于直播直播流程直播视频格式封装推流和拉流 获取摄像头和麦克风权限navigator.getUserMedia()MediaDevices.getUserMedia() WebRTC腾讯云快直播 关于直播 视频直播技术大全、直播架构、技术原理和实现思路方案整理 直播流程 视频采集端&#xff1a; 1、视频采集&#…...

编程日记 2023/9/9 1:10:30

React笔记（八）Redux

一、安装和配置 React 官方并没有提供对应的状态机插件&#xff0c;因此&#xff0c;我们需要下载第三方的状态机插件 —— Redux。 1、下载Redux 在终端中定位到项目根目录&#xff0c;然后执行以下命令下载 Redux npm i redux 2、创建配置文件 在 React 中&#xff0c;…...

编程日记 2023/9/9 1:09:29

数据库 | 数据库概述、关系型数据库、非关系型数据库

目录&#xff1a; 1.数据库&#xff1a;1.1 数据库的含义1.2 数据库的特点 2.数据表3.数据库管理系统4.数据库系统5.关系型数据库 和 非关系型数据库&#xff1a;5.1 关系型数据库5.2 关系型数据库“优势”5.3 非关系型数据库 6.关系型数据库 和 非关系型数据库 的“区别” 1.数…...

编程日记 2023/9/9 1:08:27

在软件开发中正确使用MySQL日期时间类型的深度解析

在日常软件开发场景中&#xff0c;时间信息的存储是底层且核心的需求。从金融交易的精确记账时间、用户操作的行为日志&#xff0c;到供应链系统的物流节点时间戳&#xff0c;时间数据的准确性直接决定业务逻辑的可靠性。MySQL作为主流关系型数据库&#xff0c;其日期时间类型的…...

编程新知 2025/6/21 13:23:32

Linux-07 ubuntu 的 chrome 启动不了

文章目录 问题原因解决步骤一、卸载旧版chrome二、重新安装chorme三、启动不了&#xff0c;报错如下四、启动不了&#xff0c;解决如下 总结 问题原因 在应用中可以看到chrome&#xff0c;但是打不开(说明&#xff1a;原来的ubuntu系统出问题了&#xff0c;这个是备用的硬盘&a…...

编程新知 2025/6/23 7:26:01

PL0语法，分析器实现！

简介 PL/0 是一种简单的编程语言，通常用于教学编译原理。它的语法结构清晰，功能包括常量定义、变量声明、过程（子程序）定义以及基本的控制结构（如条件语句和循环语句）。 PL/0 语法规范 PL/0 是一种教学用的小型编程语言，由 Niklaus Wirth 设计，用于展示编译原理的核…...

编程新知 2025/7/4 6:07:49

Spring Boot+Neo4j知识图谱实战：3步搭建智能关系网络！

一、引言 在数据驱动的背景下&#xff0c;知识图谱凭借其高效的信息组织能力&#xff0c;正逐步成为各行业应用的关键技术。本文聚焦 Spring Boot与Neo4j图数据库的技术结合&#xff0c;探讨知识图谱开发的实现细节&#xff0c;帮助读者掌握该技术栈在实际项目中的落地方法。 …...

编程新知 2025/6/21 5:44:18

Redis数据倾斜问题解决

Redis 数据倾斜问题解析与解决方案 什么是 Redis 数据倾斜 Redis 数据倾斜指的是在 Redis 集群中&#xff0c;部分节点存储的数据量或访问量远高于其他节点&#xff0c;导致这些节点负载过高&#xff0c;影响整体性能。 数据倾斜的主要表现 部分节点内存使用率远高于其他节…...

编程新知 2025/7/4 15:57:09

鸿蒙DevEco Studio HarmonyOS 5跑酷小游戏实现指南

1. 项目概述 本跑酷小游戏基于鸿蒙HarmonyOS 5开发&#xff0c;使用DevEco Studio作为开发工具&#xff0c;采用Java语言实现&#xff0c;包含角色控制、障碍物生成和分数计算系统。 2. 项目结构 /src/main/java/com/example/runner/├── MainAbilitySlice.java // 主界…...

编程新知 2025/7/4 16:48:16

【生成模型】视频生成论文调研

工作清单 上游应用方向&#xff1a;控制、速度、时长、高动态、多主体驱动 类型工作基础模型WAN / WAN-VACE / HunyuanVideo控制条件轨迹控制ATI~镜头控制ReCamMaster~多主体驱动Phantom~音频驱动Let Them Talk: Audio-Driven Multi-Person Conversational Video Generation速…...

编程新知 2025/6/19 5:33:21

无人机侦测与反制技术的进展与应用

国家电网无人机侦测与反制技术的进展与应用 引言 随着无人机&#xff08;无人驾驶飞行器&#xff0c;UAV&#xff09;技术的快速发展&#xff0c;其在商业、娱乐和军事领域的广泛应用带来了新的安全挑战。特别是对于关键基础设施如电力系统&#xff0c;无人机的“黑飞”&…...

编程新知 2025/7/1 17:17:43

【Redis】笔记｜第8节｜大厂高并发缓存架构实战与优化

缓存架构 代码结构 代码详情 功能点&#xff1a; 多级缓存&#xff0c;先查本地缓存&#xff0c;再查Redis&#xff0c;最后才查数据库热点数据重建逻辑使用分布式锁&#xff0c;二次查询更新缓存采用读写锁提升性能采用Redis的发布订阅机制通知所有实例更新本地缓存适用读多…...

编程新知 2025/6/22 13:19:03

2025年渗透测试面试题总结-腾讯[实习]科恩实验室-安全工程师（题目+回答）

安全领域各种资源&#xff0c;学习文档&#xff0c;以及工具分享、前沿信息分享、POC、EXP分享。不定期分享各种好玩的项目及好用的工具&#xff0c;欢迎关注。 目录 腾讯[实习]科恩实验室-安全工程师 一、网络与协议 1. TCP三次握手 2. SYN扫描原理 3. HTTPS证书机制 二…...

编程新知 2025/7/4 7:42:03