Canvas API dirancang untuk menggambar grafik di browser web. Ini dapat digunakan untuk animasi, grafik permainan, visualisasi data, pengeditan gambar, pemrosesan video waktu nyata, dll. Ini juga dapat digunakan untuk pelacakan online melalui sidik jari browser. Teknologi ini bergantung pada perubahan bagaimana gambar kanvas ditampilkan di berbagai browser web dan platform untuk membuat sidik jari digital yang dipersonalisasi dari browser pengguna. Namun dimungkinkan untuk mengulanginya di lingkungan peralatan yang sama.

Deteksi fungsi kanvas

• Canvas 2D API
• Text API for Canvas
• Canvas toDataURL(biasa digunakan untuk pengenalan sidik jari)
• OffscreenCanvas API
• Canvas native

  Fungsi Canvas toDataURL juga dapat dimodifikasi oleh plug-in browser, namun mudah diidentifikasi

• stabilitas

  Canvas stabil di perangkat dan lingkungan browser yang sama

• kebisingan yang bukan berasal dari manusia

  Beberapa browser sidik jari atau plug-in sidik jari dapat menambahkan parameter ke noise kanvas, namun parameter tersebut mungkin masih dapat dikenali.

Detail gambar

Penyebab Sidik Jari Kanvas

Cara gambar Canvas dirender di kanvas dapat bervariasi tergantung pada browser web, sistem operasi, kartu grafis, dan faktor lainnya, sehingga menghasilkan gambar unik yang dapat digunakan untuk membuat sidik jari.

1. Anti-aliasing

Teknologi anti-aliasing adalah sejenis filter kecantikan dan banyak digunakan. Jika penghalusan font tidak diaktifkan di sistem operasi, beberapa font akan terlihat buruk di monitor komputer Anda. Secara umum, sistem operasi Windows mengaktifkan penghalusan font dan gambar secara default. Di Mac OS X, anti-aliasing sepertinya hanya berfungsi untuk font di bawah ukuran tertentu. Tidak hanya pada tingkat sistem operasi, beberapa browser juga memiliki teknologi anti-aliasing bawaannya. Misalnya, Safari menggunakan mesin rendering font bawaannya sendiri. Dan yang terbaik dari semuanya, teknologi anti-aliasing juga berfungsi saat menggambar font dan gambar di Canvas.

Seperti yang ditunjukkan pada gambar di bawah, sisi kiri menunjukkan keadaan di mana penghalusan font tidak diaktifkan, sedangkan sisi kanan menunjukkan bahwa penghalusan font diaktifkan:

Teknologi anti-aliasing akan menghasilkan beberapa piksel non-warna murni, dan nilai piksel dalam keadaan peralihan ini dipengaruhi oleh profil warna kartu grafis, sehingga menghasilkan warna yang berbeda. Dengan menggambar font dan gambar yang sama pada kanvas yang cukup besar, lalu menghitung seluruh data piksel, maka dapat diperoleh data sidik jari yang relatif unik.

2. Petunjuk Font

Salah satu fitur penyesuaian adalah penyesuaian grid, yang berarti memodifikasi tinggi dan lebar karakter font untuk menyelaraskannya dengan grid piksel yang ditampilkan di layar. Gambar ditampilkan di layar sebagai kisi-kisi kotak kecil. Font dapat dipindahkan ke kiri dan kanan untuk memastikan bahwa font tersebut ditampilkan dengan benar pada kisi-kisi tersebut. Hal ini juga untuk memastikan bahwa bentuk dan tata letak font terlihat kira-kira sama pada saat yang berbeda layar.

Melalui gambar GIF berikut, yang merupakan kumpulan gambar kanvas dari puluhan pengguna berbeda, secara intuitif kita dapat melihat perbedaan penyajian kode yang sama di lingkungan perangkat yang berbeda:

Seperti yang ditunjukkan pada detail gambar di atas, secara umum, kita dapat memanggil fungsi toDataURL untuk mendapatkan data base64 dari gambar Canvas, atau kita bisa mendapatkan checksum CRC dari blok IDAT dari blok data gambar PNG yang dihasilkan oleh Canvas. Kami kemudian dapat menghitung hash dari string tersebut (base64 atau CRC checksum) (algoritme pastinya bervariasi dari satu situs ke situs lainnya) sebagai sidik jari Canvas.

Catatan: Ada banyak alasan mengapa sidik jari Canvas bervariasi dari satu situs web ke situs web lainnya. String yang berbeda yang digunakan (base64 atau CRC checksum), algoritma hashing yang berbeda (MD5, SHA, MUMUHASH, dll.) akan membuat sidik jari Canvas benar-benar berbeda, tetapi sebenarnya Sidik jari Canvas stabil, jadi dalam lingkungan browser dan perangkat yang sama, sidik jari Canvas di situs web yang sama diperbaiki. Ini juga menjadi landasan teori sidik jari Canvas yang akan digunakan untuk identifikasi dengan bantuan pengguna, yang memiliki sifat stabil.