溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

使用puppeteer破解極驗的滑動驗證碼

發(fā)布時間:2020-09-28 17:00:04 來源:腳本之家 閱讀:471 作者:YDJFE 欄目:web開發(fā)

基本的流程:

1. 打開前端網(wǎng),點擊登錄。

2. 填寫賬號,密碼。

3. 點解驗證按鈕,通過滑動驗證,最后成功登陸。

代碼實現(xiàn):

github上可以checkout。

具體代碼如下所示:

run.js

const puppeteer = require('puppeteer');
const devices = require('puppeteer/DeviceDescriptors');
const iPhone = devices['iPhone 6 Plus'];
let timeout = function (delay) {
  return new Promise((resolve, reject) => { 
   setTimeout(() => { 
     try {
      resolve(1)
     } catch (e) {
      reject(0)
     }
   }, delay);
  })
 }
 let page = null
 let btn_position = null
 let times = 0 // 執(zhí)行重新滑動的次數(shù)
 const distanceError = [-10,2,3,5] // 距離誤差
 async function run() {
 const browser = await puppeteer.launch({
  headless:false //這里我設置成false主要是為了讓大家看到效果,設置為true就不會打開瀏覽器
 });
 page = await browser.newPage();
 // 1.打開前端網(wǎng)
 await page.emulate(iPhone);
 await page.goto('https://www.qdfuns.com/');
 await timeout(1000);
 // 2.打開登錄頁面
 page.click('a[data-type=login]')
 await timeout(1000);
 // 3.輸入賬號密碼
 page.type('input[data-type=email]','你的賬號')
 await timeout(500);
 page.type('input[placeholder=密碼]','你的密碼')
 await timeout(1000);
 // 4.點擊驗證
 page.click('.geetest_radar_tip')
 await timeout(1000);
 btn_position = await getBtnPosition();
 // 5.滑動
 drag(null)
 }
 /**
 * 計算按鈕需要滑動的距離 
 * */ 
 async function calculateDistance() {
 const distance = await page.evaluate(() => {
 // 比較像素,找到缺口的大概位置
 function compare(document) {
  const ctx1 = document.querySelector('.geetest_canvas_fullbg'); // 完成圖片
  const ctx2 = document.querySelector('.geetest_canvas_bg'); // 帶缺口圖片
  const pixelDifference = 30; // 像素差
  let res = []; // 保存像素差較大的x坐標
  // 對比像素
  for(let i=57;i<260;i++){
  for(let j=1;j<160;j++) {
   const imgData1 = ctx1.getContext("2d").getImageData(1*i,1*j,1,1)
   const imgData2 = ctx2.getContext("2d").getImageData(1*i,1*j,1,1)
   const data1 = imgData1.data;
   const data2 = imgData2.data;
   const res1=Math.abs(data1[0]-data2[0]);
   const res2=Math.abs(data1[1]-data2[1]);
   const res3=Math.abs(data1[2]-data2[2]);
    if(!(res1 < pixelDifference && res2 < pixelDifference && res3 < pixelDifference)) {
    if(!res.includes(i)) {
     res.push(i);
    }
    } 
  }
  }
  // 返回像素差最大值跟最小值,經(jīng)過調試最小值往左小7像素,最大值往左54像素
  return {min:res[0]-7,max:res[res.length-1]-54}
 }
 return compare(document)
 })
 return distance;
 }
 /**
 * 計算滑塊位置
 */
 async function getBtnPosition() {
 const btn_position = await page.evaluate(() => {
 const {clientWidth,clientHeight} = document.querySelector('.geetest_popup_ghost')
 return {btn_left:clientWidth/2-104,btn_top:clientHeight/2+59}
 })
 return btn_position;
 }
 /**
 * 嘗試滑動按鈕
 * @param distance 滑動距離
 * */ 
 async function tryValidation(distance) {
 //將距離拆分成兩段,模擬正常人的行為
 const distance1 = distance - 10
 const distance2 = 10
 page.mouse.click(btn_position.btn_left,btn_position.btn_top,{delay:2000})
 page.mouse.down(btn_position.btn_left,btn_position.btn_top)
 page.mouse.move(btn_position.btn_left+distance1,btn_position.btn_top,{steps:30})
 await timeout(800);
 page.mouse.move(btn_position.btn_left+distance1+distance2,btn_position.btn_top,{steps:20})
 await timeout(800);
 page.mouse.up()
 await timeout(4000);
 // 判斷是否驗證成功
 const isSuccess = await page.evaluate(() => {
 return document.querySelector('.geetest_success_radar_tip_content') && document.querySelector('.geetest_success_radar_tip_content').innerHTML
 })
 await timeout(1000);
 // 判斷是否需要重新計算距離
 const reDistance = await page.evaluate(() => {
 return document.querySelector('.geetest_result_content') && document.querySelector('.geetest_result_content').innerHTML
 })
 await timeout(1000);
 return {isSuccess:isSuccess==='驗證成功',reDistance:reDistance.includes('怪物吃了拼圖')}
 }
 /**
 * 拖動滑塊
 * @param distance 滑動距離
 * */ 
 async function drag(distance) {
 distance = distance || await calculateDistance();
 const result = await tryValidation(distance.min)
 if(result.isSuccess) {
 await timeout(1000);
 //登錄
 console.log('驗證成功')
 page.click('#modal-member-login button')
 }else if(result.reDistance) {
 console.log('重新計算滑距離錄,重新滑動')
 times = 0
 await drag(null)
 } else {
 if(distanceError[times]){
  times ++
  console.log('重新滑動')
  await drag({min:distance.max,max:distance.max+distanceError[times]})
 } else {
  console.log('滑動失敗')
  times = 0
  run()
 }
 }
 }
 run()
