https://github.com/nexuspipe/uvc-frontend
Frictionless CAPTCHAs that work.
https://github.com/nexuspipe/uvc-frontend
captcha captcha-library javascript nexusuvc svelte svelte3 svelte4 sveltejs sveltekit sveltekit-library typescript uvc
Last synced: about 1 month ago
JSON representation
Frictionless CAPTCHAs that work.
- Host: GitHub
- URL: https://github.com/nexuspipe/uvc-frontend
- Owner: NexusPIPE
- Created: 2023-09-15T20:11:36.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2024-01-15T19:27:03.000Z (over 1 year ago)
- Last Synced: 2024-10-11T12:41:02.198Z (7 months ago)
- Topics: captcha, captcha-library, javascript, nexusuvc, svelte, svelte3, svelte4, sveltejs, sveltekit, sveltekit-library, typescript, uvc
- Language: TypeScript
- Homepage: https://uvc.nexuspipe.com
- Size: 379 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
[](https://uvc.nexuspipe.com/)
# UVC SDK
The UVC SDK for SvelteKit, Svelte and Plain HTML.
## Table of Contents
- [UVC SDK](#uvc-sdk)
- [Table of Contents](#table-of-contents)
- [Installation](#installation)
- [Client Usage](#client-usage)
- [SvelteKit](#sveltekit)
- [Plain HTML](#plain-html)
- [With a preprocessor (like Parcel)](#with-a-preprocessor-like-parcel)
- [Event Listener](#event-listener)
- [Global-Scope Callback](#global-scope-callback)
- [Without a preprocessor](#without-a-preprocessor)
- [Options](#options)
- [Server Usage](#server-usage)
## Installation
```bash
pnpm i @nexusuvc/frontend
```
## Client Usage
### SvelteKit
```svelte
import UVC from '@nexusuvc/frontend';
console.log('done with ticket', e.detail)}
/>
```
### Plain HTML
#### With a preprocessor (like Parcel)
##### Event Listener
```html
import '@nexusuvc/frontend/vanilla';
const uvc = document.querySelector('#your-uvc');
uvc.addEventListener('completed', e => {
console.log('done with ticket', e.detail);
});
```
##### Global-Scope Callback
```html
import '@nexusuvc/frontend/vanilla';
// the completed function must live in the global scope - it's body cannot be passed to the event, and it cannot be something like console.log that doesn't directly live in the global scope
window.completedFunc = ticket => {
console.log('done with ticket', ticket);
};
```
#### Without a preprocessor
Same as above, but use `https://unpkg.com/@nexusuvc/frontend@^1.0.0/vanilla/index.js` instead of `@nexusuvc/frontend/vanilla`.
### Options
You can find the options type [here](https://github.com/NexusPIPE/uvc-frontend/blob/master/src/lib/sdk/Options.ts) under `export type UVCOptions = ...`
## Server Usage
```ts
/** Validation Request Function */
const performValidation = async (privateKey: string, ticket: string) =>
(await fetch(
`https://uvc.nexuspipe.com/uvc/evaluate/${encodeURIComponent(
privateKey,
)}/${encodeURIComponent(ticket)}`,
)
.then(r =>
r.ok
? r.json()
: {
success: false,
challenge_ts: '',
hostname: '',
'error-codes': [],
'internal-cause': new Error('Invalid response from UVC server'),
response: r,
},
)
.catch(e => ({
success: false,
challenge_ts: '',
hostname: '',
'error-codes': [],
'internal-cause': e,
}))) as Promise<
| {
success: false;
challenge_ts: '';
hostname: '';
'error-codes': number[];
'internal-cause'?: Error;
response?: Response;
}
| {
success: true;
challenge_ts: number;
hostname: string;
'error-codes': [];
}
>;
/** Validation Function */
const validate = async (privateKey: string, ticket: string) =>
(await performValidation(privateKey, ticket)).success;
```
You can implement this in any language, but the above is a TypeScript example.