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

js获取浏览器指纹

Canvas指纹法

来源:https://www.cnblogs.com/leijing0607/p/8044218.html

从根本上来说,每一种浏览器都会使用不同的图像处理引擎,不同的导出选项,不同的压缩等级,所以每一台电脑绘制出的图形都会有些许不同,这些图案可以被用来给用户设备分配特定编号(指纹),也就是说可以用来识别不同用户。

function bin2hex(s) {var i, l, o = '',n;s += '';for (i = 0, l = s.length; i < l; i++) {n = s.charCodeAt(i).toString(16);o += n.length < 2 ? '0' + n : n;}return o;
}function getUUID(domain) {var canvas = document.createElement('canvas');var ctx = canvas.getContext("2d");var txt = domain;ctx.textBaseline = "top";ctx.font = "14px 'Arial'";ctx.textBaseline = "tencent";ctx.fillStyle = "#f60";ctx.fillRect(125,1,62,20);ctx.fillStyle = "#069";ctx.fillText(txt, 2, 15);ctx.fillStyle = "rgba(102, 204, 0, 0.7)";ctx.fillText(txt, 4, 17);var b64 = canvas.toDataURL().replace("data:image/png;base64,","");var bin = atob(b64);var crc = bin2hex(bin.slice(-16,-12));return crc;
}console.log(getUUID("https://www.baidu.com/"));

测试结果表明,同一浏览器访问该域时生成的CRC校验码总是不变。可以简单理解为同样的HTML Canvas元素绘制操作,在不同的操作系统不同的浏览器上,产生的图片内容其实是不完全相同的。出现这种情况可能是有几个原因:

  • 在图片格式上,不同web浏览器使用了不同的图形处理引擎、不同的图片导出选项、不同的默认压缩级别等。
  • 在像素级别来看,操作系统各自使用了不同的设置和算法来进行抗锯齿和子像素渲染操作。
  • 即使是相同的绘图操作,最终产生的图片数据在hash层面上依然是不同的。

笔者测试数据如下:

  • PC:Chrome浏览器、Edge浏览器、遨游浏览器; Chrome浏览器和遨游浏览器结果一样
  • 安卓移动端:Chrome浏览器
  • iOS端:Safari浏览器、微信; Safari浏览器和微信结果一样

笔者测试结论:还是会出现结果一样的情况,而且最终生成的uuid位数较短也增加了出现相同的几率。该方法不可取!!!

成熟框架 fingerprintjs

fingerprintjs,笔者是在这个网站知晓的:https://q.shanyue.tech/fe/js/28,里面有很大大厂前端面试的问题,可以深入学习用。

官方给的示例:

<script>// Initialize the agent at application startup.// If you're using an ad blocker or Brave/Firefox, this import will not work.// Please use the NPM package instead: https://t.ly/ORyXkconst fpPromise = import('https://openfpcdn.io/fingerprintjs/v4').then(FingerprintJS => FingerprintJS.load())// Get the visitor identifier when you need it.fpPromise.then(fp => fp.get()).then(result => {// This is the visitor identifier:const visitorId = result.visitorIdconsole.log(visitorId)})
</script>

虽然注释写的是在Firefox中有可能不工作,但是笔者测试PC上Firefox正常工作。

在其API文档中有提供其它方式的植入示例,比如浏览器<script>标签TS的方式。

相关文章:

js获取浏览器指纹

Canvas指纹法 来源&#xff1a;https://www.cnblogs.com/leijing0607/p/8044218.html 从根本上来说&#xff0c;每一种浏览器都会使用不同的图像处理引擎&#xff0c;不同的导出选项&#xff0c;不同的压缩等级&#xff0c;所以每一台电脑绘制出的图形都会有些许不同&#xf…...

乐尚代驾的项目问题

