关于javascript:没登录网页也能个性化推荐5分钟带你了解浏览器指纹

公众号

小册

这是我整顿的学习材料，十分零碎和欠缺，欢送一起学习

• 古代 JavaScript 高级小册
• 深入浅出 Dart
• 古代 TypeScript 高级小册
• linwu 的算法笔记📒

引言

不晓得大家有没有遇到这种场景，我无痕形式拜访某个网站，该网站仍然可能精准对我进行个性化举荐？这是为什么呢？接下来，本文将介绍 浏览器指纹 无关知识点

什么是浏览器指纹?

浏览器指纹是一种用于辨认用户设施的浏览器的惟一标识符。它通过收集设施和浏览器的各种信息，如用户代理、屏幕分辨率、字体、插件列表等，以创立一个惟一的标识符。浏览器指纹可用于多种用处，包含用户身份验证、设施追踪和数据分析。

fingerprint

咱们关上 fingerprint 网站, 能够看到在失常和无痕模式下，指纹都是惟一的

<script>
  // Initialize the agent at application startup.
  const 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.visitorId
      console.log(visitorId)
    })
    .catch(error => console.error(error))
</script>

浏览器指纹的工作原理

• 1. 信息收集：浏览器指纹技术通过收集用户设施和浏览器的各种信息来创立惟一标识。这些信息能够包含用户代理字符串、屏幕分辨率、操作系统、字体列表、插件列表、硬件配置等等。
• 2. 信息组合：收集到的信息会通过肯定的解决和筛选，以便生成稳固的浏览器指纹。通常，某些信息会被排除，而其余信息会被退出到最终的指纹中。
• 3. 信息哈希化：一旦收集到足够的信息并造成了浏览器指纹的根底数据，这些数据将被组合在一起，并通过哈希函数的解决，生成一个惟一的哈希值。这个哈希值就是用户的浏览器指纹。
• 4. 指纹存储：生成的浏览器指纹通常会被存储在用户设施上，通常是在浏览器的本地存储（如 localStorage）中。这样，网站能够在用户下次访问时查看指纹，以进行身份验证或个性化举荐等操作。
• 5. 指纹比对：当用户再次拜访网站时，网站会申请并获取浏览器指纹信息，而后将其与之前存储的指纹进行比对。如果两个指纹匹配，网站就能够确认这是同一用户。