Di banyak tempat, aplikasi seperti menggunakan kode QR untuk masuk, pembayaran kode QR, akun kode QR (saya tidak akan berbicara tentang kuda jantan QR di sini, penipuan), verifikasi kode QR, aplikasi otorisasi tambahan multi-terminal telah mulai meningkat. Mari kita bicara tentang apa kode QR. Faktanya, kode QR adalah gambar hitam dan putih dari data biner yang disimpan. Ketika kode QR diperlukan untuk masuk, server akan menghasilkan informasi kode QR unik sementara, yang akan dikirim ke klien dan ditulis ke halaman web dalam bentuk kode QR (gambar). Kemudian Anda akan melihat empat kode QR persegi. Jika Anda melakukannya dengan baik, informasi kode QR ini harus efisien waktu. Saya tidak akan mempertimbangkan ini untuk saat ini. Mari kita ambil login WeChat sederhana sebagai contoh:
Mari kita bicara tentang seluruh proses otorisasi:
Halaman web klien akan terus -menerus mengirim koneksi HTTPS ke server, dan setelah mengirimkan sangat sedikit data, koneksi akan terputus. Mari kita lihat file login1c709c.js di halaman web WeChat:
(function ($, _aowin) {_aowin.qrlogin = {}; _aowin.loginlog = ""; var _sbaseHost = "", _OLOGINQRCODEIMG = Document.getElementById ("LOGINQRCODE"); if (document.domain == ") {" oM document. "weixin.qq.com"; _odetActWebmMinterval = setInterval (function () {if (_aowin.webmm) {clearInterval (_odetActWebMinterVal); var callback; while (callback = _awebmmcallbacks.shift ()) {if (typeof (callback)! _loginpage (_aslog) {_aowin.loginlog = LoginLog + _aslog + "/n" _ReportNow (Teks) {_LogInpage (teks); ClearInter (LoadQrimgwatchDog); " + img.src +", waktu: " + (tanggal baru (). getTime () - loadqrcodetime) +" ms ");}, loadqrimgwatchdog = null; function _loadqrimg (uuid) {_poll (uuid); _loginpage (" load qrcode ("load start qrcode (uuid); _loginpage (" load qrcode ("load start qrcode (uuid); _loginpage (" load qrcode start qrcode); _OLOGINQRCODEIMG.OnLOAD = function () {LoadQRIMGSUCC () "https: // login."+_sbasehost+"/qrcode/"+uuid+"? t = webwx" _img.onload = function () {if (! _ OGINQRCODEIMG.OnLOAD) return _IMG.SRC = _OLOGINQRCODEIMG.SRC + "& R =" + Tanggal baru (). GetTime (),}, 5000); Arguments.Callee, _ntime = 0; "/cgi-bin/mmwebwx-bin/login?uuid=" + _asUUID + "&tip=" + show_tip, dataType: "script", cache: false, timeout: _nAjaxTimeout, success: function(data, textStatus, jqXHR) { _logInPage("_poll Request Success, code: " + window.code + ", time: " + (Tanggal baru (). GetTime () - _ntime) + "MS"); _fnewLogInfunc = function () {$ .Ajax ({url: _aowin.redirect_uri + "& fun = new", // jenis halaman login baru: "get", success: function (msg) {_loginpage ("func baru terkonek msg.match (/<script> (.*) <// Script>/); Webmm.Model ("Akun"). SetsKey (SKEY [1]); } _ReportNow (_aowin.redirect_uri + "Kesalahan halaman login baru:" + TextStatus + "RetryCount:" + _nnewloginfuncerrcount); _ReportNow ("/CGI-BIN/MMWEBWX-BIN/LOGIN, Sukses Permintaan Kedua, UUID:" + _Asuuid + ", waktu:" + _ssecondrequesttime + "ms"); $ ('. Normldesc'). Hide (); _ssecondRequestTime = Tanggal baru (). GetTime (); _aowin.log.d ("500, Pollin SVR Exception"); _Self (_asuuid); _getuuidwatchdog, _bgetuuidsuccess = false; // Ajax Success ִ function _getuuid () {getuuidcount ++; getuuidcount); if (! _ aowin.qrlogin.code) {_loginpage ("Getuuid Timeout, Watchdog Run"); "/jslogin?appid=wx782c26e4c19acffb&redirect_uri="+Encodeuricomponent(location.protocol+"//"+location.host+"/cgi-bin/mmwbx-bin/webwxnewlogypage. "Script", False, Success: Function () {ClearTimeOut (_GetuUidWatchDog); _BgetUUDSUCCESS = true; _LoadQRIMG (qrlogin.uuid); _LoadError (qrlogin.code = " + qrlogincode); if ("#login_container"). adalah (": visible") {_getuuid (); ) "+" webwxuvid "+" = ([^;]*) (; | $) ")); if (! _ suvid || _suvid.length <3) return; _suvid = _suvid [2]; (gambar baru ()). SRC = "/cgi-bin/mmwebwx-bin/webwxstatreport? funkey = indexdemo & uvid ="+_ suvid+"& uuid ="+_ scuruuid; $ (" #Guubetrigger, #TipTrigger"), _omask $ = $ (". Mask"); _oguide $ .stop (). animate ({marginleft: "-120px", opacity: 0}, "400", "swing", function () {_oguide $ .hide ();}); _OgUIdetrigger $ .css ({"BackgroundColor": "White", "Opacity": "0"}); "Block". Stop (). Animate ({marginleft: "+168px", opacity: 1}, 900, "swing", function () {_oguide $ .animate ({marginleft: "+153px"} ({{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{{mouse); clearTimeout (_ntimer);Setelah membaca JS dengan hati -hati, Anda akan melihat sisi login dari klien web. Klien Web memulai permintaan SSL ke server setiap 500 milidetik, meminta apakah kode QR saat ini disahkan oleh klien lain (ponsel). Jika hasil pengembalian adalah 201, itu berarti bahwa Anda telah memperoleh akun yang sama dengan terminal kode pemindaian QR untuk masuk. Jika itu adalah situasi lain, kirim permintaan lagi setelah 500 milidetik. Proses ini akan berlanjut sampai kode QR dipindai atau kode QR diatur waktunya (tidak valid).
Alat yang digunakan adalah: Paket meraih alat Fidller, alat pengembang Chrome F12. Perhatikan bahwa secara kebetulan, klien WeChat memiliki min-webmm1cba21.js, yang terlihat jelas dalam spesifikasi filter XSS. Ini memiliki harapan mendapatkan Q untuk mereka yang suka menguji XSS di kotak putih! Lai Lai
Artikel ini telah dikompilasi menjadi "Ringkasan Keterampilan Pengembangan JavaScript WeChat", dan semua orang dipersilakan untuk belajar dan membaca.
Saya merekomendasikan tutorial tentang applet WeChat yang sangat prihatin sekarang: editor "Tutorial Pengembangan Program Mini WeChat" telah dengan hati -hati menyusunnya untuk semua orang, saya harap Anda menyukainya.
Di atas adalah semua konten artikel ini. Saya berharap ini akan membantu untuk pembelajaran semua orang dan saya harap semua orang akan lebih mendukung wulin.com.