整合營銷服務商

          電腦端+手機端+微信端=數據同步管理

          免費咨詢熱線:

          如何讓用戶選擇是否離開當前頁面?「JS篇」

          如何讓用戶選擇是否離開當前頁面?「JS篇」




          者: Peter醬

          轉發鏈接:https://mp.weixin.qq.com/s/o-YqWroltD_JISwQJasWZQ

          近幾年比較流行的一種驗證方式就是拖動驗證,可以在一定程度上避免過去驗證碼被破解的尷尬,下面小編就為大家分享一下這個驗證方式的js代碼

          $.fn.drag=function(options){

          var x, drag=this, isMove=false, defaults={

          };

          var options=$.extend(defaults, options);

          //添加背景,文字,滑塊

          var html='<div class="drag_bg"></div>'+

          '<div class="drag_text" onselectstart="return false;" unselectable="on">拖動滑塊驗證</div>'+

          '<div class="handler handler_bg"></div>';

          this.append(html);

          var handler=drag.find('.handler');

          var drag_bg=drag.find('.drag_bg');

          var text=drag.find('.drag_text');

          var maxWidth=drag.width() - handler.width(); //能滑動的最大間距

          //鼠標按下時候的x軸的位置

          handler.mousedown(function(e){

          isMove=true;

          x=e.pageX - parseInt(handler.css('left'), 10);

          });

          //鼠標指針在上下文移動時,移動距離大于0小于最大間距,滑塊x軸位置等于鼠標移動距離

          $(document).mousemove(function(e){

          var _x=e.pageX - x;

          if(isMove){

          if(_x > 0 && _x <=maxWidth){

          handler.css({'left': _x});

          drag_bg.css({'width': _x});

          }else if(_x > maxWidth){ //鼠標指針移動距離達到最大時清空事件

          dragOk();

          }

          }

          }).mouseup(function(e){

          isMove=false;

          var _x=e.pageX - x;

          if(_x < maxWidth){ //鼠標松開時,如果沒有達到最大距離位置,滑塊就返回初始位置

          handler.css({'left': 0});

          drag_bg.css({'width': 0});

          }

          });

          handler.ontouchstart(function(e){

          isMove=true;

          x=e.pageX - parseInt(handler.css('left'), 10);

          });

          //鼠標指針在上下文移動時,移動距離大于0小于最大間距,滑塊x軸位置等于鼠標移動距離

          $(document).ontouchmove(function(e){

          var _x=e.pageX - x;

          if(isMove){

          if(_x > 0 && _x <=maxWidth){

          handler.css({'left': _x});

          drag_bg.css({'width': _x});

          }else if(_x > maxWidth){ //鼠標指針移動距離達到最大時清空事件

          dragOk();

          }

          }

          }).ontouchend(function(e){

          isMove=false;

          var _x=e.pageX - x;

          if(_x < maxWidth){ //鼠標松開時,如果沒有達到最大距離位置,滑塊就返回初始位置

          handler.css({'left': 0});

          drag_bg.css({'width': 0});

          }

          });

          //清空事件

          function dragOk(){

          handler.removeClass('handler_bg').addClass('handler_ok_bg');

          text.text('驗證通過');

          drag.css({'color': '#fff'});

          handler.unbind('mousedown');

          $(document).unbind('mousemove');

          $(document).unbind('mouseup');

          }

          };

          喜歡就訂閱關注我吧,小編不定期分享前端的各種小知識哦

          來 源:志斌的python筆記

          作 者:志斌



          隨著時間的推移,技術的進步,字符驗證碼越來越容易被破解,所以,開發者開發了一種新的反爬蟲方式——滑塊驗證碼反爬蟲,來限制爬蟲程序。


          今天來跟大家分享一下如何解決驗證碼反爬蟲中的滑塊驗證碼反爬蟲。


          原理


          網站開發者們認為可以從行為方面來區別人類和計算機。例如:人們可以自由的完成拖拽、按下和釋放鼠標等操作,但是計算機卻不可以。


          破解


          01

          觀察滑塊和軌道的長度


          我們首先要打開網頁的開發者模式,來看一下滑塊和軌道的長度分別是多少。

          滑塊長度

          軌道長度

          從上面我們知道了滑塊的長度是50,軌道的長度是390,也就是說,滑塊需要滑動的距離是340。

          02

          模擬滑動


          在上面我們已經知道滑塊要滑動的距離了,那么我們現在就可以開始嘗試模擬滑動了。這里我們使用Selenium來完成滑塊滑動的工作。

          關于Selenium庫的安裝、配置和使用方法,可以看一下這篇文章學會Selenium,實現真正的可見即可爬!。

          模擬滑動主要分為以下兩步:

          1. 將鼠標定位到滑塊位置


          我們打開開發者模式,對滑塊進行檢查發現,滑塊的class屬性是hover,所以定位代碼如下:

          from selenium import webdriver
          driver=webdriver.Chrome(r'chromedriver.exe')
          url='http://www.porters.vip/captcha/sliders.html#'
          driver.get(url)
          hover=driver.find_element_by_css_selector('.hover')

          2. 移動鼠標到軌道終點

          Selenium庫中有一個ActionChains模塊,它可以模擬鼠標按住滑塊進行移動,然后進行釋放等操作,很符合我們的需求。代碼如下:

          from selenium import webdriver
          import time
          move=webdriver.ActionChains(driver)
          move.click_and_hold(hover).perform()
          time.sleep(1)
          move.move_by_offset(340,0)
          time.sleep(1)
          move.release().perform()


          小結


          1. 本文詳細介紹了滑塊驗證碼反爬蟲的原理和破解方法。
          2. 滑塊驗證碼是現在比較流行的一種驗證碼反爬蟲,所以大家如果想成為一名爬蟲工程師,那這是一個必備技能。
          3. 破解滑塊驗證碼主要分兩步:一、計算出滑塊要滑動的距離;二、讓滑塊進行移動。
          4. 本文僅供學習參考,不做它用。

          END

          留言贈書



          愛數據教育與北京大學出版社聯合開展 “ 留言送書 ” 活動,本次為大家選擇的書籍為:人工智能數學基礎


          【內容簡介】

          本書以零基礎講解為宗旨,面向學習數據科學與人工智能的讀者,通俗地講解每一個知識點,旨在幫助讀者快速打下數學基礎。

          第1 篇:數學知識基礎篇
          主要講述了高等數學基礎、微積分、泰勒公式與拉格朗日乘子法。

          第 2 篇:數學知識核心篇
          主要講述了線性代數基礎、特征值與矩陣分解、概率論基礎、隨機變量與概率估計。

          第 3 篇:數學知識提高篇
          主要講述了數據科學的幾種分布、核函數變換、熵與激活函數。

          第 4 篇:數學知識應用篇
          主要講述了回歸分析、假設檢驗、相關分析、方差分析、聚類分析、貝葉斯分析等內容。

          【作者簡介】

          唐宇迪,計算機專業博士,網易云課堂人工智能認證行家,51CTO學院講師,CSDN博客專家。

          李琳,河南工業大學副教授,在軟件工程、機器學習、人工智能和模式識別等領域有深入研究。

          侯惠芳,教授,解放軍信息工程大學通信與信息系統專業博士,擅長機器學習、大數據檢索、人工智能和模式識別等。

          王社偉,河南工業大學副教授,西北工業大學航空宇航制造專業博士,挪威科技大學訪問學者,對數字化制造、企業管理系統、機器學習、數據挖掘等有豐富的實戰經驗。



          本次福利活動將選取留言最走心的1位粉絲免費贈送上述書籍。下周日公布中獎者及書籍領取方式。期待大家的留言~


          【上周中獎者公布】


          我們會私下聯系你收集信息地址進行郵寄,注意查收,收到書籍后歡迎反饋哦~

          主站蜘蛛池模板: 日韩精品久久一区二区三区| 亚洲AV无码一区二区三区牲色| 文中字幕一区二区三区视频播放 | 国产福利一区二区三区视频在线 | 91一区二区在线观看精品| 亚洲国产AV无码一区二区三区| 国产精品无圣光一区二区| 日韩免费无码一区二区视频| 日韩精品一区二区三区中文精品| 亚洲乱码日产一区三区| 久久99精品免费一区二区| 精品无码中出一区二区| 亚洲中文字幕一区精品自拍| 人妻夜夜爽天天爽爽一区| 亚洲国产精品一区二区成人片国内 | 国产精品一区二区三区高清在线| 亚洲一区中文字幕| 国产成人AV一区二区三区无码| 香蕉视频一区二区三区| 久久国产三级无码一区二区| 亚洲片一区二区三区| 久久久人妻精品无码一区| 亚洲片一区二区三区| 日本高清成本人视频一区| 精品日本一区二区三区在线观看 | 在线观看亚洲一区二区| 日产精品久久久一区二区| 日韩精品中文字幕无码一区| 亚洲天堂一区在线| 无码av免费毛片一区二区| 色综合视频一区二区三区44| 日韩一区在线视频| 午夜精品一区二区三区在线观看| 亚洲日本一区二区三区在线不卡| 免费一区二区无码视频在线播放| 精品一区二区三区在线观看| 亚洲国产精品一区| 天天综合色一区二区三区| 精品乱码一区二区三区在线| 91一区二区三区| 精品人妻AV一区二区三区|