ALTCHA uses a proof-of-work mechanism to protect your website, APIs, and online services from spam and abuse. Unlike other solutions, ALTCHA is self-hosted, does not use cookies nor fingerprinting, does not track users, and is fully compliant with GDPR.
ALTCHA widget is distributed as a "Web Component" and supports all modern browsers.
npm install altcha
import altcha
in your main file:
import 'altcha';
or insert <script>
tag to your website:
<script async defer src="/altcha.js" type="module"></script>
CDN: https://cdn.jsdelivr.net/gh/altcha-org/altcha@main/dist/altcha.min.js
<altcha-widget>
tag in your forms<form>
<altcha-widget
challengeurl="https://..."
></altcha-widget>
</form>
See the configuration below or visit the website integration documentation.
See server documentation for more details.
Required options (at least one is required):
challengeurl
, provide the data here.Additional options:
onfocus
, onload
, onsubmit
).spamfilter
option. If enabled, it will block form submission and fail verification if the Spam Filter returns a negative classification. This effectively prevents submission of the form.spamfilter
to enable server-side verification.navigator.hardwareConcurrency || 8
).Development / testing options:
challengeurl
.To configure the widget programmatically, use the configure()
method:
document.querySelector('#altcha').configure({
challenge: {
algorithm: 'SHA-256',
challenge: '...',
salt: '...',
signature: '...',
},
strings: {
label: 'Verify',
},
});
Available configuration options:
export interface Configure {
auto?: 'onload' | 'onsubmit';
challenge?: {
algorithm: string;
challenge: string;
salt: string;
signature: string;
};
debug?: boolean;
expire?: number;
hidefooter?: boolean;
hidelogo?: boolean;
maxnumber?: number;
mockerror?: boolean;
name?: string;
refetchonexpire?: boolean;
spamfilter: boolean | SpamFilter;
strings?: {
error?: string;
footer?: string;
label?: string;
verified?: string;
verifying?: string;
waitAlert?: string;
};
test?: boolean | number;
verifyurl?: string;
workers?: number;
}
spamfilter
).state
changes.enum State {
ERROR = 'error',
VERIFIED = 'verified',
VERIFYING = 'verifying',
UNVERIFIED = 'unverified',
EXPIRED = 'expired',
};
Using events:
document.querySelector('#altcha').addEventListener('statechange', (ev) => {
// See enum State above
console.log('state:', ev.detail.state);
});
[!IMPORTANT]
Both programmatic configuration and event listeners have to called/attached after the ALTCHA script loads, such as within window.addEventListener('load', ...).
The widget integrates with ALTCHA's Spam Filter API to allow checking submitted form data for potential spam.
The Spam Filter API analyzes various signals in the submitted data to determine if it exhibits characteristics of spam. This non-invasive filtering helps reduce spam submissions without frustrating legitimate users.
The Spam Filter can be enabled with default configuration by setting the spamfilter
option to true
, or it can be customized using the following configuration schema:
interface SpamFilter {
email?: string | false;
expectedLanguages?: string[];
expectedCountries?: string[];
fields?: string[] | false;
ipAddress?: string | false;
timeZone?: string | false;
}
SpamFilter configuration options:
false
.false
.false
.By default, all text inputs and textareas within the parent form are spam-checked. To exclude a specific input, add the data-no-spamfilter
attribute. Alternatively, explicitly list the checked fields using the fields
config option.
See Contributing Guide and please follow our Code of Conduct.
MIT