驗證碼是爬蟲程序繞不過的坎，有各種各樣的驗證碼擋在前進的道路上，比如本文將要重點介紹的旋轉(zhuǎn)驗證碼，網(wǎng)上能找到不少關(guān)于這種驗證碼的逆向方法，整體思路都是一樣的，首先需要通過深度學習模型識別出圖片的旋轉(zhuǎn)角度，接下來逆向分析加密旋轉(zhuǎn)角度的一系列過程的js代碼，根據(jù)逆向出的過程構(gòu)造出對應的參數(shù)，模擬驗證碼驗證接口調(diào)用實現(xiàn)旋轉(zhuǎn)驗證碼的識別。

不得不說，獨自搞定這一切相當耗時、耗力，而且還可能無功而返，怪不得逆向會經(jīng)常伴隨著掉頭發(fā)的調(diào)侃，即使參照網(wǎng)上大佬們的技術(shù)文章，真正實踐起來才發(fā)現(xiàn)每走一步都可能有坑，有可能是平臺反爬策略更新導致和原文已不一致，也可能因為內(nèi)容比較敏感導致關(guān)鍵細節(jié)被故意隱藏，還可能是技術(shù)實力欠缺等等。總之，這種逆向的方法讓很多人倍感無力，也許硬著頭皮研究下去最終可以搞定，但肯定需要花費不少的時間，而時間往往是不夠用的。

這里提出另外一種經(jīng)過驗證可行的解決方案，那就是直接模擬用戶鼠標操作去拖動滑塊實現(xiàn)旋轉(zhuǎn)驗證碼識別（其他驗證碼也可以使用這個思路）。簡單分析下下面的旋轉(zhuǎn)碼操作就可以發(fā)現(xiàn)滑塊滑到頭，圖片就旋轉(zhuǎn)了一圈360°，它們之間是線性關(guān)系，可以計算出這個比例關(guān)系，一旦確定了圖片的旋轉(zhuǎn)角度就可以根據(jù)這個比例關(guān)系換算出滑塊滑動的距離，然后模擬拖動滑塊就完成了旋轉(zhuǎn)驗證碼的驗證。

這種處理驗證碼的方式完全不需要去逆向分析前端代碼，完全是站在用戶的視角在操作，當然它顯得不夠極客，可能性能也稍差點，但是真的不會掉太多頭發(fā)，關(guān)鍵是它可以解決問題，不管黑貓白貓，能抓老鼠就是好貓。按照這個思路的話，只需要重點解決下面幾個問題：

截取圖片數(shù)據(jù)

這一步的目的是提取旋轉(zhuǎn)驗證碼圖片數(shù)據(jù)，用于接下來使用深度學習模型識別旋轉(zhuǎn)角度?？梢酝ㄟ^JavaScript代碼創(chuàng)建canvas畫布并繪制驗證碼圖像的方式來獲取圖片數(shù)據(jù)，如果你使用selenium、playwright這樣的自動化框架的話，它們都支持直接執(zhí)行js代碼并獲取返回結(jié)果。這里需要注意的地方，一是圖像元素需要設置允許跨域，否則無法獲取到圖片數(shù)據(jù)，而且設置跨域?qū)傩詴|發(fā)重新請求圖片，如果設置跨域后立刻繪制圖像是獲取不到數(shù)據(jù)的，需要等待響應圖片渲染完成。另外一個就是canvas.toDataURL需要指定圖片格式為png，因為jpeg是不支持透明背景的，使用jpeg格式會導致旋轉(zhuǎn)角度識別庫識別旋轉(zhuǎn)角度完全錯誤。

// img_selector表示驗證碼圖片選擇器
var imgelm=document.querySelector(img_selector);
// 設置允許跨域，否則無法獲取圖片數(shù)據(jù)
// TIP:設置跨域后會觸發(fā)重新請求圖片，
// 立刻獲取圖片尺寸結(jié)果為全0，需要等待一段時間重新獲取
imgelm.setAttribute("crossOrigin","anonymous");
var canvas = document.createElement('canvas');
var ctx = canvas.getContext('2d');
canvas.width=imgelm.naturalWidth;
canvas.height=imgelm.naturalHeight;
ctx.drawImage(imgelm, 0, 0);
// 注意：jpeg格式不支持透明背景，這里使用png格式
var dataURL = canvas.toDataURL('image/png');
return dataURL;

識別旋轉(zhuǎn)角度

關(guān)于旋轉(zhuǎn)角度識別，可以使用https://github.com/Starry-OvO/rotate-captcha-crack這個模型，這里通過運行server.py開啟一個web服務，通過調(diào)用接口，傳入圖片數(shù)據(jù)會返回識別出的旋轉(zhuǎn)角度。

