REST API 的指纹验证机制

前端或者客户端涉及数据相关的请求都是不安全的,从某种意义上只能通过一些手段降低请求不被容易使用。本来来介绍一种基于 JWT 的指纹机制。

关于 JWT 令牌机制就不详细介绍了。在 JWT 令牌中包含系统 JWT 指纹可以带来安全改进,而不会给用户带来任何不便。

什么是浏览器指纹识别?

浏览器指纹识别背后的思路是收集有关浏览器及其环境的信息以进行识别。这些属性包括浏览器类型和版本、操作系统、语言、时区、活动插件、安装的字体、屏幕分辨率、CPU 级别、设备内存和各种其他设置。这些属性被连接成一个长字符串,指纹被定义为该字符串的哈希值。

可能会问这些浏览器指纹有多独特,重复性会很大。事实证明,它们在大多数情况下是独一无二的。如果浏览器指纹碰巧不是唯一的,则可以通过将其与设备的 IP 地址相结合来使其唯一。

指纹实现思路

在 REST API 请求系统中可以通过很多参数来识别,而可以作为指纹的可以是一下信息,而这些信息大部分是在请求头里面:

  • IP地址:IP地址以及国家/地区、ISP、组织或 ASN 编号等,详细可以参阅 ipwhois.app/json/8.8.8....
  • User agent:前端请求设备信息
  • Language:用户使用的语言
  • sec-ch-ua

根据需要 JWT 指纹的敏感度,来取决组合创建指纹的参数数量。这里提供一种参考的组合:

sql 复制代码
sec-ch-ua user-agent accept-language upgrade-insecure-requests Ip ASN ORG

这是常见浏览器的指纹示例:

arduino 复制代码
192.168.1.250 : "Google Chrome";v="89", "Google Chrome";v="119", "Chromium";v="119", "Not?A_Brand";v="24" :
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36 :
zh-CN,zh;q=0.9,en;q=0.8,ja;q=0.7 : 1

对应的参数:

sql 复制代码
ip : sec-ch-ua : user-agent : accept-language : upgrade-insecure-req

所以现在有了一个指纹,它是在请求 JWT 令牌的同时生成的。可以根据特定用例添加或删除其中的元素。通常,可能将 IP 地址替换为国家/地区、ISP、组织、ASN 号码,或者将其删除并仅使用已知的标头信息。

将这些信息通过一个序列方式拼接为字符串,然后进行 MD5 转换,通常如下:

复制代码
5dc9db757608b61e3a04bd1e08dd25c3

将生成的指纹添加到 JSON Payload 中。

总结

这里只是提供了一种简单的思路,但这不能完全避免非法的无效请求,只是增加了获取模拟请求的难度。为了提高指纹的唯一性,需要增加一些独特的属性数据。

相关推荐
北海-cherish5 小时前
vue中的 watchEffect、watchAsyncEffect、watchPostEffect的区别
前端·javascript·vue.js
AALoveTouch5 小时前
网球馆自动预约系统的反调试
javascript·网络
新中地GIS开发老师7 小时前
Cesium 军事标绘入门:用 Cesium-Plot-JS 快速实现标绘功能
前端·javascript·arcgis·cesium·gis开发·地理信息科学
Superxpang7 小时前
前端性能优化
前端·javascript·vue.js·性能优化
左手吻左脸。7 小时前
解决el-select因为弹出层层级问题,不展示下拉选
javascript·vue.js·elementui
李白的故乡7 小时前
el-tree-select名字
javascript·vue.js·ecmascript
Rysxt_7 小时前
Element Plus 入门教程:从零开始构建 Vue 3 界面
前端·javascript·vue.js
隐含7 小时前
对于el-table中自定义表头中添加el-popover会弹出两个的解决方案,分别针对固定列和非固定列来隐藏最后一个浮框。
前端·javascript·vue.js
你的人类朋友8 小时前
先用js快速开发,后续引入ts是否是一个好的实践?
前端·javascript·后端
知识分享小能手8 小时前
微信小程序入门学习教程,从入门到精通,微信小程序核心 API 详解与案例(13)
前端·javascript·学习·react.js·微信小程序·小程序·vue