回答

代码如下：

  <script type="text/javascript">
       function getCanvasFingerprint() {
    // 创建canvas元素
    var canvas = document.createElement('canvas');
    var ctx = canvas.getContext('2d');

    // 设置canvas尺寸
    canvas.width = 2000;
    canvas.height = 200;

    // 绘制文字和图形
    ctx.textBaseline = "top";
    ctx.font = "14px 'Arial'";
    ctx.textBaseline = "alphabetic";
    ctx.fillStyle = "#f60";
    ctx.fillRect(125, 1, 62, 20);
    ctx.fillStyle = "#069";
    ctx.fillText("https://test.com", 2, 15);
    ctx.fillStyle = "rgba(102, 204, 0, 0.7)";
    ctx.fillText("https://test.com", 4, 17);

    // 绘制一个渐变矩形
    var gradient = ctx.createLinearGradient(0, 0, canvas.width, 0);
    gradient.addColorStop(0, "rgba(255, 255, 255, 1)");
    gradient.addColorStop(1, "rgba(0, 255, 255, 1)");
    ctx.fillStyle = gradient;
    ctx.fillRect(0, 20, canvas.width, 100);

    // 将绘制内容转换为数据URL格式的字符串
    var data = canvas.toDataURL('image/png');

    // 创建并返回这个字符串的散列值
    var hash = 0;
    for (var i = 0; i < data.length; i++) {
        var character = data.charCodeAt(i);
        hash = ((hash << 5) - hash) + character;
        hash = hash & hash; // Convert to 32bit integer
    }

    return hash;
}

console.log('Canvas Fingerprint:', getCanvasFingerprint());
    </script>