谈谈检测浏览器类型
前几天被问到如何检测浏览器类型,我突然发现我对此并不了解,之前的项目中也没有使用到过,只隐约记得通过一个自带的方法即可获取。所以今天特意来仔细补习一下。
核心:navigator.userAgent
1.正则表达式
2.引用外部库
3.判断浏览器的其他特性
一.首先讲一下navigator.userAgent
navigator.userAgent
是一个包含用户代理字符串(User Agent String)的属性,这个字符串提供了关于用户浏览器、操作系统和设备的信息。用户代理字符串的生成和传递涉及浏览器和服务器之间的通信过程。
用户代理字符串包含主要内容:
-用户浏览器
-操作系统
-设备信息
接下来从构成、生成原理、传递解析和局限性几个方面来讲解一下用户代理字符串:
1.1用户代理字符串的构成
- 浏览器名称和版本:标识浏览器的名称和版本号。【这个内容导致经常用于判断浏览器类型场景上!】
- 操作系统:标识用户使用的操作系统及其版本。
- 渲染引擎:标识浏览器使用的渲染引擎。
- 设备信息:标识设备类型(比如手机、平板、桌面)。
举个例子
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.107 Safari/537.36
我们来分析一下这个例子用户代理字符串中包含了哪些信息呢
- Mozilla/5.0:兼容性标识符,表示兼容 Mozilla 的浏览器。
- (Windows NT 10.0; Win64; x64):操作系统信息,表示 Windows 10 64 位操作系统。
- AppleWebKit/537.36:渲染引擎,表示使用 WebKit 内核。
- (KHTML, like Gecko):表示兼容 Gecko 内核。
- Chrome/92.0.4515.107:浏览器名称和版本号,表示 Chrome 92。
- Safari/537.36:表示兼容 Safari 537.36。【这里注意,正则判断时,由于兼容性标识,也有可能chrome浏览器识别到safari字段】
1.2用户代理字符串的生成
- 浏览器内部生成:
-
- 浏览器在初始化时,根据其内置的信息和用户的操作系统,生成用户代理字符串。
- 这些信息通常在浏览器的配置文件中定义,浏览器开发者在开发时设定。
- 用户定制:
-
- 某些浏览器允许用户通过设置或扩展自定义用户代理字符串。用户可以修改用户代理字符串以伪装成不同的浏览器或设备。【这一点导致了他的不可靠性】
1.3用户代理字符串的传递(浏览器和服务端之间)
- HTTP 请求:
-
- 当用户访问网页时,浏览器会发送 HTTP 请求到服务器。在请求头中包含一个名为
User-Agent
的字段,携带用户代理字符串。 - 示例 HTTP 请求头:
- 当用户访问网页时,浏览器会发送 HTTP 请求到服务器。在请求头中包含一个名为
GET / HTTP/1.1
Host: example.com
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.107 Safari/537.36
- 服务器处理:
-
- 服务器接收到请求后,可以读取
User-Agent
字段,解析用户代理字符串以了解客户端的浏览器、操作系统和设备信息。 - 基于这些信息,服务器可以返回相应的内容或进行特定的处理,如返回适配移动设备的网页。
- 服务器接收到请求后,可以读取
1.4用户代理字符串的解析
知道了用户代理字符串的内容之后,我们需要把他运用到实处,那么很重要的一点就是如何对其进行解析!
- 前端解析:
-
- 在前端 JavaScript 代码中,可以通过
navigator.userAgent
获取用户代理字符串,并使用正则表达式或字符串匹配解析其中的信息。【这也是下一节要重点讲的内容之一】 - 示例代码:
- 在前端 JavaScript 代码中,可以通过
const userAgent = navigator.userAgent;
console.log(userAgent); // 输出用户代理字符串
- 后端解析:
-
- 在服务器端,可以使用编程语言(如 Python、Java、Node.js)解析用户代理字符串,进行用户设备和浏览器的识别。
- 示例代码(Node.js):
const http = require('http');http.createServer((req, res) => {const userAgent = req.headers['user-agent'];console.log(userAgent); // 输出用户代理字符串res.writeHead(200, {'Content-Type': 'text/plain'});res.end('Hello World\n');
}).listen(8080);
1.5用户代理字符串的局限性
- 不可靠性:
-
- 用户代理字符串可以被用户修改或伪装,因此基于其进行的判断不总是可靠的。
- 某些浏览器或扩展允许用户自定义用户代理字符串,导致误判。
- 复杂性和变化:
-
- 用户代理字符串格式复杂且随时间变化,不同浏览器和版本的格式可能不同。
- 解析用户代理字符串需要持续更新解析规则,以应对新浏览器和版本的变化。
- 特性检测优先:
-
- 现代 Web 开发推荐使用特性检测,而不是依赖用户代理字符串。特性检测直接检测浏览器是否支持特定功能,更加可靠。
- 示例代码(特性检测):
if ('geolocation' in navigator) {console.log('Geolocation is supported');
} else {console.log('Geolocation is not supported');
}
二.学习完用户代理字符串,回到正题,如何判断浏览器类型
- 正则表达式
- match结合正则表达式
- 第三方库(最简单便捷)
- 条件注释(老方法了,了解即可)
- 判断特性(最推荐最可靠的!)
2.1直接使用正则表达式匹配 navigator.userAgent
function getBrowserType() {const userAgent = navigator.userAgent;if (userAgent.indexOf("Firefox") > -1) {return "Firefox";} else if (userAgent.indexOf("SamsungBrowser") > -1) {return "Samsung Internet";} else if (userAgent.indexOf("Opera") > -1 || userAgent.indexOf("OPR") > -1) {return "Opera";} else if (userAgent.indexOf("Trident") > -1) {return "Internet Explorer";} else if (userAgent.indexOf("Edge") > -1) {return "Microsoft Edge";} else if (userAgent.indexOf("Chrome") > -1) {return "Chrome";} else if (userAgent.indexOf("Safari") > -1) {return "Safari";} else {return "Unknown";}
}console.log(getBrowserType());
navigator.userAgent
获取了用户代理字符串。indexOf
方法用于检查字符串中是否包含特定的子字符串。如果包含,返回子字符串在字符串中的第一个索引,否则返回 -1。- 判断不同浏览器标志来返回相应的浏览器类型。
这个方法简单直观,容易理解,是学习了用户代理字符串后最容易想到的方法之一,但是却不可靠,首先利用indexOf会存在大小写敏感问题,其次这么多的ifelse也使得维护工作做起来很困难。
2.2 match()
结合正则表达式
function getBrowserType() {const userAgent = navigator.userAgent;if (userAgent.match(/Firefox/i)) {return "Firefox";} else if (userAgent.match(/SamsungBrowser/i)) {return "Samsung Internet";} else if (userAgent.match(/Opera|OPR/i)) {return "Opera";} else if (userAgent.match(/Trident/i)) {return "Internet Explorer";} else if (userAgent.match(/Edge/i)) {return "Microsoft Edge";} else if (userAgent.match(/Chrome/i)) {return "Chrome";} else if (userAgent.match(/Safari/i)) {return "Safari";} else {return "Unknown";}
}console.log(getBrowserType());
match()
方法在字符串中执行一个搜索匹配,并返回匹配结果的数组,如果没有找到匹配,则返回null。- 正则表达式中的
i
标志表示不区分大小写。(规避了直接使用indexOf大小写敏感问题)
这个方法其实和第一种差不多,而且正则表达式提供了更强的匹配能力,处理起来更灵活,但是大部分人对于正则表达式还是做不到说写就写的,所以对于不熟悉正则表达式的开发者可能有一定的学习成本。
2.3使用第三方库(如 bowser
)
import Bowser from "bowser";function getBrowserType() {const browser = Bowser.getParser(window.navigator.userAgent);return browser.getBrowserName();
}console.log(getBrowserType());
Bowser
是一个 JavaScript 库,用于解析用户代理字符串,并提供 API 来获取浏览器和操作系统信息。Bowser.getParser(userAgent)
创建一个解析器对象。parser.getBrowserName()
返回浏览器名称。
这种方法应该是很多人会选择使用的,直接使用第三方库,减少了自行编写和维护代码的工作量,而且库本身就提供了丰富的功能和良好的兼容性。但是呢显而易见需要引入额外的第三方库,也是增加了项目的依赖。
2.4使用条件注释(了解即可)
<script>var isIE = false;/*@cc_on@if (@_jscript_version)isIE = true;@end@*/if (isIE) {console.log("Internet Explorer");} else {console.log("Not Internet Explorer");}
</script>
- 条件注释是 Internet Explorer 的一种特性,允许在 HTML 注释中包含条件代码。
@cc_on
是开启条件编译的指令。@_jscript_version
是一个 JScript 变量,表示当前 JScript 引擎的版本。
- 这种方法仅适用于 Internet Explorer,且现代浏览器不再支持条件注释。
2.5基于特性检测(最准确最推荐!)
function isIE() {return !!window.ActiveXObject || "ActiveXObject" in window;
}
function isEdge() {return !isIE() && !!window.StyleMedia;
}
if (isIE()) {console.log("Internet Explorer");
} else if (isEdge()) {console.log("Microsoft Edge");
} else {console.log("Not Internet Explorer or Edge");
}
- 基于特性检测是通过检测特定浏览器的特性来判断浏览器类型,而不是依赖于
userAgent
。 window.ActiveXObject
和"ActiveXObject" in window
用于检测 Internet Explorer。window.StyleMedia
用于检测 Microsoft Edge。
这个方更加可靠,不依赖userAgent
,避免了用户代理字符串可能被篡改的问题。(规避了不可靠性),但是缺点也很明显,需要知道每种浏览器特有的特性,增加了复杂性。
三、应用场景
对于我个人的项目经历来说,之前是几乎没有用到过浏览器类型判断的,所以,我还去了解了一下需要用到浏览器类型判断的一些应用场景。
3.1 浏览器特性检测和兼容性处理
最容易想到的第一个应用场景,就是对兼容性的处理。某些浏览器对特定的功能或 API 支持不一致。需要通过检测用户代理字符串,可以针对特定浏览器执行不同的代码,来确保功能的兼容性。
const userAgent = navigator.userAgent;if (userAgent.match(/Trident/i)) {// 针对 Internet Explorer 的特定处理
} else if (userAgent.match(/Edge/i)) {// 针对 Microsoft Edge 的特定处理
} else if (userAgent.match(/Chrome/i)) {// 针对 Chrome 的特定处理
} else if (userAgent.match(/Safari/i)) {// 针对 Safari 的特定处理
}
3.2 响应式设计和设备检测
第二个我想到的就是响应式,因为之前经常在项目中使用媒体查询去实现响应式涉及,我们知道很多页面在移动设备和桌面设备之间是不同的布局和功能。所以我们通常需要通过检测用户代理字符串,确定用户是否在使用移动设备,从而去调整页面布局和交互方式。
const userAgent = navigator.userAgent;if (/Mobi|Android/i.test(userAgent)) {// 针对移动设备的布局和交互处理
} else {// 针对桌面设备的布局和交互处理
}
3.3 分析和统计
对于一些数据埋点,有时候可能还需要考虑到触发时所在的环境,在网站分析和统计中,收集用户代理字符串信息可以帮助开发者了解用户的浏览器和设备使用情况,这个对于开发者是很有好处的。可以作为性能优化的量化依据。
// 将用户代理字符串发送到分析服务器
sendUserAgentToAnalytics(navigator.userAgent);function sendUserAgentToAnalytics(userAgent) {// 发送数据到服务器的代码
}
还有一些收集来的运用场景,自己想可能不太会想的到,不过看完之后就会觉得确实了:
3.4. 功能降级
某些情况有些特定功能可能不能再在某些浏览器使用。也可以通过检测用户代理字符串,·去选择替代方案。
再说直白点就比如很多用户使用很老的版本的设备或者未更新系统之类的,这里就可以运用到。
const userAgent = navigator.userAgent;if (userAgent.match(/MSIE|Trident/i)) {// 提供替代方案或警告用户使用现代浏览器alert("Your browser is not supported. Please upgrade to a modern browser.");
}
5. 动态加载资源
涉及到资源加载优化了,很多时候不同设备下的静态资源是截然不同的,可以根据用户的浏览器和设备类型,动态加载不同的资源(如 CSS、JavaScript 文件),以优化性能和用户体验。
<script>const userAgent = navigator.userAgent;if (/Mobi|Android/i.test(userAgent)) {// 加载移动设备的样式表document.write('<link rel="stylesheet" href="mobile.css">');} else {// 加载桌面设备的样式表document.write('<link rel="stylesheet" href="desktop.css">');}
</script>
6. 调试和日志记录
在调试和日志记录中,记录用户代理字符串可以帮助开发者了解用户的浏览器环境,从而更快地定位和解决问题。
console.log("User Agent: " + navigator.userAgent);// 将用户代理字符串记录到日志服务器
logUserAgent(navigator.userAgent);function logUserAgent(userAgent) {// 记录数据到服务器的代码
}
完。
相关文章:
![](https://www.ngui.cc/images/no-images.jpg)
谈谈检测浏览器类型
前几天被问到如何检测浏览器类型,我突然发现我对此并不了解,之前的项目中也没有使用到过,只隐约记得通过一个自带的方法即可获取。所以今天特意来仔细补习一下。 核心:navigator.userAgent 1.正则表达式 2.引用外部库 3.判断浏…...
![](https://www.ngui.cc/images/no-images.jpg)
Django 和 Django REST framework 创建对外 API
1. 环境准备 确保你已经安装了 Python 和 Django。如果尚未安装 Django REST framework,通过 pip 安装它: pip install djangorestframework 2. 创建 Django 项目 如果你还没有 Django 项目,可以通过以下命令创建: django-ad…...
![](https://img-blog.csdnimg.cn/direct/3f2772dc998d4a9f9b1d375420530fc1.png)
数据结构之“刷链表题”
🌹个人主页🌹:喜欢草莓熊的bear 🌹专栏🌹:数据结构 目录 前言 一、相交链表 题目链接 大致思路 代码实现 二、环形链表1 题目链接 大致思路 代码实现 三、环形链表2 题目链接 大致思路 代码实…...
复分析——第9章——椭圆函数导论(E.M. Stein R. Shakarchi)
第 9 章 椭圆函数导论 (An Introduction to Elliptic Functions) The form that Jacobi had given to the theory of elliptic functions was far from perfection; its flaws are obvious. At the base we find three fundamental functions sn, cn and dn. These functio…...
![](https://www.ngui.cc/images/no-images.jpg)
使用kubeadm安装k8s并部署应用
安装k8s 1. 准备机器 准备三台机器 192.168.136.104 master节点 192.168.136.105 worker节点 192.168.136.106 worker节点2. 安装前配置 1.基础环境 ######################################################################### #关闭防火墙: 如果是云服务器&…...
![](https://img-blog.csdnimg.cn/direct/8382e23217f44e8bb1f7138e215b8c73.png)
springMVC学习
概述 Spring MVC(Model-View-Controller,模型-视图-控制器)是Spring框架的一部分,用于构建基于Java的Web应用程序。它遵循MVC设计模式,分离了应用程序的不同方面(输入逻辑、业务逻辑和UI逻辑)&…...
![](https://www.ngui.cc/images/no-images.jpg)
深入探讨光刻技术:半导体制造的关键工艺
前言 光刻(Photolithography)是现代半导体制造过程中不可或缺的一环,它的精度和能力直接决定了芯片的性能和密度。本文将详细介绍光刻技术的基本原理、过程、关键技术及其在半导体制造中的重要性。 光刻技术的基本原理 光刻是一种利用光化…...
![](https://img-blog.csdnimg.cn/direct/4a230f12e3d24b198da8c165a8e13ce0.png)
CesiumJS【Basic】- #042 绘制纹理线(Primitive方式)
文章目录 绘制纹理线(Primitive方式)1 目标2 代码2.1 main.ts3 资源文件绘制纹理线(Primitive方式) 1 目标 使用Primitive方式绘制纹理线 2 代码 2.1 main.ts var start = Cesium.Cartesian3.fromDegrees(-75.59777, 40.03883);var...
![](https://img-blog.csdnimg.cn/direct/4c6107273b0e4f1fb74a39b6851f36f7.png)
代码随想录第38天|动态规划
1049. 最后一块石头的重量 II 参考 备注: 当物体容量也等同于价值时, 01背包问题的含义则是利用好最大的背包容量sum/2, 使得结果尽可能的接近或者小于 sum/2 等价: 尽可能的平分成相同的两堆, 其差则为结果, 比如 (abc)-d, (ac)-(bd) , 最终的结果是一堆减去另外一堆的和, 问…...
![](https://img-blog.csdnimg.cn/direct/9b12c404db9941d892ab77e3467a6d7d.png)
java生成excel,uniapp微信小程序接收excel并打开
java引包,引的是apache.poi <dependency><groupId>org.apache.poi</groupId><artifactId>poi-ooxml</artifactId><version>5.2.3</version></dependency> 写一个测试类,把excel输出到指定路径 public s…...
![](https://www.ngui.cc/images/no-images.jpg)
sam_out 目标检测的应用
缺点参考地址训练验证模型解析 缺点 词表太大量化才可 参考地址 https://aistudio.baidu.com/projectdetail/8103098 训练验证 import os from glob import glob import cv2 import paddle import faiss from out_yolo_model import GPT as GPT13 import pandas as pd imp…...
![](https://img-blog.csdnimg.cn/img_convert/8d9f6025aabd64ce951c6f72ae7b5336.png)
VLAN原理与配置
AUTHOR :闫小雨 DATE:2024-04-28 目录 VLAN的三种端口类型 VLAN原理 什么是VLAN 为什么使用VLAN VLAN的基本原理 VLAN标签 VLAN标签各字段含义如下: VLAN的划分方式 VLAN的划分包括如下5种方法: VLAN的接口链路类型 创建V…...
![](https://www.ngui.cc/images/no-images.jpg)
使用Spring Boot实现RESTful API
使用Spring Boot实现RESTful API 大家好,我是免费搭建查券返利机器人省钱赚佣金就用微赚淘客系统3.0的小编,也是冬天不穿秋裤,天冷也要风度的程序猿!今天我们将深入探讨如何利用Spring Boot框架实现RESTful API,这是现…...
![](https://www.ngui.cc/images/no-images.jpg)
中英双语介绍美国常春藤联盟( Ivy League):八所高校
中文版 常春藤联盟简介 常春藤联盟(Ivy League)是美国东北部八所私立大学组成的高校联盟。虽然最初是因体育联盟而得名,但这些学校以其学术卓越、历史悠久、校友杰出而闻名于世。以下是对常春藤联盟的详细介绍,包括其由来、成员…...
![](https://www.ngui.cc/images/no-images.jpg)
【计算机网络】常见的网络通信协议
目录 1. TCP/IP协议 2. HTTP协议 3. FTP协议 4. SMTP协议 5. POP3协议 6. IMAP协议 7. DNS协议 8. DHCP协议 9. SSH协议 10. SSL/TLS协议 11. SNMP协议 12. NTP协议 13. VoIP协议 14. WebSocket协议 15. BGP协议 16. OSPF协议 17. RIP协议 18. ICMP协议 1…...
![](https://www.ngui.cc/images/no-images.jpg)
java实现http/https请求
在Java中,有多种方式可以实现HTTP或HTTPS请求。以下是使用第三方库Apache HttpClient来实现HTTP/HTTPS请求的工具类。 优势和特点 URIBuilder的优势在于它提供了一种简单而灵活的方式来构造URI,帮助开发人员避免手动拼接URI字符串,并处理参…...
![](https://www.ngui.cc/images/no-images.jpg)
NC204871 求和
链接 思路: 对于一个子树来说,子树的节点就包括在整颗树的dfs序中子树根节点出现的前后之间,所以我们先进行一次dfs,用b数组的0表示区间左端点,1表示区间右端点,同时用a数组来标记dfs序中的值。处理完dfs序…...
![](https://www.ngui.cc/images/no-images.jpg)
git克隆代码warning: could not find UI helper ‘git-credential-manager-ui‘
git克隆代码warning: could not find UI helper ‘git-credential-manager-ui’ 方案 git config --global --unset credential.helpergit-credential-manager configure...
![](https://www.ngui.cc/images/no-images.jpg)
Generator 是怎么样使用的以及各个阶段的变化如何
Generators 是 JavaScript 中一种特殊类型的函数,可以在执行过程中暂停,并且在需要时恢复执行。它们是通过 function* 关键字来定义的。Generator 函数返回的是一个迭代器对象,通过调用该迭代器对象的 next() 方法来控制函数的执行。在调用 n…...
![](https://www.ngui.cc/images/no-images.jpg)
一文了解Java中 Vector、ArrayList、LinkedList 之间的区别
目录 1. 数据结构 Vector 和 ArrayList LinkedList 2. 线程安全 Vector ArrayList 和 LinkedList 3. 性能 插入和删除操作 随机访问 4. 内存使用 ArrayList 和 Vector LinkedList 5. 迭代器行为 ArrayList 和 Vector LinkedList 6. 扩展策略 ArrayList Vecto…...
![](https://img-blog.csdnimg.cn/direct/39ac5a84d9f04ae39075c9ab5c6accce.png)
【论文复现|智能算法改进】基于自适应动态鲸鱼优化算法的路径规划研究
目录 1.算法原理2.改进点3.结果展示4.参考文献5.代码获取 1.算法原理 SCI二区|鲸鱼优化算法(WOA)原理及实现【附完整Matlab代码】 2.改进点 非线性收敛因子 WOA 主要通过控制系数向量 A 来决定鲸鱼是搜索猎物还是捕获猎物,即系数向量 A 可…...
![](https://www.ngui.cc/images/no-images.jpg)
【Win测试】窗口捕获的学习笔记
2 辨析笔记 2.1 mss:捕获屏幕可见区域,不适合捕获后台应用 Claude-3.5-Sonnet: MSS库可以用来捕获屏幕上可见的内容;然而,如果游戏窗口被其他窗口完全遮挡或最小化,MSS将无法捕获到被遮挡的游戏窗口内容,而…...
![](https://img-blog.csdnimg.cn/direct/dc5a0b28ea31428e95e7934db4a0238b.png)
PostgreSQL的学习心得和知识总结(一百四十七)|深入理解PostgreSQL数据库之transaction chain的使用和实现
目录结构 注:提前言明 本文借鉴了以下博主、书籍或网站的内容,其列表如下: 1、参考书籍:《PostgreSQL数据库内核分析》 2、参考书籍:《数据库事务处理的艺术:事务管理与并发控制》 3、PostgreSQL数据库仓库…...
![](https://img-blog.csdnimg.cn/direct/0aa0a27cf5534b95971900d12648a59a.png)
宝塔linux网站迁移步骤
网站迁移到新服务器步骤 1.宝塔网站迁移,有个一键迁移工具,参考官网 宝塔一键迁移API版本 3.0版本教程 - Linux面板 - 宝塔面板论坛 (bt.cn)2 2.修改域名解析为新ip 3.如果网站没有域名,而是用ip访问的,则新宝塔数据库的wp_o…...
![](https://www.ngui.cc/images/no-images.jpg)
电路笔记(三极管器件): MOSFETIGBT
MOSFET vs IGBT MOSFET主要用于低电压和功率系统,而IGBT更适合高电压和功率系统。 1. MOSFET(金属氧化物半导体场效应晶体管) 优势: 高开关速度和响应速度,适合高频应用。(IGBT不适合高频应用,…...
![](https://img-blog.csdnimg.cn/direct/29a51e0b9edb463a9a2612fbe7adfe46.png)
Docker 镜像导出和导入
docker 镜像导出 # 导出 docker 镜像到本地文件 docker save -o [输出文件名.tar] [镜像名称[:标签]] # 示例 docker save -o minio.tar minio/minio:latest-o 或 --output:指定导出文件的路径和名称[镜像名称[:标签]]:导出镜像名称以及可选的标签 dock…...
![](https://img-blog.csdnimg.cn/direct/2a2e8ce6bb5740aebde9cbc08ac221b0.png)
QueryClientProvider is not defined
QueryClientProvider is not defined 运行一个svelte的项目,报错如上,前后查找解决不了,然后没办法, 本来是用yarn 安装的依赖,改用npm install,再次运行就成功了...
![](https://img-blog.csdnimg.cn/direct/1d6b10a76ff14f0db9fe4eac36b13acc.png)
HTTPS是什么?原理是什么?用公钥加密为什么不能用公钥解密?
HTTPS(HyperText Transfer Protocol Secure)是HTTP的安全版本,它通过在HTTP协议之上加入SSL/TLS协议来实现数据加密传输,确保数据在客户端和服务器之间的传输过程中不会被窃取或篡改。 HTTPS 的工作原理 客户端发起HTTPS请求&…...
![](https://www.ngui.cc/images/no-images.jpg)
系统中非功能性需求的思考
概要 设计系统时不仅要考虑功能性需求,还要考虑一些非功能性需求,比如: 扩展性可靠性和冗余安全和隐私服务依赖SLA要求 下面对这5项需要考虑的事项做个简单的说明 1. 可扩展性 数据量增长如何扩展? 流量增长如何扩展…...
![](https://www.ngui.cc/images/no-images.jpg)
力扣第215题“数组中的第K个最大元素”
在本篇文章中,我们将详细解读力扣第215题“数组中的第K个最大元素”。通过学习本篇文章,读者将掌握如何使用快速选择算法和堆排序来解决这一问题,并了解相关的复杂度分析和模拟面试问答。每种方法都将配以详细的解释,以便于理解。…...
![](https://www.ngui.cc/images/no-images.jpg)
java.util.function实现原理和Java使用场景【Function、Predicate集合转换过滤,BiConsumer事件处理】
简介 java.util.function 是 Java 8 引入的一个功能包,它包含了多种函数式接口的定义,使得在 Java 中进行函数式编程变得更为方便。下面我将分别介绍 java.util.function 的作用、实现原理、常用 Java 使用场景以及代码示例。 作用 java.util.function 的主要作用是为 Jav…...
![](https://www.ngui.cc/images/no-images.jpg)
《每天5分钟用Flask搭建一个管理系统》 第6章:数据库集成
第6章:数据库集成 6.1 数据库的选择和配置 在Flask中集成数据库,首先需要选择一个数据库系统。常见的选择包括SQLite、MySQL、PostgreSQL等。选择后,需要配置数据库连接字符串。 示例代码:配置数据库 from flask import Flask…...
![](https://www.ngui.cc/images/no-images.jpg)
pandas读取和处理Excel文件的基础应用1
Pandas如何读取Excel文件并处理数据 引言: Pandas是一种常用的数据处理和分析工具,它提供了丰富的函数和方法,方便用户对数据进行清洗、转换和分析。在实际工作中,我们经常需要处理Excel格式的数据文件,本文将介绍如何…...
![](https://www.ngui.cc/images/no-images.jpg)
electron vite react 创建一个项目
要使用 Electron、Vite 和 React 创建一个项目,你可以按照以下步骤操作: 1. 安装 Node.js 和 npm 首先,确保你的计算机上安装了 Node.js 和 npm(Node Package Manager)。你可以从 Node.js 官网 下载并安装。 2. 初始化一个新的项目 在你的工作目录下,创建一个新的文件…...
![](https://www.ngui.cc/images/no-images.jpg)
鸿蒙使用 @Builder扩展出来的布局数据更新没法更新UI
由于业务的复杂,所以我们把相关UI抽离出来。但是数据变化了,没法更新UI Builder MyGridLayout() { } 通过日志打印发现数据的确是更新了,但是UI就没没办法,如何解决呢 Entry Component struct Page35 {// State sArray: bool…...
![](https://img-blog.csdnimg.cn/direct/04ca292ff1494af1a3b4f491bc240ea2.jpeg#pic_center)
湖南省教育网络协会莅临麒麟信安调研教育网络数字化建设及教育信创发展情况
6月28日下午,湖南省教育网络协会理事长张智勇、秘书长刘志勇、副理事长黄旭、胡洪波、周中伟等协会相关负责人一行莅临麒麟信安,就湖南省教育网络数字化建设、教育信创工作等主题进行深入调研。麒麟信安副总裁王攀热情接待。 协会成员一行来到麒麟信安展…...
![](https://img-blog.csdnimg.cn/img_convert/3422d4b79d44c46e8712a1d0dcb126af.webp?x-oss-process=image/format,png)
论文阅读_优化RAG系统的检索
英文名称: The Power of Noise: Redefining Retrieval for RAG Systems 中文名称: 噪声的力量:重新定义RAG系统的检索 链接: https://arxiv.org/pdf/2401.14887.pdf 作者: Florin Cuconasu, Giovanni Trappolini, Federico Siciliano, Simone Filice, Cesare Campag…...
![](https://img-blog.csdnimg.cn/direct/51c48e03ad3142a88ac6862cd76df1a1.png)
STC8/32 软硬件I2C通讯方式扫描I2C设备地址
STC8/32 软硬件I2C通讯方式扫描I2C设备地址 📄主要用于检测挂载在I2C总线上的设备。在驱动I2C设备之前,如果能扫描到该设备,说明通讯设备可以连接的上,在提前未知I2C地址的情况下,可以方便后面的驱动代码的完善。 🔬扫描测试效果:(测试mpu6050以及ssd1306 i2c oled )…...
![](https://img-blog.csdnimg.cn/direct/a2aee408f00341f8b70988ab1d50d237.png)
Linux——数据流和重定向,制作镜像
1. 数据流 标准输入( standard input ,简称 stdin ):默认情况下,标准输入指从键盘获取的输入 标准输出( standard output ,简称 stdout ):默认情况下,命令…...
![](https://img-blog.csdnimg.cn/img_convert/4e335a5c591f08b612c288d51bfecf67.png)
Windows 11的市场份额越来越大了,推荐你升级!
7月1日,系统之家发布最新数据,显示Windows 11操作系统的市场份额正在稳步上升。自2021年10月Windows 11发布以来,Windows 10一直占据着市场主导地位,当时其市场份额高达81.44%。然而,随着时间的推移,Window…...
![](https://www.ngui.cc/images/no-images.jpg)
微服务架构中的调试难题与分布式事务解决方案
微服务架构作为现代软件开发的一种主要趋势,因其灵活性、高可维护性和易于扩展的特点,得到了广泛的应用。然而,在享受微服务架构带来的诸多优点的同时,开发者也面临着一些新的挑战。调试的复杂性和分布式事务的处理是其中两个较为…...
![](https://www.ngui.cc/images/no-images.jpg)
银行家算法-操作系统中避免死锁的最著名算法
背景 有很多文章都会介绍银行家算法。在百度和CSDN上搜一搜能搜出很多来。很多同学会觉得这个算法很深奥,有些文章写的又很复杂,其实真的很简单。这里简单记录一下基本原理,然后大家再配合其他文章看,就能加深理解。 算法原理 …...
![](https://img-blog.csdnimg.cn/direct/d53f826b843d49e5a26cfcbe86d047e6.png)
PCL 基于点云RGB颜色的区域生长算法
RGB颜色的区域生长算法 一、概述1.1 算法定义1.2 算法特点1.3 算法实现二、代码示例三、运行结果🙋 结果预览 一、概述 1.1 算法定义 点云RGB区域生长算法: 是一个基于RGB颜色信息的区域生长算法,用于点云分割。该算法利用了点云中相邻点之间的颜色相似性来将点云分割成…...
![](https://img-blog.csdnimg.cn/direct/e72e651d964449a2942c62a5838ccc66.png)
cube-studio开源一站式机器学习平台,在线ide,jupyter,vscode,matlab,rstudio,ssh远程连接,tensorboard
全栈工程师开发手册 (作者:栾鹏) 一站式云原生机器学习平台 前言 开源地址:https://github.com/tencentmusic/cube-studio cube studio 腾讯开源的国内最热门的一站式机器学习mlops/大模型训练平台,支持多租户&…...
![](https://img-blog.csdnimg.cn/direct/e42a5c66b4844ba49663039fde171a5f.png)
1976 ssm 营地管理系统开发mysql数据库web结构java编程计算机网页源码Myeclipse项目
一、源码特点 ssm 营地管理系统是一套完善的信息系统,结合springMVC框架完成本系统,对理解JSP java编程开发语言有帮助系统采用SSM框架(MVC模式开发),系统具有完整的源代码和数据库,系统主要采用B/S模式开…...
![](https://img-blog.csdnimg.cn/img_convert/32d4007e42fe1ca98923779e80944141.png)
技术派全局异常处理
前言 全局的异常处理是Java后端不可或缺的一部分,可以提高代码的健壮性和可维护性。 在我们的开发中,总是难免会碰到一些未经处理的异常,假如没有做全局异常处理,那么我们返回给用户的信息应该是不友好的,很抽象的&am…...
![](https://www.ngui.cc/images/no-images.jpg)
对于mysql 故障的定位和排查
故障表现 他的执行时间超过规定的限制(比如1000ms)CPU使用率高大量业务失败,数据连接异常执行sql越来越慢,失败越来越多 解决方案 定位 应急 故障恢复 定位 查询慢sql的日志查看mysql 的performance schena(里面…...
![](https://img-blog.csdnimg.cn/36ff13f2a7b74ff6a85325f62280482f.jpg)
什么是电航空插头插座连接器有什么作用
航空插头概述 定义与功能 航空插头,又称航空连接器,是一种专门用于航空领域的电连接器,因其最初在航空领域得到广泛应用而得名。航空插头的主要功能是实现电源或信号的连接,尤其适用于芯数较多、结构复杂的线束连接,…...
![](https://img-blog.csdnimg.cn/direct/9d7f81d9c809468a9c79641d93c17f9d.png)
数据挖掘常见算法(分类算法)
K-近邻算法(KNN) K-近邻分类法的基本思想:通过计算每个训练数据到待分类元组Zu的距离,取和待分类元组距离最近的K个训练数据,K个数据中哪个类别的训练数据占多数,则待分类元组Zu就属于哪个类别…...
![](https://img-blog.csdnimg.cn/direct/5bf1b70bf0174cafbc79ee27586362f5.png)
【深度学习】调整加/减模型用于体育运动评估
摘要 一种基于因果关系的创新模型,名为调整加/减模型,用于精准量化个人在团队运动中的贡献。该模型基于明确的因果逻辑,将个体运动员的价值定义为:在假设情景下,用一名价值为零的球员替换该球员后,预期比赛…...
![](https://img-blog.csdnimg.cn/direct/9db5ec2c2adb4813a25e22e987e6a31a.png)
p2p、分布式,区块链笔记: 通过libp2p的Kademlia网络协议实现kv-store
Kademlia 网络协议 Kademlia 是一种分布式哈希表协议和算法,用于构建去中心化的对等网络,核心思想是通过分布式的网络结构来实现高效的数据查找和存储。在这个学习项目里,Kademlia 作为 libp2p 中的 NetworkBehaviour的组成。 以下这些函数或…...
![](https://www.ngui.cc/images/no-images.jpg)
项目运维工具——Jpom
Jpom项目运维 最近发现了一个比 Jenkins 使用更简单的项目构建和部署工具,完全可以满足个人以及一些小企业的需求,分享一下。 用了Jpom之后,项目打包方便多了。(真香⚠️ 1介绍 Jpom 是一款 Java 编写的前后端分离项目,并且默认使用 H2 数据库安装此软件非常简单,但前…...
![](https://www.ngui.cc/images/no-images.jpg)
PVE更新 报错过程解决
Proxmox 报错提示 E: Failed to fetch https://enterprise.proxmox.com/debian/ceph-quincy/dists/bookworm/InRelease 401 Unauthorized E: The repository https://enterprise.proxmox.com/debian/ceph-quincy bookworm InRelease is not signed.Proxmox 报错提示 Tempor…...
![](https://www.ngui.cc/images/no-images.jpg)
Stream流学习mapping
Stream流学习mapping 一、前言1. 基本用法2. 结合 Collectors.mapping3. 自定义转换函数4.总结 一、前言 在Java的Stream API中,mapping 是一个非常有用的中间操作,它可以将流中的元素映射成其他形式。通常与 Collectors.groupingBy 或者 Collectors.ma…...
![](https://img-blog.csdnimg.cn/img_convert/3d770ec57ade505905213dc22b51dd99.webp?x-oss-process=image/format,png)
前端开发中的常见问题及解决方法
前端开发是一个充满挑战和乐趣的领域。然而,在开发过程中,开发者常常会遇到各种各样的问题。本文将介绍一些前端开发中常用或者经常遇到的问题,并提供相应的解决方法,帮助你提高开发效率和解决问题的能力。 一. 页面布局问题 问题…...
![](https://img-blog.csdnimg.cn/direct/647554003729496e81992e4baf304c5a.png)
第五届计算机、大数据与人工智能国际会议(ICCBD+AI 2024)
随着科技的飞速发展,计算机、大数据和人工智能等前沿技术已成为推动社会进步的重要力量。为了加强这一领域的学术交流与合作,促进技术创新与发展,第五届计算机、大数据与人工智能国际会议(ICCBDAI 2024)将于2024年11月…...
![](https://www.ngui.cc/images/no-images.jpg)
L3/L4产品准入和上路,9个联合体进入试点
6月4日,工业和信息化部、公安部、住房城乡建设部、交通运输部四部门联合宣布,按照《关于开展智能网联汽车准入和上路通行试点工作的通知》有关工作安排,经相关部门及专家初审和择优评审,已经确定了9个进入试点的联合体。2023年11月,上述四部门联合发布《关于开展智能网联汽…...
![](https://img-blog.csdnimg.cn/direct/aa443c6e9f404efcacb7aaab9fd313fb.png)
jpom linux发布前端 ruoyi
前置条件 辅助安装 安装jdk curl -fsSL https://jpom.top/docs/install.sh | bash -s Server jdkonly-moduledefault 一键安装maven 后端必备 curl -fsSL https://jpom.top/docs/install.sh | bash -s Server mvnonly-moduledefault 一键安装node 前端必备 curl -fsSL http…...
![](https://img-home.csdnimg.cn/images/20230724024159.png?origin_url=img%2Fimage-20240529200258389.png&pos_id=img-o4kvmu9G-1716984778837)
什么是React?
01 Why React? What is React? I think the one-line description of React on its home page (https://react.dev/) is concise and accurate: “A JavaScript library for building user interfaces.” 我认为React主页(https://react.dev/)上的一行描述既简洁又准确: …...
![](https://img-blog.csdnimg.cn/direct/ed671ccc9dd641b9962b7abe03f1d765.png)
如何恢复被盗的加密货币?
本世纪,网络犯罪的首要目标是加密货币。 这要归功于加密货币的日益普及和价值,网络犯罪分子已经认识到经济收益的潜力,并将重点转向利用这种数字资产中的漏洞。 在今天的文章中,我们将讨论加密货币恢复和被盗加密货币恢复。 我们…...
![](https://img-blog.csdnimg.cn/direct/e2c81eb0f16b44fca776448d68d29647.jpeg#pic_center)
探索Django 5: 从零开始,打造你的第一个Web应用
今天我们将一起探索 Django 5,一个备受开发者喜爱的 Python Web 框架。我们会了解 Django 5 的简介,新特性,如何安装 Django,以及用 Django 编写一个简单的 “Hello, World” 网站。最后,我会推荐一本与 Django 5 相关…...
![](https://img-blog.csdnimg.cn/direct/8a94cf6f14d44dd4a6f00d2d12624b4e.png)
2024年4月—马克思主义基本原理概论真题及答案解析(上海自考)
目录 1.选择题 2.简答题 3.论述题 1.选择题 2.简答题...