What is React Slide Captcha?

React Slide Captcha is a TypeScript-based React component that provides a sliding puzzle captcha for web applications. It helps protect your MCP servers from automated bot attacks by requiring users to solve a simple puzzle before submitting a form or accessing certain resources.

How do I install React Slide Captcha?

You can install React Slide Captcha using npm with the command: npm i -S react-slide-captcha

What dependencies are required for React Slide Captcha?

React Slide Captcha requires react and react-dom.

How do I use React Slide Captcha in my project?

Import the component and its CSS file, then use the <SlideCaptcha> component in your JSX code. You need to provide puzzleUrl, bgUrl and onRequest properties.

Can I customize the appearance of the captcha?

Yes, you can customize the appearance by providing different URLs for the puzzle and background images, and by using the various styling properties such as containerClassName, style, tipsText, and tipsStyle.

What is the onRequest property used for?

The onRequest property is a callback function that is called when the user attempts to solve the captcha. It receives the validated value (number), a success handler, and a failure handler. Use this to verify the solution on your server.

Is React Slide Captcha mobile-friendly?

Yes, React Slide Captcha is designed to be responsive and works well on mobile devices.

What license is React Slide Captcha released under?

React Slide Captcha is released under the MIT license.

What are MCP Servers?

MCP (Model Context Protocol) server acts as a bridge, allowing AI models to access and interact with external data sources and tools.

How does UBOS relate to React Slide Captcha?

UBOS is a full-stack AI Agent Development Platform. React Slide Captcha can be used to protect MCP servers, which are crucial for AI Agent development and deployment within the UBOS ecosystem.