订单状态如果在流转的过程中卡住了&#xff0c;怎么办&#xff1f; 卡住的原因有可能是&#xff1a; 网络问题 网络不稳定或中断可能导致订单状态更新的请求无法及时发送或接收。例如&#xff0c;司机端在更新代驾车辆信息时&#xff0c;如果网络出现故障&#xff0c;可能无法…...

uniapp app.onshow 和 onMounted一样用吗

在uni-app中&#xff0c;onShow和onMounted并不完全相同&#xff0c;它们分别属于应用生命周期和组件生命周期。‌ 应用生命周期中的onShow 在uni-app中&#xff0c;onShow是应用生命周期的一部分&#xff0c;它会在应用启动或从后台进入前台时触发。这意味着它不仅仅局限于页…...

基于Mysql、JavaScript、PHP、ajax开发的MBTI性格测试网站(前端+后端)

源码地址&#xff1a;https://download.csdn.net/download/2302_79553009/89933699 项目简介 本项目旨在构建一个基于MBTI&#xff08;迈尔斯-布里格斯性格分类指标&#xff09;理论的在线平台——“16Personalities”。该平台利用PHP、MySQL、JavaScript等技术栈开发&#xf…...

【问题解决】连接mysql时报错caching_sha2_password can not load

一&#xff0c; 问题 在连接Mysql时报错&#xff0c; caching_sha2_password can not load 二&#xff0c;问题原因 报错信息 "caching_sha2_password can not load" 通常出现在尝试连接到使用 MySQL 8.0 或更高版本的数据库时&#xff0c;因为从 MySQL 8.0 开始&a…...

【瑞吉外卖】-day01

目录 前言 第一天项目启动 获取资料 创建项目 ​编辑 连接本地数据库 连接数据库 修改用户名和密码 ​编辑创建表 创建启动类来进行测试 导入前端页面 创建项目所需目录 检查登录功能 登录界面 登录成功 登录失败 代码 退出功能 易错点 前言 尝试一下企业级项…...

钉钉与金蝶云星空数据集成:提高企业付款申请单处理效率

钉钉数据集成到金蝶云星空&#xff1a;付款申请单的自动下推生成 在企业日常运营中&#xff0c;如何高效地管理和处理付款申请单是一个关键问题。为了提升这一流程的效率&#xff0c;我们采用了轻易云数据集成平台&#xff0c;将钉钉中的付款申请单数据无缝对接到金蝶云星空系…...

GIT使用list

清空当前commit区 方法 1&#xff1a;软重置到初始状态 如果希望保留文件内容&#xff0c;但清空所有 commit 历史&#xff0c;可以使用以下命令&#xff1a; git reset --soft $(git rev-list --max-parents0 HEAD)解释&#xff1a; --soft 表示重置 commit 历史&#xff…...

JavaSE:数组深入学习与复习

学习参考 1、可变参数传递 数组可以是int等基本数据类型&#xff0c;也可以是String等引用类型 package com.test;public class Main {public static void main(String [] args){int [] a {1,2,3,4,5};test(78,90,12,34,56,78,90,12,34,56,78);}public static void test(i…...

Redis 事务 总结

前言 相关系列 《Redis & 目录》&#xff08;持续更新&#xff09;《Redis & 事务 & 源码》&#xff08;学习过程/多有漏误/仅作参考/不再更新&#xff09;《Redis & 事务 & 总结》&#xff08;学习总结/最新最准/持续更新&#xff09;《Redis & 事务…...

go sdk的安装或者升级

背景 由于 go 语言的官方sdk还在不断的更新迭代中&#xff0c;有的时候相对应的生态相关的依赖包也在不断的升级&#xff0c;如果很长一段时间不升级自己的本地的go sdk 那么就有可能在拉取代码的时候出现错误&#xff0c;因此有的时候可能需要我们适当的升级下自己的sdk&…...

mongo实操笔记

