Summary

The article outlines a method for automating the solution to GeeTest's slider CAPTCHA using JavaScript and image processing techniques.

Abstract

The article builds upon a previous discussion on bypassing slider CAPTCHAs with JavaScript and Puppeteer. It delves into a more efficient technique for solving GeeTest's slider CAPTCHA by extracting images from the website, performing image differencing to identify the puzzle piece's correct position, and using OpenCV for image processing to locate the puzzle hole. The process involves several steps, including loading and capturing images, applying a threshold and morphological operations to the difference image to eliminate noise and gaps, and calculating the precise position to move the slider. The author emphasizes the ease of filtering out a subtle shadow puzzle piece that serves no protective purpose. The article concludes with the assertion that GeeTest's slider CAPTCHA is not secure and may eventually be abandoned, while also providing the code for educational purposes on GitHub.

Opinions

The author believes that the shadow piece on the captcha image is intended to have a protective purpose but is actually irrelevant and easily filtered out.
The use of Puppeteer and JavaScript libraries like pixelmatch and OpenCV is advocated for their effectiveness in solving the slider CAPTCHA.
The author suggests that GeeTest's slider CAPTCHA is not a secure form of protection and may be discontinued in the future due to its vulnerability to automated solving techniques.
The article is written with an educational intent, encouraging responsible use of the provided code and techniques.
There is an acknowledgment that excessive attempts to solve the captcha may lead to it ceasing to work, hinting at potential countermeasures by the CAPTCHA provider.

How to solve GeeTest “slider CAPTCHA” with JS

My previous story on this topic was: How to bypass “slider CAPTCHA” with JS and Puppeteer

In this story, I will go further to solve slider captcha with a different technique. This technique will solve the slider captcha faster and more efficiently. My focus will be on GeeTest slider captcha, but you could apply it to any other similar slider captcha. I will show you how to bypass it in a few steps.

1. Get images

Let’s go to the GeeTest website. Our puppeteer script needs to wait a bit for images to load. When everything is loaded, the script will get the images from canvases.

With this code, we get the original image, captcha image and puzzle image. That’s all we need to make a diff and to know exactly where to move the slider.

Original image (left) vs captcha image (right)

On the captcha image, there is a subtle shadow puzzle piece. That shadow piece should have some protective purpose. It has no purpose at all. It’s easy to filter it out in our next step.

2. Picture diffing

There are few great js libraries for image processing and diffing. For diffing I used pixelmatch.

After we run diffing code, we will get the diff image that looks like this:

3. Locate the diff

Now that we have the diff image, we need to locate the x coordinate of the puzzle whole in the diff image. In this step, I will use OpenCV js library for image processing. We have a few options:

Browser version: opencv.js
Nodejs bindings for native OpenCV: opencv4nodejs
Precompiled OpenCV to wasm for Nodejs: opencv-wasm

Since I’m running code in Node and I don’t want to install and compile OpenCV, I decided to use opencv-wasm.

We need to translate that diff image into something better. So let’s apply threshold to eliminate all noise, erode to fill all white gaps and dilate to revert the effects of erosion after filling all the gaps in the image.

Now it’s time to find the center of that puzzle whole.

We found the position where we need to move the puzzle piece.

4. Move slider to the position

Moving slider is not easy as it seems. We have one more challenge. Somewhere at the beginning, puzzle jumps with some random offset. It means that the slider position and the puzzle position are not in sync.

We need to move slider 2 times. The first move will bring the puzzle closer to the final position. Then we calculate the puzzle position and how much we need to move it again. The second move will bring the puzzle exactly where it needs to be in order to solve GeeTest slider captcha.

All code for solving GeeTest “slider CAPTCHA” is uploaded to GitHub repo. Feel free to copy anything you like. This is for educational purpose, use Puppeteer responsibly and have fun. If you try to solve captcha too many times it may stop working.

Conclusion

GeeTest will eventually figure out how to make this slider CAPTCHA harder to solve or they will drop this silly slider CAPTCHA because it’s not secure at all.

Thanks for reading! If you like the article, give a clap, or two, or 50👏. Leave a comment below if you have any questions or say hi on Twitter.