浏览器指纹的目的
用于跟踪用户浏览器精准推送广告
大致种类
指纹
用JS创建一个canvas画布，然后在画布上面画几个图形，正方形，圆形等，然后写几个字。然后把这个canvas 转base64，最后生成base64编码的hash值，这个hash值就是canvas指纹。
const createFingerprint = () => {
const canvas = document.createElement('canvas')
const ctx = canvas.getContext('2d')
if (ctx) {
ctx.font = '24px Arial'
ctx.fillText('fingerprint', 22, 33)
ctx.moveTo(0, 0)
ctx.lineTo(100, 100)
ctx.stroke()
const B64 = canvas.toDataURL().replace('data:image/png;base64,', '')
return hex_md5(B64)
}
}
export default createFingerprint
获取GPU信息
因为客户不可能随时更换显卡，也算一个唯一值
(function () {
var canvas = document.createElement('canvas'),
gl = canvas.getContext('experimental-webgl'),
debugInfo = gl.getExtension('WEBGL_debug_renderer_info');
console.log(gl.getParameter(debugInfo.UNMASKED_RENDERER_WEBGL));
})();
获取电池信息(网站需https)
navigator.getBattery().then(function (battery) {
console.log(battery)
})
navigator.getBattery().then(function (battery) {
// 添加事件，当设备电量改变时触发
battery.addEventListener('levelchange', function () {
console.log('电量改变: ' + battery.level)
})
// 添加事件，当设备充电状态改变时触发
battery.addEventListener('chargingchange', function () {
console.log('充电状态改变: ' + battery.charging)
})
// 添加事件，当设备完全充电需要时间改变时触发
battery.addEventListener('chargingtimechange', function () {
console.log('完全充电需要时间: ' + battery.chargingTime)
})
// 添加事件，当设备完全放电需要时间改变时触发
battery.addEventListener('dischargingtimechange', function () {
console.log('完全放电需要时间: ' + battery.dischargingTime)
})
})
其他
屏幕信息：屏幕尺寸
UA信息：操作系统版本、浏览器版本等