这个链接我用了其在Windows下的下载安装 是可以的 &#xff0c;不过我太懒了&#xff0c;没有弄成自启动 Windows安装MongoDB_mongodb windows安装-CSDN博客 下面这个链接就更好了&#xff0c;我用了其与springboot整合的测试。可以直接操作mongodb了。 SpringBoot整合Mongo…...

前端算法:树(力扣144、94、145、100、104题)

目录 一、树&#xff08;Tree&#xff09; 1.介绍 2.特点 3.基本术语 4.种类 二、树之操作 1.遍历 前序遍历&#xff08;Pre-order Traversal&#xff09;&#xff1a;访问根节点 -> 遍历左子树 -> 遍历右子树。 中序遍历&#xff08;In-order Traversal&#xf…...

深度学习速通系列:如何使用bert进行超长中文文本命名实体识别

要将超长中文文本按最大 BERT 输入长度进行分割&#xff0c;并使用 bert-chinese-ner 模型进行命名实体识别&#xff0c;可以遵循以下步骤。以下是一个 Python 代码示例&#xff0c;利用 Hugging Face 的 transformers 库来实现&#xff1a; 安装必要的库 如果你还没有安装 Hu…...

【感知模块】深度神经网络实现运动预测

系列文章目录 提示:这里可以添加系列文章的所有文章的目录,目录需要自己手动添加 TODO:写完再整理 文章目录 系列文章目录前言运动预测(Motion Prediction)感知中的运动预测(深度神经网络)前言 认知有限,望大家多多包涵,有什么问题也希望能够与大家多交流,共同成长! …...

智能优化算法-蝗虫优化算法(GOA)(附源码)

目录 1.内容介绍 2.部分代码 3.实验结果 4.内容获取 1.内容介绍 蝗虫优化算法 (Grasshopper Optimization Algorithm, GOA) 是一种基于群体智能的元启发式优化算法&#xff0c;由Saremi等人于2017年提出。GOA模拟了蝗虫群的觅食、迁徙和社会互动行为&#xff0c;用于解决复杂…...

TVM前端研究--Relay

文章目录 深度学习IR梳理1. IR属性2. DL前端发展3. DL编译器4. DL编程语言Relay的主要内容一、Expression in Relay1. Dataflow and Control Fragments2. 变量3. 函数3.1 闭包3.2 多态和类型关系3.3. Call4. 算子5. ADT Constructors6. Moudle和Global Function7. 常量和元组8.…...

STM32外设应用

STM32是基于ARM Cortex-M系列内核的微控制器&#xff0c;具有高性能、低功耗和丰富的外设资源。其广泛应用于物联网、工业控制、智能家居和嵌入式系统等领域。本文将简要介绍STM32常用外设的功能及应用实例&#xff0c;帮助大家更好地理解和使用STM32外设。 1. GPIO&#xff0…...

Docker 部署 Jaeger

Jaeger 的主要作用如下&#xff1a; 分布式追踪 Jaeger 是一个开源的分布式追踪系统&#xff0c;用于监控和排查微服务架构中的复杂问题。它可以跟踪请求在不同服务之间的传播路径&#xff0c;帮助开发者理解系统中各个组件之间的调用关系。 性能分析 通过收集和分析请求的执行…...

使用Python和OpenCV实现火焰检测

使用Python和OpenCV实现火焰检测 项目解释&#xff1a; 此 Python 代码是使用 OpenCV、线程、声音和电子邮件功能的火灾探测系统的简单示例。 以下是它的功能的简单描述&#xff1a; 导入库&#xff1a;代码首先导入必要的库&#xff1a; cv2&#xff1a;用于图像和视频处理…...

shell脚本--常见案例

1、自动备份文件或目录 2、批量重命名文件 3、查找并删除指定名称的文件&#xff1a; 4、批量删除文件 5、查找并替换文件内容 6、批量创建文件 7、创建文件夹并移动文件 8、在文件夹中查找文件...

基于Uniapp开发HarmonyOS 5.0旅游应用技术实践

