POWER CAPTCHA is compatible with all systems that can communicate with external interfaces. Your website therefore does not need to fulfill any special requirements to use POWER CAPTCHA. If you integrate POWER CAPTCHA into your website, your website interacts with our server and we can protect your website. To install the application, you must first secure a license. With your license, you will automatically receive an API key to access our interfaces. You can then integrate POWER CAPTCHA into your website / application in various ways: If you use WordPress or TYPO3, simply download our plugin or extension and follow our installation guides. You do not need any programming skills. You can also integrate POWER CAPTCHA via JavaScript and verify the token on the server using PHP or Java, for example. You can also use our templates for this.
You can download the POWER CAPTCHA extension for your TYPO3 installation directly from TYPO3. Alternatively, you can also find the extension and a quick guide to integration in the GitHub Repository. Our integration is compatible with TYPO3 versions 11.5 LTS and 12.4 LTS and protects forms that you create with the “Form” or “Powermail” extensions. Through the integration, we provide a new field that you simply add to your forms.
At the bottom of this page you will find step-by-step instructions for installation with WordPress and JavaScript as well as for token verification with PHP or via the Verifiy interface. You can use these directly or adapt them to your needs.
You can use POWER CAPTCHA to protect not only classic websites or stores, but also various systems that have a cloud interface. In principle, POWER CAPTCHA is compatible with all systems that can communicate with external interfaces. Here, for example, you can find integration instructions for integration into the CRM software Vtiger.
When you purchase a license, you automatically get a customer account on our website. If you want to configure POWER CAPTCHA (Professional and Enterprise versions), you can make the desired settings in your account settings. Alternatively, you can start with our default settings. You can find some configuration examples on the Functions page.
You would like to know how your website communicates with our server? Learn more in our free whitepaper!
How to install the WordPress plugin
To install the WordPress plugin, first download the plugin as a ZIP file in our customer area. Then go to the administration area / dashboard of WordPress and click on the menu item Plugins > Install. Click on the button “Upload Plugin” and select the ZIP archive you have downloaded from our website. Then click on “Install now”. After the upload and installation, a page will open where you can activate our POWER CAPTCHA plugin.
After you have activated the plugin, you can configure it. To do this, go to Settings > POWER CAPTCHA in the administration area of WordPress and enter your API and Secret key in the corresponding fields under “General settings”. You can get both keys in the customer area of our website. Under “Integration settings” you can select for which plugin or page area you want to activate POWER CAPTCHA.
The item “Enterprise settings” is only relevant if you use an Enterprise license and operate a local POWER CAPTCHA instance (instead of using the application as a cloud solution (standard)). In this case you have the option to enter the URLs to your locally hosted instance and to your local JavaScript. Then all requests will go to your own instance instead of our server. If you don’t run your own instance, all fields under “Enterpise settings” need to remain empty. When all settings are edited, click on “Save changes”. POWER CAPTCHA now protects the plugins / areas you have selected.
Status: June 2024, subject to change.
Frontend integration with HTML
To integrate POWER CAPTCHA in the frontend with HTML, first include our JavaScript in the <head> element:
<script src="https://cdn.power-captcha.com/v1/power-captcha-1.2.2.min.js" type="text/javascript"></script>
Add a div element to the form you want to protect; the widget is displayed within this element. The div element must contain at least the attributes data-pc-sitekey=”yourSiteKey” and data-pc-client-uid=”uniqueClientId”. The unique client ID can be based on the client’s IP address, for example. It is important that the client can be uniquely identified via the ID and that the same client ID is passed for token verification. Example:
<form method="post" action="submit.php">
...
<div data-pc-sitekey="5gVoymQWRcyRQyJUxEqSdodfsK9vJJJs"
data-pc-client-uid="<?php echo hash('sha256', $_SERVER['REMOTE_ADDR']); ?>">
</div>
...
</form>
If you have an Enterprise license, you can add the data-pc-user attribute to the input field with the user name / email address for additional protection. Example:
<input name="username" type="text" required="required" data-pc-user="" />
A login form protected with POWER CAPTCHA might look like this:
<form method="post" action="submit.php">
<label for="username">Username:</label><br />
<input type="text" id="username" name="username" data-pc-user /><br />
<label for="password">Password:</label><br />
<input type="password" id="password" name="password" />
<div data-pc-sitekey="5gVoymQWRcyRQyJUxEqSdodfsK9vJJJs"
data-pc-client-uid="<?php echo hash('sha256', $_SERVER['REMOTE_ADDR']); ?>">
</div>
<input type="submit" value="submit" />
</form>
After the security check by the POWER CAPTCHA API, a field with a token is added to the form. Afterwards, check this token in the backend (see “Token verification”).
By default, the POWER CAPTCHA widget is always displayed and the security check starts automatically as soon as the form is filled out (focus event). If you add the attribute data-pc-user to a field, the check only starts after the field has been filled in.
However, you can configure the display and check behaviour individually. You can choose between three check modes, e.g. to switch off the automatic security check or only display the widget when it is necessary. You can configure the check mode using the data-pc-check-mode attribute. You can choose between the values ‘auto’, ‘hidden’ or ‘manu’. Each value stands for a specific check mode:
| Check mode | Description |
|---|---|
|
auto |
The widget is displayed by default. The security check starts as soon as the form is filled in or after the field (e.g. user name or e-mail address) has been filled in. A manual click on the widget is only necessary if a captcha also needs to be solved. |
|
hidden |
The widget is not initially displayed. The security check starts as soon as the form is filled in or after the field (e.g. user name or e-mail address) has been filled in. If the check returns that a captcha must be solved, the widget is displayed. |
|
manu |
The widget is always displayed. POWER CAPTCHA only starts the security check after a manual click on the widget. |
Here is an example of showing how to hide the widget (check mode hidden):
<form method="post" action="submit.php">
...
<div data-pc-sitekey="5gVoymQWRcyRQyJUxEqSdodfsK9vJJJs"
data-pc-client-uid="<?php echo hash('sha256', $_SERVER['REMOTE_ADDR']); ?>"
data-pc-check-mode="hidden">
</div>
<input type="submit" value="submit" />
</form>
How to verify the POWER CAPTCHA token on the server
Before you evaluate or save the content of your form in the backend, you should verify the POWER CAPTCHA token.
To do this, the token from the form ($_POST[“pc-token”]) and your secret key must be passed to our interface https://api.power-captcha.com/pcu/v1/verify as JSON, and in the header your sitekey must be present in the X-API-Key field.
The interface will return a JSON and the “success” field will say if the token was successfully verified. Afterwards you can evaluate your form as usual.
Here is a sample code how you can verify a token with PHP:
Here is a sample code how you can verify a token with PHP:
<?php
if(isset($_POST['pc-token']) && !empty($_POST['pc-token'])) {
$curl = curl_init('https://api.power-captcha.com/pcu/v1/verify');
curl_setopt($curl, CURLOPT_RETURNTRANSFER, TRUE);
curl_setopt($curl, CURLOPT_POST, TRUE);
curl_setopt($curl, CURLOPT_HTTPHEADER, array(
'X-API-Key: 5gVoymQWRcyRQyJUxEqSdodfsK9vJJJs', // your api key
'Content-Type: application/json'
));
curl_setopt($curl, CURLOPT_POSTFIELDS, json_encode(array(
'secret' => 'q5jBZojDfaQFzPGyhmAEFgz6C5j3NsjJ', // your secret key
'token' => $_POST['pc-token'],
'clientUid' => hash('sha256', $_SERVER['REMOTE_ADDR']), // unique client id (same value as in the data-client-uid attribute)
'name' => $_POST['username'] // field which was marked by 'data-pc-user' (optional)
)));
$response = json_decode(curl_exec($curl));
curl_close($curl);
if($response->success) {
echo "Token was successfully verified.";
// add your form logic
} else {
echo "Error: Token verfification failed.";
}
} else {
echo "Error: Token was missing in POST request.";
}
?>
API interface for token verification
After you submit your form, the token needs to be verified in your backend. To do this, you pass the token and some additional parameters via JSON to our Verifiy interface so that we can check if the captcha was solved correctly or if the alternative email authentication had a positive result. The Verifiy interface is called via the following URL: https://api.power-captcha.com/pcu/v1/verifiy.
In the header, the X-API-Key value must be set with your API key when called, and in the request body, the token and additional parameters must be POSTed to our interface as JSON.
{
"secret": "{secret-key}",
"token": "{token}",
"clientUid": "{client-uid}",
"name": "{username}"
}
Add your secret key in the parameter “secret”. You can find your secret key in your account. The parameter “token” contains the token which was generated by our JavaScript. The token can be found in the POST/GET field “pc-token”. The “clientUid” parameter must contain the same unique client ID that has been assigned in the form. It is used to check whether the token was originally created for this client ID. If you have marked a field with “data-pc-user” in the frontend, you have to pass the value of this field in the parameter “name” to our verifiy interface to protect a username / email address.
{
"success": true,
"errors": []
}
If the “success” field is set to “true”, then the verification was successful (token is valid) and you can continue with the evaluation of your form. If the “success” field is set to “false”, then the token is either invalid or the request is structured incorrectly. In this case the evaluation of the form should be stopped immediately, because the token could not be verified by POWER CAPTCHA. If the request is structured incorrectly, a list with the following error codes appears in the “errors” field:
| Error Code | Description |
|---|---|
|
missing_token |
No token or an empty token was provided with the request. |
|
missing_secret |
No secret key was supplied with the request. |
|
invalid_secret |
The secret key is invalid or does not match the API key. |
|
invalid_token |
The token is invalid. |
Enter a test name and click on the security checkbox to test POWER CAPTCHA. You can then submit the form.
Test now
With our demo you can simulate the application on your website / app with fictitious data. You can find more information about the demo and additional test forms on our demo page.
Get started with POWER CAPTCHA
You want to use POWER CAPTCHA on your website? Then get your license here and follow our step-by-step instructions.
POWER CAPTCHA
About Us
Contact
© 2024 POWER CAPTCHA by Uniique AG – Alle Rechte vorbehalten | All Rights Reserved