frontend/packages/client-sdk/README.md
🚀 Secure and efficient communication solution designed for iframe micro-frontend architecture
# Using npm
npm install @zjy365/sealos-desktop-sdk
# Using pnpm
pnpm add @zjy365/sealos-desktop-sdk
# Using yarn
yarn add @zjy365/sealos-desktop-sdk
import { createMasterAPP } from '@zjy365/sealos-desktop-sdk/master';
useEffect(() => {
// Configure allowed domains (recommend using specific domains in production)
const cleanup = createMasterAPP(['https://app.example.com']);
return cleanup; // Cleanup on component unmount
}, []);
import { createSealosApp, sealosApp } from '@zjy365/sealos-desktop-sdk';
useEffect(() => {
// Initialize SDK
const cleanup = createSealosApp();
return cleanup;
}, []);
// Get user information
const getUserInfo = async () => {
try {
const session = await sealosApp.getSession();
console.log('User info:', session.user);
} catch (error) {
console.error('Failed to get user info:', error);
}
};
// Get language settings
const getLanguage = async () => {
const { lng } = await sealosApp.getLanguage();
console.log('Current language:', lng);
};
// Get user session information
const session = await sealosApp.getSession();
console.log(session.user.name); // Username
console.log(session.user.id); // User ID
// Get current language settings
const { lng } = await sealosApp.getLanguage();
// lng: 'zh' | 'en' | other language codes
// Sub-app listens to main app events
const unsubscribe = sealosApp.addAppEventListen('user-update', (userData) => {
console.log('User info updated:', userData);
});
// Sub-app sends events to main app
await sealosApp.runEvents('app-ready', { appId: 'my-app' });
// Cleanup event listeners
unsubscribe();
graph LR
A[Sub App] -->|postMessage| B[Main Desktop App]
B -->|postMessage| A
A -->|uuid identifier| B
B -->|same uuid response| A
# 1. Install development tools
npm i -g yalc nodemon
# 2. Start development mode
npm run dev
# 3. Link to local project
npm run link-sdk
# 4. Unlink
npm run unlink-sdk
constants/api.tssrc/master.tssrc/app.ts// Recommended production configuration
const allowedOrigins = ['https://your-app-domain.com', 'https://another-app.com'];
createMasterAPP(allowedOrigins);
| API | Parameters | Return Value | Description |
|---|---|---|---|
getSession() | - | Promise<SessionV1> | Get user session information |
getLanguage() | - | Promise<{lng: string}> | Get language settings |
runEvents(name, data) | string, any | Promise<any> | Trigger main app events |
addAppEventListen(name, fn) | string, function | function | Listen to main app events |
Issues and Pull Requests are welcome!