一、技术选型背景 1.跨平台优势 Uniapp采用Vue.js框架&#xff0c;支持"一次开发&#xff0c;多端部署"&#xff0c;可同步生成HarmonyOS、iOS、Android等多平台应用。 2.鸿蒙特性融合 HarmonyOS 5.0的分布式能力与原子化服务&#xff0c;为旅游应用带来&#xf…...

Vue2 第一节_Vue2上手_插值表达式{{}}_访问数据和修改数据_Vue开发者工具

文章目录 1.Vue2上手-如何创建一个Vue实例,进行初始化渲染2. 插值表达式{{}}3. 访问数据和修改数据4. vue响应式5. Vue开发者工具--方便调试 1.Vue2上手-如何创建一个Vue实例,进行初始化渲染 准备容器引包创建Vue实例 new Vue()指定配置项 ->渲染数据 准备一个容器,例如: …...

Rapidio门铃消息FIFO溢出机制

关于RapidIO门铃消息FIFO的溢出机制及其与中断抖动的关系&#xff0c;以下是深入解析&#xff1a; 门铃FIFO溢出的本质 在RapidIO系统中&#xff0c;门铃消息FIFO是硬件控制器内部的缓冲区&#xff0c;用于临时存储接收到的门铃消息&#xff08;Doorbell Message&#xff09;。…...

Springboot社区养老保险系统小程序

一、前言 随着我国经济迅速发展&#xff0c;人们对手机的需求越来越大&#xff0c;各种手机软件也都在被广泛应用&#xff0c;但是对于手机进行数据信息管理&#xff0c;对于手机的各种软件也是备受用户的喜爱&#xff0c;社区养老保险系统小程序被用户普遍使用&#xff0c;为方…...

逻辑回归暴力训练预测金融欺诈

简述 「使用逻辑回归暴力预测金融欺诈&#xff0c;并不断增加特征维度持续测试」的做法&#xff0c;体现了一种逐步建模与迭代验证的实验思路&#xff0c;在金融欺诈检测中非常有价值&#xff0c;本文作为一篇回顾性记录了早年间公司给某行做反欺诈预测用到的技术和思路。百度…...

苹果AI眼镜:从“工具”到“社交姿态”的范式革命——重新定义AI交互入口的未来机会

在2025年的AI硬件浪潮中,苹果AI眼镜(Apple Glasses)正在引发一场关于“人机交互形态”的深度思考。它并非简单地替代AirPods或Apple Watch,而是开辟了一个全新的、日常可接受的AI入口。其核心价值不在于功能的堆叠,而在于如何通过形态设计打破社交壁垒,成为用户“全天佩戴…...

Neko虚拟浏览器远程协作方案:Docker+内网穿透技术部署实践

前言&#xff1a;本文将向开发者介绍一款创新性协作工具——Neko虚拟浏览器。在数字化协作场景中&#xff0c;跨地域的团队常需面对实时共享屏幕、协同编辑文档等需求。通过本指南&#xff0c;你将掌握在Ubuntu系统中使用容器化技术部署该工具的具体方案&#xff0c;并结合内网…...

aardio 自动识别验证码输入

技术尝试 上周在发学习日志时有网友提议“在网页上识别验证码”&#xff0c;于是尝试整合图像识别与网页自动化技术&#xff0c;完成了这套模拟登录流程。核心思路是&#xff1a;截图验证码→OCR识别→自动填充表单→提交并验证结果。 代码在这里 import soImage; import we…...

JS红宝书笔记 - 3.3 变量

要定义变量&#xff0c;可以使用var操作符&#xff0c;后跟变量名 ES实现变量初始化&#xff0c;因此可以同时定义变量并设置它的值 使用var操作符定义的变量会成为包含它的函数的局部变量。 在函数内定义变量时省略var操作符&#xff0c;可以创建一个全局变量 如果需要定义…...