（使用指導參考：https://cloud.tencent.com/developer/article/2418786）

不過，由于百度旋轉(zhuǎn)驗證碼圖片已經(jīng)升級，圖片全部使用AI生成，更不易識別，當前的模型識別成功率有點低，不過可以通過增加重試來規(guī)避這個問題，如果你對深度學習比較熟悉的話也可以使用它的模型重新訓練最新的驗證碼圖片。

另外，百度除了會出現(xiàn)旋轉(zhuǎn)驗證碼之外，有時候也會出現(xiàn)其他類型驗證，比如滑塊驗證碼，這種情況就需要同時處理滑塊驗證碼和旋轉(zhuǎn)驗證碼，思路也是一樣的，至于滑塊驗證碼的識別可以使用ddddocr這個庫（https://gitee.com/fkgeek/ddddocr），官網(wǎng)文檔給出了詳細的使用方法。

模擬拖動滑塊

不管是滑塊驗證碼還是旋轉(zhuǎn)驗證碼，識別出了圖片滑塊的距離、旋轉(zhuǎn)角度之后都可以簡單地通過線性關(guān)系得出拖動滑塊的距離，接下來就是模擬滑塊拖動指定距離就可以了，下面的js代碼實現(xiàn)了模擬拖動滑塊的功能。代碼中滑動距離僅給出示例，實際運行時請改為換算后的動態(tài)值。

() => {
    // selector：滑塊選擇器   offsetX: 滑動距離
	function slide(selector, offsetX) {
	    // 滑塊定位
		let slider = document.querySelector(selector);
		// 計算滑塊矩形區(qū)域?qū)亲鴺?		let rect = slider.getBoundingClientRect(),
			x0 = rect.x || rect.left,
			y0 = rect.y || rect.top,
			x1 = x0 + offsetX, 
			y1 = y0;
		// 模擬鼠標按下動作
		let mousedown = document.createEvent('MouseEvents');
		mousedown.initMouseEvent('mousedown', true, true, window, 0, x0, y0, x0, y0, false, false, false, false, 0, null);
		slider.dispatchEvent(mousedown);  
		
		//模擬鼠標拖動動作，將滑塊移動距離簡單拆分為4個相同距離的動作
		let mousemove = document.createEvent('MouseEvents');
		mousemove.initMouseEvent('mousemove', true, true, window, 0, x0+offsetX/4, y1, x0+offsetX/4, y1, false, false, false, false, 0, null);
		slider.dispatchEvent(mousemove);

		mousemove.initMouseEvent('mousemove', true, true, window, 0, x0+offsetX/2, y1, x0+offsetX/2, y1, false, false, false, false, 0, null);
		slider.dispatchEvent(mousemove);

		mousemove.initMouseEvent('mousemove', true, true, window, 0, x0+3*offsetX/4, y1, x0+3*offsetX/4, y1, false, false, false, false, 0, null);
		slider.dispatchEvent(mousemove);

		mousemove.initMouseEvent('mousemove', true, true, window, 0, x0+offsetX, y1, x0+offsetX, y1, false, false, false, false, 0, null);
		slider.dispatchEvent(mousemove);
		
	    // 模擬鼠標釋放動作
		let mouseout = document.createEvent('MouseEvents');
		mouseout.initMouseEvent('mouseup', true, true, window, 0, x1, y1, x1, y1, false, false, false, false, 0, null);
		slider.dispatchEvent(mouseout);
	}
	// 執(zhí)行滑塊拖動,以下distance和滑塊選擇器只是示例，根據(jù)實際情況進行調(diào)整
	var distance = 200;
	slide('div.passMod_slide-btn', distance);
}

最后，展示一下通過上面的思路使用playwright實現(xiàn)的旋轉(zhuǎn)驗證碼的識別過程，本次出現(xiàn)了兩次驗證碼，第一次是滑塊驗證碼，通過后又出現(xiàn)了旋轉(zhuǎn)驗證碼，可以發(fā)現(xiàn)旋轉(zhuǎn)驗證碼識別了3次才成功，就是因為模型對于最新的百度旋轉(zhuǎn)驗證碼圖片角度識別率變差導致的，實現(xiàn)上通過增加重試次數(shù)進行規(guī)避。經(jīng)測試，無界面模式也可以正常運行。

參考文獻：
[1]https://cloud.tencent.com/developer/article/2418786
[2]https://github.com/Starry-OvO/rotate-captcha-crack
[3]https://gitee.com/fkgeek/ddddocr
[4]https://blog.csdn.net/m0_58618019/article/details/132918404