package.json
{
 "name": "demo",
 "version": "1.0.0",
 "dependencies": {
 "puppeteer": "^1.0.0"
 }
}

運行

1. 將這個兩個文件保存到文件夾下面,終端切換到當前路徑下

2. npm i

3. 補上前端網(wǎng)的賬號,密碼

4. node run

演示

下圖演示可以分為四步:

1. 打開登陸頁面,輸入事先寫好的賬號密碼。

2. 第一次拖動滑塊提示“被怪獸吃了”,所以重新計算了新的圖片的缺口距離。

3. 第二,三次拖動提示“沒正確合拼”,所以重新拖動。

4. 驗證成功,登錄。

(請將鼠標放到gif上查看演示效果,或者請拖到新窗口打開gif)

使用puppeteer破解極驗的滑動驗證碼 

說明

1. 滑動驗證有三個canvas,其中只需要 classname為‘geetest_canvas_fullbg'以及‘geetest_canvas_bg'的進行像素差對比。ps:前者是完整圖片,后者是帶缺口的圖片。

使用puppeteer破解極驗的滑動驗證碼 

2. 每個帶缺口的圖片都有一塊誤導的陰影,所以對比像素差的時候,計算出的距離分別是誤導陰影以及缺口的。因此,滑動距離的取值,我取‘{min:res[0]-7,max:res[res.length-1]-54}'。當缺口比誤導陰影靠左時, min(距離最小值) 值就是滑動距離,否則就是 max(距離最大值)減去滑塊寬度 。

使用puppeteer破解極驗的滑動驗證碼 

3. 滑動結果分三種情況:驗證成功,被吃了,失敗。 “被吃了” 會重新請求圖片,所以重新計算了距離再滑動; “失敗” 則重新滑動,如果執(zhí)行 4 次依然失敗,則重新run整個流程。

總結

以上所述是小編給大家介紹的使用puppeteer破解極驗的滑動驗證碼,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對億速云網(wǎng)站的支持!

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內容(圖片、視頻和文字)以原創(chuàng)、轉載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權內容。

AI