API Reference
The TaskOn Embed SDK provides a comprehensive API to integrate TaskOn into your application with ease.
Core Class
TaskOnEmbed
The main embed component class responsible for managing the iframe and user interactions.
typescript
import { TaskOnEmbed } from "@taskon/embed";
const embed = new TaskOnEmbed({
baseUrl: "https://yourdomain.com",
containerElement: "#taskon-container",
});
// Initialize
await embed.init();
// Login
await embed.login({
type: "Email",
account: "user@example.com",
signature: serverSignature,
timestamp: Date.now(),
});
// Check authorization status
const isAuthorized = await embed.isAuthorized("Email", "user@example.com");
// Logout with options
await embed.logout(); // Keep auth cache (default and recommend)
// await embed.logout({ clearAuth: true }); // Clear auth cache
// Clean up
embed.destroy();1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
Analytics Function
trackVisit()
Optional conversion analytics tracking (only use if needed).
typescript
import { trackVisit } from "@taskon/embed";
// Only if you need TaskOn conversion rate analysis
await trackVisit(); // For anonymous users
// or
await trackVisit("Email", "user@example.com"); // For known users1
2
3
4
5
6
2
3
4
5
6
Node.js Utilities
signMessage()
Server-side signature generation for authentication.
typescript
import { signMessage } from "@taskon/embed/node";
const { signature, timestamp } = signMessage(
clientId,
"Email", // or "evm" for wallet addresses
account,
privateKey
);1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
Type Definitions
The SDK ships with complete TypeScript type definitions:
typescript
import type {
TaskOnEmbedConfig,
LoginParams,
AuthType,
AuthUser,
TaskOnEmbedEvents,
} from "@taskon/embed";1
2
3
4
5
6
7
2
3
4
5
6
7
Event Handling
The SDK extends EventEmitter for iframe communication:
typescript
// Listen for authentication requirements
embed.on("loginRequired", () => {
console.log("User authentication required");
// Trigger your login flow
});
// Listen for route changes
embed.on("routeChanged", fullPath => {
console.log("Route changed to:", fullPath);
// Optional: Sync with external URL
});1
2
3
4
5
6
7
8
9
10
11
2
3
4
5
6
7
8
9
10
11
Quick Navigation
| Feature | API | Description |
|---|---|---|
| Initialize | new TaskOnEmbed(config) | Create embed instance |
embed.init() | Initialize iframe | |
| Auth | embed.login(params) | User authentication |
embed.logout(options?) | User logout with auth cache control | |
embed.isAuthorized(type, account) | Check authorization status | |
| Navigation | embed.setRoute(path) | Set internal route |
embed.currentRoute | Get current route | |
| Management | embed.updateSize(width, height) | Update iframe size |
embed.destroy() | Clean up resources | |
| Events | embed.on('loginRequired', handler) | Listen for auth requirements |
embed.on('routeChanged', handler) | Listen for route changes | |
| Analytics | trackVisit(type?, account?) | Conversion tracking (optional) |
| Server | signMessage(id, type, account, key) | Generate authentication signature |
Complete Example
typescript
import { TaskOnEmbed, trackVisit } from "@taskon/embed";
// Optional: Track page visit for conversion analytics
// await trackVisit(); // For anonymous users
// Create instance
const embed = new TaskOnEmbed({
baseUrl: "https://yourdomain.com",
containerElement: "#taskon-container",
});
// Initialize
await embed.init();
// Set up event listeners
embed.on("loginRequired", async () => {
// Trigger your login flow when TaskOn requires authentication
console.log("Authentication required");
});
embed.on("routeChanged", fullPath => {
console.log("Route changed to:", fullPath);
// Optional: Sync with your external URL
});
// Login when user authenticates in your system
const email = "user@example.com";
const isAuthorized = await embed.isAuthorized("Email", email);
if (!isAuthorized) {
// Get signature from your server
const { signature, timestamp } = await getServerSignature(email);
await embed.login({
type: "Email",
account: email,
signature,
timestamp,
});
} else {
// Already authorized, login without signature
await embed.login({
type: "Email",
account: email,
});
}
// Logout when needed
// await embed.logout();
// Clean up when component unmounts
// embed.destroy();1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
Learn More
- Getting Started Guide - Complete integration walkthrough
- Authentication Guide - Authentication implementation details
- Configuration Options - All configuration options
- Live Demo - Working code examples