监控平台之nodejs模拟后端接口
github：可以下载进行实验
https://github.com/Mr-Shi-root/sdk-platform/tree/master
1.配置node环境，安装express cors body-parser babel/cors
- body-parser - node.js 中间件，用于处理 JSON, Raw, Text 和 URL 编码的数据。
- cookie-parser - 这就是一个解析Cookie的工具。通过req.cookies可以取到传过来的cookie，并把它们转成对象。
- multer - node.js 中间件，用于处理 enctype="multipart/form-data"（设置表单的MIME编码）的表单数据。
- CORS (Cross-Origin Resource Sharing) 是一种允许服务器控制允许跨源请求的机制。它帮助解决 Web 浏览器的同源策略问题，使得前端应用可以安全地从不同的源（例如不同的域名、协议或端口）请求资源。
2.创建server.js，写服务，并且启动
node server.js
const express = require('express');
const cors = require('cors');
const bodyParser = require('body-parser');
const app = express();// Cors配置
// const corsOptions = {
// origin: 'http://example.com', // 允许来自 http://example.com 的请求
// methods: ['GET', 'POST'], // 只允许 GET 和 POST 请求
// allowedHeaders: ['Content-Type', 'Authorization'] // 允许的请求头
// };
// app.use(cors(corsOptions));// Express 应用中的一个中间件函数，负责将请求中的各种类型数据解析为 JavaScript 对象，方便在路由处理函数中访问。
app.use(cors());
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());
app.use(bodyParser.text());// reportData接口，上报后进行请求，后续可用java数据库进行请求存储
app.post('/reportData', (req, res) => {console.log('server-reportData', req.body);res.status(200).send('success');
})app.listen(3000, () => {console.log('server start at 3000');
})
3. 写demo.html, mock一些图片，promise，js的错误，用于测试错误上报
4.引入WebEyeSDK包，初始化（init）上报接口，获取请求的上报数据
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><!-- 引入sdk包 --><script src="../../dist/webEyeSDK.js"></script><script>WebEyeSDK.init({url: 'http://127.0.0.1:3000/reportData'})</script>
</head>
<body><!-- 图片加载错误 --><img src="http://toutiao.com/x.png" alt=""><img src="http://toutiao.com/x2.png" alt=""><img src="http://toutiao.com/x3.png" alt=""><img src="http://toutiao.com/x4.png" alt=""><script>// promise抛出的errorfunction test() {return Promise.reject(Error("promise"))}function test2() {return Promise.reject(Error("async"))}test()test2()// 普通js抛出的errorthrow Error("test")</script>
</body>
</html>5.config.js中满5上报，node服务上报后，打印请求体
到此为止，整个流程的雏形已经跑通，
期间发现了一个面试知识点
Q：是怎么解决频繁上报的？
A：批量上报，巴拉巴拉（前面说过）
Q：那么最后一次数组里的数据，怎么办？
分析：这里对于真正做过监控的人来说，会回答直接忽略掉，不上报，不统计，因为上报丢失很正常，不可能一条不差，而且对于大数据量的上报来说，这些是不会影响全局的数据准确性的，如果在面试中针对这个去说解决方法，会有点本末倒置，注意！
期间遇到了很多小问题，这里简单说下，后续开发注意
（改死我了）
1.重写方法一定用call传当前作用域 eg：handler.call(this, err, vm, info);
2.注意三种上报方法的顺序，
3.了解一下window.fetch
4.还有一些语法写法上的细节，调用时机，封装的函数，检查是否遗漏
相关文章：
监控平台之nodejs模拟后端接口
github：可以下载进行实验 https://github.com/Mr-Shi-root/sdk-platform/tree/master 1.配置node环境，安装express cors body-parser babel/cors body-parser - node.js 中间件，用于处理 JSON, Raw, Text 和 URL 编码的数据。cookie-parse…...
TCP 协议详解
目录 一.定义 二.TCP 协议报文格式 三.确认应答(ACK)机制 四.捎带应答 五.连接管理机制 六.滑动窗口 七.快重传 八.拥塞控制 九.延时应答 十.面向字节流 十一.粘包问题 十二.异常情况 十三.TCP 小结 一.定义 传输控制协议（TCP，Transmissio…...
【转载】golang内存分配
Go 的分配采用了类似 tcmalloc 的结构.特点: 使用一小块一小块的连续内存页, 进行分配某个范围大小的内存需求. 比如某个连续 8KB 专门用于分配 17-24 字节,以此减少内存碎片. 线程拥有一定的 cache, 可用于无锁分配. 同时 Go 对于 GC 后回收的内存页, 并不是马上归还给操作系…...
TPM管理培训：学以致用，才是硬道理
全面生产维护（TotalProductiveMaintenance,TPM）作为一种先进的管理体系，正被越来越多的企业所采用，以期通过全员参与、全系统改善的方式，实现设备综合效率的最大化。然而，理论学习与实践应用之间往往存在鸿…...
2024年六月英语四级真题及解析PDF共9页
2024年六月英语四级真题及解析PDF共9页，真题就是最好的复习资料，希望对大家有所帮助。...
自闭症儿童语言干预
自闭症儿童的语言发展往往面临独特挑战，这不仅影响了他们的日常交流能力，也制约了其社交与认知的全面发展。因此，实施科学有效的语言干预对于促进自闭症儿童的语言能力至关重要。 语言干预应基于个性化原则，充分考虑每个孩子的兴…...
webpack基本使用（基础配置）
文章目录 概要理解 一、使用示例1.引入库2.创建config/webpack.dev.js 测试环境3.创建config/webpack.prod.js 正式环境3.创建eslintrc.js4.创建babel.config.js5.package.json5.main.js 总结 概要理解 vue或者react 通常用webpack作为打包工具，打包成浏览器识别的…...
在js渲染的dom中的事件中传递对象
在某些情况下，可能需要将整个对象或部分对象嵌入到 HTML 元素的属性中，可以将对象数据序列化为 JSON 字符串，存储在 data-* 自定义属性中。这样可以在事件中取出并解析对象数据： <!DOCTYPE html> <html lang"en&qu…...
服务器加速器如何应对大规模并行计算需求
服务器加速器，如GPU(图形处理单元)、FPGA(现场可编程门阵列)和TPU(张量处理单元)，在大规模并行计算需求中发挥着重要作用。它们通过提供高效的并行处理能力，大幅提升了计算性能，满足了许多领域对大规模并行计算的需求。下面详细介…...
C++/Qt 多媒体（续四）
一、前言 前边讲述到了Qt的两项独特的模块编程支持的另一项内容——多媒体编程，上篇文章具体讲述的包括采集和播放原始音频相关类的概述，而本章开始主要概述多媒体编程实现的功能中的最后两项：播放视频文件和通过摄像头拍照和录像。 对于上篇内容的示例全部代码，可…...
怎样把flv转换成mp4格式？8种可以推荐的视频转换方法
怎样把flv转换成mp4格式？MP4格式因其广泛的兼容性，几乎可以在所有设备和媒体播放器上顺畅播放，这极大地方便了用户的观看体验。与flv文件相比，MP4通常能更有效地压缩视频文件，既能保持较高的画质，又能显著减…...
【2024数学建模国赛赛题解析已出】原创免费分享
2024数模国赛赛题已正式发布 数模加油站初步分析评估了此次竞赛题目： A题：偏数学仿真建模，难度偏难，适合数学专业背景的同学 B题：评价决策类，自由度大，容易水，适合基础不太好的同…...
Windows安装使用Docker
配置Dorker环境 启用或关闭windows功能 安装wsl 以管理员身份打开windows PowerShell，安装相关配置 下载docker应用程序 Releases tech-shrimp/docker_installer (github.com) 安装Docker 指定安装位置 默认双击程序就开始安装了，要安装在指定位置…...
【wsl2】从C盘迁移到G盘
参考大神 C盘的ubuntu22.04 非常大，高达30g 迁移后就只有几百M了： 右键有一个move没有敢尝试 迁移过程 Windows PowerShell Copyright (C) Microsoft Corporation. All rights reserved.Install the latest PowerShell for new features and improveme…...
低代码技术新趋势——逆向工程
低代码的下一个趋势，应该是“逆向工程”，用户可以通过 可视化界面，逆向输出全栈工程代码。而标准的工程代码同样可以编译为支持可视化分析、编辑、调整的“无代码”程序。前一个是解释性语言向编译性语言的逆向工程。后者则是一个理论实践应用…...
HTTP 二、进阶
四、安全 1、TLS是什么 （1）为什么要有HTTPS 简单的回答是“因为 HTTP 不安全”。由于 HTTP 天生“明文”的特点，整个传输过程完全透明，任何人都能够在链路中截获、修改或者伪造请求 / 响应报文，数据不具有可…...
【Hot100】LeetCode—35. 搜索插入位置
目录 1- 思路二分 2- 实现⭐35. 搜索插入位置——题解思路 3- ACM 实现 题目连接：35. 搜索插入位置 1- 思路 二分 二分左区间的三种情况。由于目标值不一定在数组中，因此二分的过程中有三种情况判断 2- 实现 ⭐35. 搜索插入位置——题解思路 class So…...
001集——CAD—C#二次开发入门——开发环境基本设置
CAD C#二次开发首先需要搭建一个舒服的开发环境，软件安装后，需要修改相关设置。本文为保姆级入门搭建开发环境教程，默认已成功安装vs和cad 。 第一步：创建类库 第二步：进行相关设置，如图： 下一…...
Java类和对象——快速自动生成带参数的结构
1.鼠标点击右键或者（使用快捷按键：AltInsert） 2.选着generate 3.选择想要执行的指令 其中Constructor---构造方法（声明了private属性然后直接使用即可），生成带参数的结构 1：不带参数的结构&…...
Python操作数据库的ORM框架SQLAlchemy快速入门教程
连接内存版SQLIte from sqlalchemy import create_engineengine create_engine(sqlite:///:memory:) print(engine)连接文件版SQLite from sqlalchemy import create_engineengine create_engine(sqlite:///sqlite3.db) print(engine)连接MySQL数据库 from sqlalchemy imp…...
【Linux】shell脚本忽略错误继续执行
在 shell 脚本中，可以使用 set -e 命令来设置脚本在遇到错误时退出执行。如果你希望脚本忽略错误并继续执行，可以在脚本开头添加 set e 命令来取消该设置。 举例1 #!/bin/bash# 取消 set -e 的设置 set e# 执行命令，并忽略错误 rm somefile…...
FFmpeg 低延迟同屏方案
引言 在实时互动需求激增的当下，无论是在线教育中的师生同屏演示、远程办公的屏幕共享协作，还是游戏直播的画面实时传输，低延迟同屏已成为保障用户体验的核心指标。FFmpeg 作为一款功能强大的多媒体框架，凭借其灵活的编解码、数据…...
Leetcode 3577. Count the Number of Computer Unlocking Permutations
Leetcode 3577. Count the Number of Computer Unlocking Permutations 1. 解题思路2. 代码实现 题目链接：3577. Count the Number of Computer Unlocking Permutations 1. 解题思路 这一题其实就是一个脑筋急转弯，要想要能够将所有的电脑解锁&#x…...
从零开始打造 OpenSTLinux 6.6 Yocto 系统（基于STM32CubeMX）（九）
设备树移植 和uboot设备树修改的内容同步到kernel将设备树stm32mp157d-stm32mp157daa1-mx.dts复制到内核源码目录下 源码修改及编译 修改arch/arm/boot/dts/st/Makefile，新增设备树编译 stm32mp157f-ev1-m4-examples.dtb \stm32mp157d-stm32mp157daa1-mx.dtb修改…...
vue3 定时器-定义全局方法 vue+ts
1.创建ts文件 路径：src/utils/timer.ts 完整代码： import { onUnmounted } from vuetype TimerCallback (...args: any[]) > voidexport function useGlobalTimer() {const timers: Map<number, NodeJS.Timeout> new Map()// 创建定时器con…...
MacOS下Homebrew国内镜像加速指南（2025最新国内镜像加速）
macos brew国内镜像加速方法 brew install 加速formula.jws.json下载慢加速 🍺 最新版brew安装慢到怀疑人生？别怕，教你轻松起飞！ 最近Homebrew更新至最新版，每次执行 brew 命令时都会自动从官方地址 https://formulae.…...
Mac flutter环境搭建
一、下载flutter sdk 制作 Android 应用 | Flutter 中文文档 - Flutter 中文开发者网站 - Flutter 1、查看mac电脑处理器选择sdk 2、解压 unzip ~/Downloads/flutter_macos_arm64_3.32.2-stable.zip \ -d ~/development/ 3、添加环境变量 命令行打开配置环境变量文件 ope…...
2025年全国I卷数学压轴题解答
第19题第3问: b b b 使得存在 t t t, 对于任意的 x x x, 5 cos x − cos ( 5 x t ) < b 5\cos x-\cos(5xt)<b 5cosx−cos(5xt)<b, 求 b b b 的最小值. 解: b b b 的最小值 b m i n min t max x g ( x , t ) b_{min}\min_{t} \max_{x} g(x,t) bmi…...
Spring Boot 中实现 HTTPS 加密通信及常见问题排查指南
Spring Boot 中实现 HTTPS 加密通信及常见问题排查指南 在金融行业安全审计中，未启用HTTPS的Web应用被列为高危漏洞。通过正确配置HTTPS，可将中间人攻击风险降低98%——本文将全面解析Spring Boot中HTTPS的实现方案与实战避坑指南。 一、HTTPS 核心原理与…...
【免杀】C2免杀技术（十五）shellcode混淆uuid/ipv6/mac
针对 shellcode 混淆（Shellcode Obfuscation） 的实战手段还有很多，如下表所示： 类型举例目的编码 / 加密XOR、AES、RC4、Base64、Poly1305、UUID、IP/MAC改变字节特征，避开静态签名或 YARA结构伪装PE Stub、GIF/PNG 嵌入、RTF OLE、UUID、IP/MAC看起来像合法文件/数据，弱…...