0.2.0 • Published 2 years ago
@leminnow/react-lemin-cropped-captcha v0.2.0
Table Of Contents
Getting Started
How can I get my captchaId ?
Select a puzzle captcha from your puzzle captchas
Copy your captchaId from your puzzle's captcha script source
How can I get my containerId ?
Click on Advanced Settings from the puzzle captcha of your choice
Copy your containerId from Captcha Div ID
Installation
Installation with npm:
npm install @leminnow/react-lemin-cropped-captchaInstallation with yarn:
yarn add @leminnow/react-lemin-cropped-captchaUsage Examples
Use LeminCroppedCaptchaContainer in your component
import {LeminCroppedCaptchaContainer} from "@leminnow/react-lemin-cropped-captcha";
function App() {
    return (
        <div>
            <form>
                <LeminCroppedCaptchaContainer
                    containerId={"..."}
                    captchaId={"CROPPED_..."}/>
            </form>
        </div>
    );
}Use LeminCroppedCaptchaContainer with Src in your component
import {LeminCroppedCaptchaContainer} from "@leminnow/react-lemin-cropped-captcha";
function App() {
    return (
        <div>
            <form>
                <LeminCroppedCaptchaContainer
                    containerId={"..."}
                    src={"https://api.leminnow.com/captcha/v1/cropped/CROPPED_..../js"}/>
            </form>
        </div>
    );
}Use captcha methods with Multiple Instances
import {leminCroppedCaptcha, LeminCroppedCaptchaContainer} from "@leminnow/react-lemin-cropped-captcha";
function getCaptchaValue() {
    const values = leminCroppedCaptcha.getCaptcha('CROPPED_...').getCaptchaValue()
}
function App() {
    return (
        <div>
            <form>
                <LeminCroppedCaptchaContainer
                    containerId={"..."}
                    captchaId={"CROPPED_..."}/>
            </form>
            <button onClick={getCaptchaValue}>Get captcha value</button>
        </div>
    );
}Use captcha methods with LeminCroppedCaptcha Object
import {LeminCroppedCaptcha, LeminCroppedCaptchaContainer} from "@leminnow/react-lemin-cropped-captcha";
const myCaptcha = new LeminCroppedCaptcha('...', 'CROPPED_...')
function getCaptchaValues() {
    const values = myCaptcha.getCaptchaValue();
}
function App() {
    return (
        <div>
            <form>
                <LeminCroppedCaptchaContainer
                    containerId={myCaptcha.containerId}
                    captchaId={myCaptcha.captchaId}/>
            </form>
            <button onClick={getCaptchaValues}>Get captcha values</button>
        </div>
    );
}Documentation
Click here to documentation for Lemin Cropped Captcha
Click here to developers guide
API
leminCroppedCaptcha Methods
| Name | Return Type | Parameter | Description | 
|---|---|---|---|
getCaptcha | CaptchaInstance | (CAPTCHA_KEY: Optional String) => | Returns the given CAPTCHA_KEY's captcha instance. If CAPTCHA_KEY is empty, it will return first captcha instance. | 
getInstances | CaptchaInstance{} | (CAPTCHA_KEY: Optional String) => | Returns all the instances of captchas | 
destroyAll | void | () => | Destroys all captchas on the page. | 
reloadAll | void | () => | Reload all captchas on the page. | 
LeminCroppedCaptcha Object Methods
| Name | Return Type | Parameter | Description | |
|---|---|---|---|---|
getCaptchaValue | {"answer": "answer","challenge_id": "challenge_id"} | () => | Returns the captcha value on the page for needed validation | |
isReady | boolean | () => | Returns the state of captcha | |
reloadPuzzle | void | () => | Reloads puzzle, you may use it in fail scenarios. | |
onLoad | void | (callbackFunction = function(){}) => | Calls the function when the captcha loaded. | |
loadPuzzleError | void | (callbackFunction = function(){}) => | Calls the function when the captcha loaded. | |
destroyCaptcha | void | () => | Destroys the captcha on the page | |
adjustSize | void | () => | ||
execute | Promise<{"answer": "answer","challenge_id": "challenge_id"}> | () => | It initiates invisible captcha programmatically; it's only applicable for Invisible Captcha! | |
display | void | () => | ||
getToken | void | () => | ||
loadPuzzleImage | void | () => | ||
setUserinfo | void | () => | ||
stopRefreshing | void | () => |