Repositori GitHub: https://github.com/JSREI/js-cookie-monitor-debugger-hook
Cina Sederhana |
Di era di mana data sangat berharga, konfrontasi antara crawler dan anti-crawler menjadi semakin intens. Anti-crawler cookie adalah最常见之一
. Situs web menyetel cookie melalui kode JS yang sangat membingungkan bahkan para ibu pun bisa melakukannya tidak mengenalinya (biasanya saat browsing) Sidik jari server, cookie yang harus dibawa saat membuat permintaan, dll.), Cookie yang harus dibawa saat menghadapi permintaan tetapi tidak tahu di mana dihasilkannya, Anda berjuang dalam puluhan ribu baris JS membingungkan yang tidak dikenali ibu Anda, berharap menemukan tempat pembuatan cookie (jika pemikiran sebaliknya tidak ilmiah, Anda mungkin tersedak beberapa kali...), dan bahkan ingin mencari beberapa kali. Apakah Anda mencoba menipu diri sendiri agar menyerah, atau mengapa tidak menggunakan metode emulasi browser seperti Selenium? Jika Anda seorang pengecut, skrip ini siap membantu Anda! (Anda dan saya sama-sama tahu bahwa paragraf ini hanyalah omong kosong untuk mendukung adegan tersebut. Anda dapat melewatkannya, jika Anda tidak cukup malang untuk menyelesaikan membacanya...)
Fungsi script ini secara garis besar terbagi menjadi dua bagian:
Skrip ini memasukkan kode JS-nya sendiri ke dalam halaman dan mengaitkan document.cookie
untuk menyelesaikan berbagai fungsi, oleh karena itu, sebelum menggunakan skrip ini, Anda harus terlebih dahulu mengonfirmasi bahwa cookie yang akan dibuat memang dibuat melalui JS (metode yang sangat khusus akan diperkenalkan nanti. . Cukup tentukan apakah cookie dibuat oleh JS atau dikembalikan oleh server).
Saat ini, banyak skrip Hook yang memiliki postur kaitan yang salah. Skrip ini menggunakan Hooks satu kali dan berulang, yang tidak berdampak pada pengelolaan cookie bawaan browser:
Selain fungsi cookie breakpoint, fungsi pemantauan modifikasi cookie telah ditambahkan, yang dapat menganalisis cookie pada halaman dari perspektif yang lebih makro:
(Lupakan saja, hentikan coding...)
Warna digunakan untuk membedakan jenis operasi:
Setiap operasi akan diikuti dengan lokasi kode. Klik untuk menemukan lokasi kode JS yang melakukan operasi.
Mulai dari v0.6, aturan breakpoint dengan fungsi yang lebih kuat dan konfigurasi yang lebih fleksibel telah diperkenalkan, dan mekanisme peristiwa telah diperkenalkan untuk membagi modifikasi cookie menjadi tiga peristiwa: tambah, hapus, dan perbarui, yang mendukung breakpoint yang lebih terperinci Peristiwa cookie, lihat Bagian 5 artikel ini untuk detailnya.
Mengapa dirancang seperti ini? Situasi yang relatif umum adalah bahwa cookie anti-perayapan di situs web target disetel oleh JS, tetapi logika kode JS adalah menghapusnya terlebih dahulu, lalu menghapusnya berkali-kali sebelum menambahkan nilai sebenarnya cara ini sebenarnya dapat menangkalnya.
Ini salah satu contohnya, seperti proteksi Cookie F5, ada Cookie TS51c47c46075
yang dihapus berkali-kali lalu ditambahkan lagi: Dalam hal ini, Anda dapat menetapkan breakpoint untuk peristiwa cookie bernama TS51c47c46075
untuk menghindari kebingungan dengan peristiwa penghapusan merah.
Secara teoritis, selama kode JS skrip ini dapat dimasukkan ke dalam halaman, plugin Grease Monkey digunakan untuk memasukkan kode JS ke dalam halaman.
Plugin Grease Monkey dapat diinstal dari Chrome Store:
https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo
Jika Anda tidak dapat menghindari tembok, Anda dapat mencari "Tampermonkey" di Baidu untuk menemukan situs web pihak ketiga untuk diunduh. Namun, harap berhati-hati untuk tidak memasang plugin berbahaya palsu. Disarankan untuk memasang dari yang resmi toko.
Alat lain juga tersedia, selama kode JS skrip ini dapat dimasukkan ke bagian atas halaman untuk dieksekusi.
Anda dapat menginstal skrip Grease Monkey dari toko resmi, atau Anda dapat menyalin kode dan membuatnya secara lokal.
Metode ini disarankan. Skrip Oil Monkey yang diinstal dari Oil Monkey Store dapat diperbarui secara otomatis ketika versi berikutnya diperbarui.
https://greasyfork.org/zh-CN/scripts/419781-js-cookie-monitor-debugger-hook
Jika Anda merasa pembaruan otomatis terlalu mengganggu, atau memiliki masalah lain, Anda dapat menyalin kode skrip ini di sini:
https://github.com/CC11001100/js-cookie-monitor-debugger-hook/blob/main/js-cookie-monitor-debugger-hook.js
Setelah meninjau dan memastikan tidak ada masalah, Anda dapat menambahkannya di panel manajemen Oil Monkey.
Perhatikan bahwa pemantauan adalah untuk mendapatkan pemahaman menyeluruh pada tingkat makro, bukan untuk menemukan rincian (biasanya penggunaan alat yang benar dapat meningkatkan efisiensi. Tentu saja, pengetahuan seseorang terbatas, dan setiap orang dipersilakan untuk memberikan umpan balik tentang cara-cara yang lebih menarik untuk melakukan pemantauan. play) , misalnya saat membuka halaman:
Berdasarkan gambar ini, kita dapat memperoleh gambaran umum tentang cookie mana di situs web ini yang dioperasikan oleh JS, kapan dan bagaimana cara pengoperasiannya.
Contoh lainnya adalah dengan menggunakan monitor untuk mengamati pola perubahan cookie. Misalnya, di halaman ini, Anda dapat melihat berdasarkan waktu perubahan cookie ini setiap setengah menit:
(2021-1-7 18:27:49 memperbarui v0.4 untuk menambahkan fitur ini): Jika ada terlalu banyak informasi yang dicetak oleh konsol, Anda dapat menggunakan pemfilteran yang disertakan dengan browser Chrome untuk memfilternya log yang dicetak sudah menyatu, hanya perlu cookieName = Cookie名字
, contoh:
Harap dicatat bahwa saat mencari, pastikan informasi pencarian Anda didekodekan dengan URL, jika tidak, informasi tersebut mungkin tidak cocok, karena informasi pencetakan konsol adalah didekodekan URL terlebih dahulu dan kemudian dicetak.
Jika Anda tidak yakin apakah cookie yang ingin Anda setel dibuat secara lokal atau dikembalikan oleh server yang meminta set-cookie
, Anda dapat membuka skrip ini, menyegarkan halaman situs web target, lalu mencari nama cookie di konsol. Caranya sama seperti di atas. Pada bagian ini serupa, bila nama cookie pendek dan tidak khas, Anda dapat menambahkan cookieName
untuk membantu positioning, misalnya:
cookieName = v
Terkadang situs web target dapat menyetel cookie berulang kali dengan nilai yang sama. Variabel ini digunakan untuk mengabaikan kejadian seperti ini:
Umumnya, pertahankan default saja.
@since v0.6
Bagian dokumen ini berlaku untuk versi v0.6+ Jika versi lokal Anda kurang dari 0.6, harap tingkatkan versi tersebut sebelum membaca dokumen.
Mulai dari v0.6, titik henti ketika nilai Cookie berubah menjadi sangat rumit, dan juga menjadi sangat sederhana. Kompleksitasnya disebabkan oleh pengenalan mekanisme peristiwa, dan kesederhanaannya karena konfigurasi aturan titik henti sementara disederhanakan dan lebih fleksibel.
Aturan breakpoint dapat dibagi menjadi标准规则
dan简化规则
. Aturan standar ditujukan untuk kemudahan implementasi dan pemrosesan di bagian bawah program. Ketika konfigurasi aturan yang disederhanakan tidak dapat Periksa kembali untuk melihat cara mengonfigurasi aturan standar ketika kebutuhan Anda terpenuhi.
Semua aturan dikonfigurasikan dalam array debuggerRules
, dan terdapat variabel di bagian atas skrip: Jika Anda tidak dapat menemukannya, Anda dapat menekan Ctrl+F untuk mencari berdasarkan nama variabel:
debuggerRules
Variabel ini adalah tipe array, yang menyimpan beberapa kondisi aturan untuk menentukan dalam kondisi apa breakpoint akan dimasukkan.
Perhatikan bahwa ini adalah array, dan aturan dalam array berada dalam hubungan OR. Ketika peristiwa modifikasi Cookie dipicu, setiap aturan akan dicocokkan secara berurutan Selama satu aturan berhasil dicocokkan, breakpoint akan dimasukkan.
Masukkan breakpoint ketika nama cookie foo
berubah:
const debuggerRules = [ "foo" ] ;
Menentukan string dengan cara di atas akan cocok dengan nama cookie jika sama dengan string yang diberikan.
Perhatikan bahwa jika ada bagian yang sama persis dengan kode URL di sini, bagian tersebut harus didekodekan URL terlebih dahulu, lalu ditempelkan di sini. Tempat lain yang melibatkan string adalah sama dan tidak akan dijelaskan lagi.
Jika nama cookie berisi bagian yang terus berubah, seperti stempel waktu, UUID, dll., yang tidak dapat ditemukan berdasarkan namanya, maka pencocokan reguler akan digunakan:
const debuggerRules = [ / foo.+ / ] ;
Dalam kebanyakan kasus, hanya dua konfigurasi ini yang cukup.
Mari kita praktekkan sekarang
https://www.ishumei.com/trial/captcha.html
Anda dapat melihat bahwa skrip telah mendeteksi beberapa operasi cookie:
Salah satunya, smidV2
mencurigakan, jadi kami menambahkan breakpoint untuknya:
Setelah memodifikasi array debuggerRules
, pastikan untuk menekan Ctrl+S untuk menyimpan skrip. Karena Oil Monkey memasukkan kode JS saat halaman dimuat, Anda perlu menyegarkan halaman dan memasukkannya kembali breakpoint akan dimasukkan secara otomatis:
Di kotak merah A pada gambar di atas terdapat beberapa variabel yang dimasukkan secara khusus. Dengan menggerakkan mouse ke atas variabel tersebut untuk melihat nilainya, secara kasar kita dapat mengetahui beberapa kondisi breakpoint saat ini:
Lalu ada kotak merah B. Kami mengatur breakpoint Cookie untuk melacak tumpukan panggilan dan menemukan tempat di mana cookie dibuat. Kotak merah adalah tumpukan panggilan skrip ini. Ada logo userscript.html
yang jelas Abaikan saja bagian dari tumpukan panggilan ini.
Kemudian lacak tumpukan panggilan dan Anda dapat melihat di mana cookie disetel:
Tentu saja, tidak ada gunanya bagi kita untuk melihat tumpukan ini. Yang harus kita lakukan adalah bergerak maju secara bertahap sampai kita menemukan tempat di mana cookie sebenarnya dibuat bintang dan laut akan bergantung padanya nanti.
Masukkan breakpoint ketika cookie bernama foo
添加
:
const debuggerRules = [ { "add" : "foo" } ] ;
Masukkan breakpoint ketika cookie bernama foo
删除
:
const debuggerRules = [ { "delete" : "foo" } ] ;
Masukkan breakpoint ketika cookie bernama foo
sudah ada tetapi nilainya更新
:
const debuggerRules = [ { "update" : "foo" } ] ;
Beberapa kondisi dapat ditentukan secara bersamaan, dan titik henti sementara dimasukkan saat添加和更新
, yang setara dengan mengecualikan penghapusan:
const debuggerRules = [ { "add|update" : "foo" } ] ;
String atau ekspresi reguler dapat digunakan di mana pun pencocokan nama cookie terlibat:
const debuggerRules = [ { "add" : / foo_d+ / } ] ;
Aturan yang disederhanakan di atas akan diubah menjadi aturan standar. Anda juga dapat mengonfigurasi aturan standar secara langsung di array debuggerRules
. Format aturan standar adalah:
{
"events": "{add|delete|update}",
"name": {"cookie-name" | /cookie-name-regex/},
"value": {"cookie-value" | /cookie-value-regex/}
}
Tipe string, menunjukkan tipe event yang cocok dengan aturan ini. Bisa berupa event tunggal, misalnya add
, atau beberapa event. Gunakan |
|
memisahkan beberapa event, misalnya add|update
Tambahkan spasi di kedua sisi, seperti add | update
Jika jenis peristiwa dikonfigurasi, ini hanya akan cocok dengan jenis peristiwa tertentu. Jika opsi ini tidak dikonfigurasi, semua jenis peristiwa akan dicocokkan secara default.
Ini bisa berupa string atau pola reguler. Benar jika nama cookie cocok dengan string atau pola reguler yang diberikan. Item ini tidak dapat diabaikan dan harus dikonfigurasi.
Ini bisa berupa string atau pola reguler. Aturan ini berlaku jika nilai cookie cocok dengan string atau pola reguler yang diberikan. Jika tidak dikonfigurasi, opsi ini akan diabaikan.
Konfigurasi aturan breakpoint telah diperkenalkan sebelumnya, dan jenis peristiwa disebutkan berkali-kali. Kami hanya mengetahui string nama yang sesuai dengan setiap peristiwa, namun kami masih belum mengetahui arti setiap peristiwa di tingkat bawah peristiwa. Mekanisme realisasi suatu peristiwa.
Perubahan cookie dibagi lagi menjadi penambahan cookie, penghapusan cookie, dan pembaruan nilai cookie yang ada. Setiap peristiwa sesuai dengan nama peristiwa:
Cookie tersebut belum ada secara lokal sebelumnya dan ini adalah pertama kalinya cookie tersebut ditambahkan. Ini mungkin pertama kalinya Anda mengunjungi situs web ini, atau Anda mungkin menghapus cookie dan mengunjungi lagi, atau cookie baru akan dibuat setiap kali Anda mengunjungi situs web, atau bahkan mungkin kode situs web itu sendiri yang menghapus cookie dan menambahkannya kembali. mereka, yang akan memicu penambahan acara cookie.
Misalnya, jalankan kode berikut. Untuk memastikan bahwa cookie tidak ada sebelumnya, stempel waktu ditambahkan ke nama cookie:
document . cookie = "foo_" + new Date ( ) . getTime ( ) + "=bar; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/" ;
Saat kita menjalankan baris kode ini di konsol, event Cookie Add akan dipicu:
Ketika cookie sudah ada secara lokal dan Anda mencoba menetapkan nilainya, peristiwa pembaruan cookie akan dipicu.
Misalnya kode berikut:
document . cookie = "foo_10086=blabla; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/" ;
document . cookie = "foo_10086=wuawua; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/" ;
Pernyataan pertama untuk menyetel Cookie akan memicu peristiwa Cookie Baru, dan pernyataan kedua untuk menyetel Cookie akan memicu peristiwa Pembaruan Cookie karena Cookie yang akan disetel sudah ada.
Jika pengembang front-end memberikan waktu kedaluwarsa lebih awal dari waktu saat ini saat menyetel cookie, berarti cookie tersebut perlu dihapus. Misalnya, cara umum untuk menghapus cookie adalah:
const expires = new Date ( new Date ( ) . getTime ( ) - 1000 * 30 ) . toGMTString ( ) ;
document . cookie = "foo=; expires=" + expires + "; path=/"
Saat kita menjalankan kode ini di konsol, event penghapusan Cookie akan dipicu:
Dapat dilihat juga dari penjelasan di atas bahwa pemicuan event penghapusan Cookie adalah murni untuk mendeteksi kadaluarsa, dan tidak akan benar-benar memeriksa apakah Cookie tersebut sudah ada sebelumnya.
Seperti disebutkan sebelumnya, ada tipe kejadian saat mengonfigurasi aturan breakpoint Cookie. Faktanya, setiap tipe kejadian sesuai dengan bit flag yang menunjukkan apakah breakpoint tipe kejadian ini diaktifkan , jika tidak Saat titik henti sementara penghapusan Cookie diaktifkan dan peristiwa penghapusan Cookie dipicu, pertama-tama ia akan memeriksa apakah titik henti sementara penghapusan Cookie diaktifkan. Jika dimatikan, peristiwa tersebut akan diabaikan dan tidak ada upaya lagi yang akan dilakukan dibuat agar sesuai dengan aturan breakpoint (Dikendalikan oleh Alat Pengembang) Log peristiwa penghapusan ini akan tetap dicetak di platform).
Jadi sekarang situasinya menjadi sangat rumit. Mari kita lihat proses breakpoint Cookie kecil ini:
Secara default, hanya breakpoint untuk peristiwa penambahan Cookie dan peristiwa modifikasi Cookie yang diaktifkan:
Karena dalam keadaan normal, menambahkan cookie dan memperbarui cookie dapat membingungkan. Keduanya memberikan nilai pada cookie. Dalam kebanyakan kasus, kami tidak akan memperhatikan peristiwa penghapusan cookie, jadi beginilah pengaturannya di sini. Jika tidak memenuhi kebutuhan Anda. Jika diperlukan, Anda dapat mengubah sendiri nilai enableEventDebugger
yang sesuai.
Jika Anda mengalami masalah selama penggunaan, Anda dapat memberikan umpan balik di Issues
di GitHub, Anda juga dapat memberikan umpan balik di area komentar Skrip Grease Monkey, atau Anda dapat mengirimi saya email, dan saya akan menanganinya segera setelah mungkin setelah melihatnya.
Mulai dari versi v0.6, sebuah variabel telah ditambahkan untuk menyesuaikan ukuran font log yang dicetak oleh skrip ini di konsol, dalam px:
Ketika versi diulang, mungkin tidak lagi ada di lokasi ini. Jika Anda tidak dapat menemukannya sekaligus, cari di kode:
consoleLogFontSize
Kemudian ubah nilai variabel ini.
Atau sebagai solusi lain, Anda dapat menahan Ctrl+roda mouse di konsol alat pengembang untuk memperbesar dan menyesuaikan ukuran keseluruhan. Ini adalah fungsi yang disertakan dengan browser Chrome.
Seperti yang dijelaskan di awal artikel ini, skrip ini harus berhasil dimasukkan ke awal halaman dan dijalankan sebelum Hook berhasil. Untuk seluruh halaman yang mirip dengan lapisan pertama Accelerator, hanya satu skrip yang dikembalikan logika di dalamnya:
< script >
document . cookie = 这里是一些奇奇怪怪的JS用于计算出Cookie ;
location . href = "跳转走了" ;
</ script >
Cookie disetel dan segera dialihkan ke halaman baru. Untuk operasi ini, Hook mungkin tidak tersedia. Ini adalah masalah dengan skrip Grease Monkey. Jika Anda bersikeras untuk Hooking, Anda dapat menggunakan proxy gantung untuk memasukkan skrip ini ke dalamnya URL ini.
Di bawah halaman ini adalah ringkasan beberapa contoh praktis rekayasa balik menggunakan skrip ini:
Klik saya untuk masuk ke halaman navigasi
Proyek ini dipisahkan dari: https://github.com/CC11001100/crawler-js-hook-framework-public/tree/master/001-cookie-hook#%E7%9B%91%E6%8E%A7%E5 %AE%9A%E4%BD%8Djavascript%E6%93%8D%E4%BD%9Cookie
Setelah mengubah namespace, jumlah instalasi mungkin dihapus. Saya mengambil tangkapan layar untuk memperingatinya. Sampai sekarang (29-7-2022 21:40:01), jumlah instalasi telah melebihi 300. Rasanya seperti itu. sangat besar untuk alat kecil di lapangan sempit seperti itu.. tidak mudah lagi..
Terima kasih kepada netizen yang antusias atas masukannya, terima kasih atas dukungannya.
js-cookie-monitor-debugger-hook kini telah bergabung dengan Proyek 404 Star Chain
Pindai kode QR untuk bergabung dengan grup pertukaran teknologi terbalik:
Jika kode QR grup kedaluwarsa, Anda dapat menambahkan saya di WeChat pribadi dan mengirim [Grup Terbalik] untuk bergabung dengan Anda di grup:
Klik di sini atau pindai kode QR untuk bergabung dengan grup pertukaran TG: