Authentication
TaskOn Embed SDK supports two primary authentication methods: Email and EVM wallet. All login requests are made via embed.login(request).
Overview
The SDK uses AuthType enum with two values:
"Email"- Email-based authentication"WalletAddress"- EVM wallet address authentication
Email Authentication
Email login is the simplest flow and fits most Web2 users.
Basic Usage
typescript
await embed.login({
type: "Email",
account: "user@example.com",
signature: serverSignature, // signed by your backend with project secret
timestamp: Date.now(),
});1
2
3
4
5
6
2
3
4
5
6
Complete Example
typescript
import { trackVisit } from "@taskon/embed";
async function loginWithEmail(email: string) {
const timestamp = Date.now();
const { signature } = await fetch("/api/auth/sign", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ account: email, timestamp }),
}).then(r => r.json());
await embed.login({
type: "Email",
account: email,
signature,
timestamp,
});
}1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
EVM Wallet Authentication
Best for Web3 users, identity is verified via cryptographic signature.
Basic Flow
- Get the wallet address (via site wallet integration or your own module)
- Ask your backend to generate a signature for
account + timestamp - Call
embed.login({ type: "WalletAddress", account, signature, timestamp, provider }) - The
providerparameter is required for wallet operations (EIP-1193 compatible)
Complete Example
typescript
import { trackVisit } from "@taskon/embed";
async function loginWithWallet(address: string, provider: any) {
const timestamp = Date.now();
const { signature } = await fetch("/api/auth/sign", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ account: address, timestamp }),
}).then(r => r.json());
await embed.login({
type: "WalletAddress",
account: address,
signature,
timestamp,
provider, // EIP-1193 compatible provider (e.g., window.ethereum)
});
}1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
OAuth Integration
The SDK supports OAuth integration for social logins:
typescript
const embed = new TaskOnEmbed({
baseUrl: "https://yourtaskondomain.com",
containerElement: "#taskon-container",
});
// The SDK automatically handles OAuth redirects for:
// - Twitter
// - Discord
// - Telegram
// - Reddit1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
Session Management
Check Authorization Status
typescript
// Check if email account has valid authorization cache
const emailAuthorized = await embed.isAuthorized("Email", "user@example.com");
// Check if wallet has valid authorization cache
const walletAuthorized = await embed.isAuthorized("WalletAddress", "0x1234...");
if (emailAuthorized) {
// No signature needed for email login
await embed.login({ type: "Email", account: "user@example.com" });
} else {
// Signature required for email login
const { signature, timestamp } = await getServerSignature("user@example.com");
await embed.login({
type: "Email",
account: "user@example.com",
signature,
timestamp,
});
}1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
Auto Re-login
typescript
// Optionally cache the latest login account/signature (mind security and expiration)
localStorage.setItem("taskon_last_login_account", "user@example.com");
localStorage.setItem("taskon_last_login_type", "Email");1
2
3
2
3
Logout
typescript
// Standard logout - keeps auth cache (recommended)
await embed.logout();
// Complete logout - clears all authorization cache (use sparingly)
await embed.logout({ clearAuth: true });
// Multi-account switching
await embed.logout(); // Keep current user's auth
await embed.login({
type: "Email",
account: "another@example.com",
// No signature needed if this account was authorized before
});1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
Best Practices
1) Graceful Error Handling
typescript
try {
await embed.login({
type: "Email",
account: "user@example.com",
signature: "invalid-signature",
});
} catch (error) {
console.error("Login failed:", error.message);
// Handle login failure
}1
2
3
4
5
6
7
8
9
10
2
3
4
5
6
7
8
9
10
2) Loading State Management
typescript
// Implement loading indicators and error toasts based on your UI needs1
3) UX Improvements
typescript
// Prompt users to install a wallet or guide them through authorization when needed1