@redeyed_/sentinel-angular

An Angular component for the Redeyed Sentinel CAPTCHA. Drop a privacy-first, bot-resistant human check into any Angular app with a single tag.

Sentinel is free to use, but it needs keys. Create a free Site Key and Secret Key at https://redeyed.com/developers.

Install

npm install @redeyed_/sentinel-angular
# @angular/core >=16, @angular/common >=16 and rxjs >=7 are peer dependencies

Use as a standalone component (Angular 16+)

import { Component } from '@angular/core';
import { SentinelCaptchaComponent } from '@redeyed_/sentinel-angular';

@Component({
  selector: 'app-signup',
  standalone: true,
  imports: [SentinelCaptchaComponent],
  template: `
    <redeyed-sentinel-captcha
      [siteKey]="'YOUR_PUBLIC_SITE_KEY'"
      (verify)="onVerify($event)"
      (error)="onError($event)"
    ></redeyed-sentinel-captcha>
  `,
})
export class SignupComponent {
  onVerify(token: string) {
    // Send `token` to YOUR server, then verify it (see "Server-side verification").
    console.log('got token', token);
  }

  onError(err: Error) {
    console.error('Sentinel failed to load', err);
  }
}

Use via the NgModule (non-standalone apps)

import { NgModule } from '@angular/core';
import { SentinelCaptchaModule } from '@redeyed_/sentinel-angular';

@NgModule({
  imports: [SentinelCaptchaModule],
})
export class AppModule {}

Inputs

Input	Type	Required	Description
siteKey	string	yes	Public site key from redeyed.com/developers.
widget	string	no	Widget variant (data-widget).
theme	string	no	Theme, e.g. light / dark (data-theme).
scheme	string	no	Colour scheme (data-scheme). Includes premium midnight / aurora.
width	string	no	Widget width, e.g. full / 100% / 340px (data-width).
difficulty	string | number	no	Challenge strength: easy/medium/hard/max or 1-6 (data-difficulty).
baseUrl	string	no	Sentinel host. Defaults to https://redeyed.com.

If siteKey is missing, the component renders nothing and logs a console.warn.

Outputs

Output	Payload	When
verify	string	The user solved the CAPTCHA; payload is the token.
error	Error	The Sentinel script failed to load.

How it works

The component loads {baseUrl}/sentinel.js once per page (it is injected only if not already present) and renders, inside its host element:

<div class="sentinel-captcha" data-sitekey="..."></div>

When solved, the Sentinel widget injects a hidden sentinel-token input and dispatches a bubbling sentinel:solved DOM event. This component listens for that event and re-emits the token via (verify). All document access goes through Angular's DOCUMENT token and Renderer2, so it is SSR / Angular Universal safe.

Server-side verification

Never put your Secret Key in the client. Verify the token from your own backend:

POST https://redeyed.com/sentinel/siteverify
Content-Type: application/json

{ "secret": "YOUR_SECRET_KEY", "response": "TOKEN_FROM_VERIFY_OUTPUT" }

You may also include an optional "remoteip" field with the end user's IP. The check passes when the response has success === true; the response also carries outcome and score.

Both keys come from the Redeyed Lab → Sentinel → Sites. The Secret Key is shown once and stays server-side.

Build (contributors)

Source ships under src/. To produce the dist/ package with ng-packagr:

npm install
npm run build   # ng-packagr -p ng-package.json

Changelog

• 1.0.1 — Add width input (data-width) and midnight / aurora schemes.

License

MIT © 2026 Redeyed Corporation