Files
DeskClaw/electron/preload/index.ts
Haze 284861a0f5 feat(chat): write API keys to OpenClaw and embed Control UI for chat
Part 1: API Key Integration
- Create electron/utils/openclaw-auth.ts to write keys to
  ~/.openclaw/agents/main/agent/auth-profiles.json
- Update provider:save and provider:setApiKey IPC handlers to
  persist keys to OpenClaw auth-profiles alongside ClawX storage
- Save API key to OpenClaw on successful validation in Setup wizard
- Pass provider API keys as environment variables when starting
  the Gateway process (ANTHROPIC_API_KEY, OPENROUTER_API_KEY, etc.)

Part 2: Embed OpenClaw Control UI for Chat
- Replace custom Chat UI with <webview> embedding the Gateway's
  built-in Control UI at http://127.0.0.1:{port}/?token={token}
- Add gateway:getControlUiUrl IPC handler to provide tokenized URL
- Enable webviewTag in Electron BrowserWindow preferences
- Override X-Frame-Options/CSP headers to allow webview embedding
- Suppress noisy control-ui token_mismatch stderr messages
- Add loading/error states for the embedded webview

This fixes the "No API key found for provider" error and replaces
the buggy custom chat implementation with OpenClaw's battle-tested
Control UI.
2026-02-06 03:12:17 +08:00

194 lines
4.9 KiB
TypeScript

/**
* Preload Script
* Exposes safe APIs to the renderer process via contextBridge
*/
import { contextBridge, ipcRenderer } from 'electron';
/**
* IPC renderer methods exposed to the renderer process
*/
const electronAPI = {
/**
* IPC invoke (request-response pattern)
*/
ipcRenderer: {
invoke: (channel: string, ...args: unknown[]) => {
const validChannels = [
// Gateway
'gateway:status',
'gateway:isConnected',
'gateway:start',
'gateway:stop',
'gateway:restart',
'gateway:rpc',
'gateway:health',
'gateway:getControlUiUrl',
// OpenClaw
'openclaw:status',
'openclaw:isReady',
// Shell
'shell:openExternal',
'shell:showItemInFolder',
'shell:openPath',
// Dialog
'dialog:open',
'dialog:save',
'dialog:message',
// App
'app:version',
'app:name',
'app:getPath',
'app:platform',
'app:quit',
'app:relaunch',
// Settings
'settings:get',
'settings:set',
'settings:getAll',
'settings:reset',
// Update
'update:status',
'update:version',
'update:check',
'update:download',
'update:install',
'update:setChannel',
'update:setAutoDownload',
// Env
'env:getConfig',
'env:setApiKey',
'env:deleteApiKey',
// Provider
'provider:encryptionAvailable',
'provider:list',
'provider:get',
'provider:save',
'provider:delete',
'provider:setApiKey',
'provider:deleteApiKey',
'provider:hasApiKey',
'provider:getApiKey',
'provider:setDefault',
'provider:getDefault',
'provider:validateKey',
// Cron
'cron:list',
'cron:create',
'cron:update',
'cron:delete',
'cron:toggle',
'cron:trigger',
];
if (validChannels.includes(channel)) {
return ipcRenderer.invoke(channel, ...args);
}
throw new Error(`Invalid IPC channel: ${channel}`);
},
/**
* Listen for events from main process
*/
on: (channel: string, callback: (...args: unknown[]) => void) => {
const validChannels = [
'gateway:status-changed',
'gateway:message',
'gateway:notification',
'gateway:channel-status',
'gateway:chat-message',
'gateway:exit',
'gateway:error',
'navigate',
'update:status-changed',
'update:checking',
'update:available',
'update:not-available',
'update:progress',
'update:downloaded',
'update:error',
'cron:updated',
];
if (validChannels.includes(channel)) {
// Wrap the callback to strip the event
const subscription = (_event: Electron.IpcRendererEvent, ...args: unknown[]) => {
callback(...args);
};
ipcRenderer.on(channel, subscription);
// Return unsubscribe function
return () => {
ipcRenderer.removeListener(channel, subscription);
};
}
throw new Error(`Invalid IPC channel: ${channel}`);
},
/**
* Listen for a single event from main process
*/
once: (channel: string, callback: (...args: unknown[]) => void) => {
const validChannels = [
'gateway:status-changed',
'gateway:message',
'gateway:notification',
'gateway:channel-status',
'gateway:chat-message',
'gateway:exit',
'gateway:error',
'navigate',
'update:status-changed',
'update:checking',
'update:available',
'update:not-available',
'update:progress',
'update:downloaded',
'update:error',
];
if (validChannels.includes(channel)) {
ipcRenderer.once(channel, (_event, ...args) => callback(...args));
return;
}
throw new Error(`Invalid IPC channel: ${channel}`);
},
/**
* Remove all listeners for a channel
*/
off: (channel: string, callback?: (...args: unknown[]) => void) => {
if (callback) {
ipcRenderer.removeListener(channel, callback as any);
} else {
ipcRenderer.removeAllListeners(channel);
}
},
},
/**
* Open external URL in default browser
*/
openExternal: (url: string) => {
return ipcRenderer.invoke('shell:openExternal', url);
},
/**
* Get current platform
*/
platform: process.platform,
/**
* Check if running in development
*/
isDev: process.env.NODE_ENV === 'development' || !!process.env.VITE_DEV_SERVER_URL,
};
// Expose the API to the renderer process
contextBridge.exposeInMainWorld('electron', electronAPI);
// Type declarations for the renderer process
export type ElectronAPI = typeof electronAPI;