Slider verification - personal test (JD)

   In everyday Web, perhaps App Sign in , There are various authentication mechanisms , Where the slider is verified , Is one of the most common . There are two main types of slider validation , Non jigsaw slides and jigsaw puzzles ( Notch splicing ） slider . In the puzzle slider , There are mainly two left Explicit and Canvas The background picture drawn （left Implicit ）

   The non jigsaw slider is mainly a relatively simple slide rail movement , Usually move right to the end . Just get the length of the slide rail and slider , You can calculate the sliding distance = Length of slide rail - Slider length

   Jigsaw puzzle ( Notch splicing ） Slider's left Explicit , Before moving , adopt The figure below 1 Know the slider left by : 10, The gap is ：97.8, The slide rail is 0 ; Move to coincide with the notch position , slider left by : 97, The gap is ：97.8, The slide rail is 87. The figure below 2

   Slip distance = slider left ( When moving coincident ） - slider left ( Before moving ） = Slide track

   therefore , We can call Selector obtain CSS style , Then use regular expressions to combine lambda Function to extract left Value , You can calculate the position of the notch .

mbk_style = sel.css('#missblock::attr("style")').get()
tbk_style = sel.css('#targetblock::attr("style")').get()
extract = lambda x: ''.join(re.findall('left: (\d+|\d+.\d+)px', x))
mbk_left = extract(mbk_style)
tbk_left = extract(tbk_style)
distance = float(tbk_left) - float(mbk_left)

   Canvas The background picture drawn （left Implicit ）, Because there is no left The change law of is visible , Take JD slider verification as an example , The general idea is as follows ：

One 、 adopt request.urlretrieve() Method , Get the small slider and the background image with notch respectively

Two 、 adopt cv2.imread（） Method Put the obtained two color pictures , Perform binary graying , The figure below 3
3、 ... and 、 adopt cv2.matchTemplate() Method , Calculate the approximate travel distance （ After many tests , It is found that this distance is a little offset from the actual distance , But not much ） You can slightly adjust the distance to the left .

Four 、 adopt ActionChains, Move the slider

   During the test, I found that , Even if the slider and notch Complete coincidence , But it can not pass the verification successfully . This is probably the reason for the detection mechanism of machine learning , because ActionChians Can't really move the mouse , So try to change it to call pyautogui.

   Although the call pyautogui after , The signal of the analog mouse can be completely provided to Web, But the same result was found after the first test , Can't pass validation . To solve this problem , You can try during the move , hold y The value of the shaft By fixing 0 Change it to from random.randint() Method to obtain a random number , Range value of the parameter , It depends on the width of the actual slide block , For example, the width is 6, It is suggested that 1 - 2.5 Between . Of course you can 1 Internal random fine tuning , use random.random() Method to get random values , The purpose is to simulate the real moving track of human beings as much as possible .

   Through adjustment y Change of axis , Finally, the detection mechanism of machine learning is successfully bypassed , Pass the verification . In the test , I've also tried if you don't shield webdriver Properties of , Can also be the , This proves that the mechanism is correct webdriver Detection of does not exist . Concrete demonstration , You can watch the demo video of my microblog , among user id / password Random filling , Just demonstrate and verify this part .

link : https://weibo.com/u/2203755810

chart 1

chart 2

chart 3