需求:生成图片需要支持大图查看和本地下载;制作视频时需要从当前项目作品选择首帧,或上传本地图片。 实现:新增首帧选择弹窗、JPEG/PNG/WebP 有界上传、附件 Asset ID 透传、Main 到服务端 multipart 转发,并保留上传失败重试与私有图片下载链路。 验证:相关 57 项单测、TypeScript 类型检查、目标 ESLint 和 Vite 生产构建全部通过。
503 lines
15 KiB
TypeScript
503 lines
15 KiB
TypeScript
import { createWriteStream } from 'node:fs';
|
|
import { rename, rm } from 'node:fs/promises';
|
|
import type { IncomingMessage, ServerResponse } from 'node:http';
|
|
import { randomUUID } from 'node:crypto';
|
|
import { basename, dirname, extname, join } from 'node:path';
|
|
import { Readable } from 'node:stream';
|
|
import { pipeline } from 'node:stream/promises';
|
|
import { app, dialog, type SaveDialogOptions } from 'electron';
|
|
import {
|
|
IMAGE_WORKSPACE_API_PATH,
|
|
IMAGE_WORKSPACE_UNAVAILABLE_CODE,
|
|
IMAGE_WORKSPACE_UNAVAILABLE_MESSAGE,
|
|
type DesignAssetUploadInput,
|
|
type DesignConfirmGenerationInput,
|
|
type DesignCreateWorkspaceInput,
|
|
type DesignRenameWorkspaceInput,
|
|
type DesignSubmitMessageInput,
|
|
} from '../../../shared/image-workspace';
|
|
import { DesignWorkspaceModuleError } from '../../image-workspace/module';
|
|
import type { HostApiContext } from '../context';
|
|
import {
|
|
flushStreamingHeaders,
|
|
parseJsonBody,
|
|
sendJson,
|
|
writeStreamingChunk,
|
|
} from '../route-utils';
|
|
|
|
function decodedSegments(pathname: string): string[] | null {
|
|
const suffix = pathname.slice(IMAGE_WORKSPACE_API_PATH.length).replace(/^\/+/, '');
|
|
if (!suffix) return [];
|
|
try {
|
|
return suffix.split('/').map((segment) => decodeURIComponent(segment));
|
|
} catch {
|
|
return null;
|
|
}
|
|
}
|
|
|
|
function asString(value: unknown): string {
|
|
return typeof value === 'string' ? value : '';
|
|
}
|
|
|
|
function asInteger(value: unknown): number {
|
|
return typeof value === 'number' && Number.isInteger(value) ? value : -1;
|
|
}
|
|
|
|
function asStringArray(value: unknown): string[] {
|
|
return Array.isArray(value) && value.every((item) => typeof item === 'string')
|
|
? value
|
|
: [];
|
|
}
|
|
|
|
const DESIGN_IMAGE_UPLOAD_MIME_TYPES = new Set([
|
|
'image/jpeg',
|
|
'image/png',
|
|
'image/webp',
|
|
]);
|
|
const MAX_DESIGN_IMAGE_UPLOAD_BYTES = 10 * 1024 * 1024;
|
|
const MAX_DESIGN_IMAGE_UPLOAD_BODY_BYTES = (
|
|
Math.ceil(MAX_DESIGN_IMAGE_UPLOAD_BYTES / 3) * 4 + 16 * 1024
|
|
);
|
|
|
|
async function parseAssetUploadBody(req: IncomingMessage): Promise<Record<string, unknown>> {
|
|
const declaredLength = Number(req.headers['content-length']);
|
|
if (Number.isFinite(declaredLength) && declaredLength > MAX_DESIGN_IMAGE_UPLOAD_BODY_BYTES) {
|
|
throw new DesignWorkspaceModuleError(
|
|
413,
|
|
'design_asset_upload_too_large',
|
|
'图片大小需在 10 MB 以内',
|
|
);
|
|
}
|
|
const chunks: Buffer[] = [];
|
|
let receivedBytes = 0;
|
|
for await (const chunk of req) {
|
|
const bytes = Buffer.isBuffer(chunk) ? chunk : Buffer.from(chunk);
|
|
receivedBytes += bytes.length;
|
|
if (receivedBytes > MAX_DESIGN_IMAGE_UPLOAD_BODY_BYTES) {
|
|
throw new DesignWorkspaceModuleError(
|
|
413,
|
|
'design_asset_upload_too_large',
|
|
'图片大小需在 10 MB 以内',
|
|
);
|
|
}
|
|
chunks.push(bytes);
|
|
}
|
|
try {
|
|
const body = JSON.parse(Buffer.concat(chunks).toString('utf8')) as unknown;
|
|
if (!body || typeof body !== 'object' || Array.isArray(body)) throw new Error();
|
|
return body as Record<string, unknown>;
|
|
} catch {
|
|
throw new DesignWorkspaceModuleError(
|
|
400,
|
|
'design_asset_upload_invalid',
|
|
'上传图片请求无效',
|
|
);
|
|
}
|
|
}
|
|
|
|
function decodeAssetUpload(
|
|
workspaceId: string,
|
|
body: Record<string, unknown>,
|
|
): DesignAssetUploadInput {
|
|
const fileName = basename(asString(body.fileName).trim().replace(/\\/g, '/')).slice(0, 160);
|
|
const mimeType = asString(body.mimeType);
|
|
const encoded = asString(body.dataBase64);
|
|
if (!fileName || !DESIGN_IMAGE_UPLOAD_MIME_TYPES.has(mimeType)) {
|
|
throw new DesignWorkspaceModuleError(
|
|
400,
|
|
'design_asset_upload_invalid',
|
|
'请选择 JPEG、PNG 或 WebP 图片',
|
|
);
|
|
}
|
|
if (!encoded
|
|
|| encoded.length % 4 !== 0
|
|
|| encoded.length > Math.ceil(MAX_DESIGN_IMAGE_UPLOAD_BYTES / 3) * 4
|
|
|| !/^[A-Za-z0-9+/]+={0,2}$/.test(encoded)) {
|
|
throw new DesignWorkspaceModuleError(
|
|
413,
|
|
'design_asset_upload_too_large',
|
|
'图片大小需在 10 MB 以内',
|
|
);
|
|
}
|
|
const bytes = Buffer.from(encoded, 'base64');
|
|
if (bytes.length <= 0 || bytes.length > MAX_DESIGN_IMAGE_UPLOAD_BYTES) {
|
|
throw new DesignWorkspaceModuleError(
|
|
413,
|
|
'design_asset_upload_too_large',
|
|
'图片大小需在 10 MB 以内',
|
|
);
|
|
}
|
|
return {
|
|
workspaceId,
|
|
fileName,
|
|
mimeType: mimeType as DesignAssetUploadInput['mimeType'],
|
|
bytes,
|
|
};
|
|
}
|
|
|
|
function sendData(res: ServerResponse, data: unknown): void {
|
|
sendJson(res, 200, { success: true, status: 200, data });
|
|
}
|
|
|
|
const IMAGE_FILE_EXTENSIONS = new Set(['.gif', '.jpeg', '.jpg', '.png', '.svg', '.webp']);
|
|
|
|
function safeImageFileName(value: string, assetId: string): string {
|
|
const fallbackId = assetId
|
|
.replace(/[^a-zA-Z0-9_-]+/g, '-')
|
|
.replace(/^-+|-+$/g, '')
|
|
.slice(0, 32) || 'image';
|
|
const fallback = `Makelore-AI-Design-${fallbackId}.png`;
|
|
const sanitized = [...value.trim().replace(/[<>:"/\\|?*]/g, '-')]
|
|
.map((character) => character.charCodeAt(0) < 32 ? '-' : character)
|
|
.join('')
|
|
.replace(/[. ]+$/g, '')
|
|
.slice(0, 120);
|
|
if (!sanitized || !IMAGE_FILE_EXTENSIONS.has(extname(sanitized).toLowerCase())) {
|
|
return fallback;
|
|
}
|
|
return sanitized;
|
|
}
|
|
|
|
async function saveAssetContent(
|
|
res: ServerResponse,
|
|
ctx: HostApiContext,
|
|
workspaceId: string,
|
|
assetId: string,
|
|
defaultFileName: string,
|
|
): Promise<void> {
|
|
const fileName = safeImageFileName(defaultFileName, assetId);
|
|
const extension = extname(fileName).slice(1);
|
|
const options: SaveDialogOptions = {
|
|
defaultPath: join(app.getPath('downloads'), fileName),
|
|
filters: [
|
|
{ name: '图片', extensions: [extension] },
|
|
{ name: '所有文件', extensions: ['*'] },
|
|
],
|
|
};
|
|
const mainWindow = ctx.mainWindow && !ctx.mainWindow.isDestroyed()
|
|
? ctx.mainWindow
|
|
: null;
|
|
const selection = mainWindow
|
|
? await dialog.showSaveDialog(mainWindow, options)
|
|
: await dialog.showSaveDialog(options);
|
|
if (selection.canceled || !selection.filePath) {
|
|
sendData(res, { status: 'cancelled' });
|
|
return;
|
|
}
|
|
|
|
const content = await ctx.imageWorkspace!.openAssetContent(workspaceId, assetId);
|
|
if (!content.ok || !content.body || !content.headers.get('content-type')?.startsWith('image/')) {
|
|
throw new DesignWorkspaceModuleError(
|
|
content.status >= 400 ? content.status : 502,
|
|
'DESIGN_ASSET_DOWNLOAD_FAILED',
|
|
'生成图片暂时无法下载,请稍后重试',
|
|
);
|
|
}
|
|
|
|
const temporaryPath = join(
|
|
dirname(selection.filePath),
|
|
`.${basename(selection.filePath)}.${randomUUID()}.download`,
|
|
);
|
|
try {
|
|
await pipeline(
|
|
Readable.fromWeb(content.body),
|
|
createWriteStream(temporaryPath, { flags: 'wx' }),
|
|
);
|
|
await rename(temporaryPath, selection.filePath);
|
|
} catch {
|
|
await rm(temporaryPath, { force: true }).catch(() => undefined);
|
|
throw new DesignWorkspaceModuleError(
|
|
500,
|
|
'DESIGN_ASSET_SAVE_FAILED',
|
|
'图片保存失败,请重新选择位置后重试',
|
|
);
|
|
}
|
|
sendData(res, { status: 'saved' });
|
|
}
|
|
|
|
function sendRouteError(res: ServerResponse, error: unknown): void {
|
|
if (res.headersSent) {
|
|
res.destroy(error instanceof Error ? error : undefined);
|
|
return;
|
|
}
|
|
if (error instanceof DesignWorkspaceModuleError) {
|
|
sendJson(res, error.status, {
|
|
success: false,
|
|
status: error.status,
|
|
code: error.code,
|
|
error: error.message,
|
|
});
|
|
return;
|
|
}
|
|
if (error instanceof SyntaxError) {
|
|
sendJson(res, 400, {
|
|
success: false,
|
|
status: 400,
|
|
code: 'IMAGE_WORKSPACE_INVALID_JSON',
|
|
error: '请求内容不是有效 JSON',
|
|
});
|
|
return;
|
|
}
|
|
sendJson(res, 500, {
|
|
success: false,
|
|
status: 500,
|
|
code: 'IMAGE_WORKSPACE_REQUEST_FAILED',
|
|
error: error instanceof Error ? error.message : 'AI 设计请求失败',
|
|
});
|
|
}
|
|
|
|
async function relayAssetContent(
|
|
req: IncomingMessage,
|
|
res: ServerResponse,
|
|
ctx: HostApiContext,
|
|
workspaceId: string,
|
|
assetId: string,
|
|
): Promise<void> {
|
|
const content = await ctx.imageWorkspace!.openAssetContent(
|
|
workspaceId,
|
|
assetId,
|
|
typeof req.headers.range === 'string' ? req.headers.range : undefined,
|
|
);
|
|
res.statusCode = content.status;
|
|
for (const header of [
|
|
'accept-ranges',
|
|
'cache-control',
|
|
'content-length',
|
|
'content-range',
|
|
'content-type',
|
|
'etag',
|
|
'last-modified',
|
|
]) {
|
|
const value = content.headers.get(header);
|
|
if (value) res.setHeader(header, value);
|
|
}
|
|
if (!content.body || req.method === 'HEAD') {
|
|
res.end();
|
|
return;
|
|
}
|
|
await pipeline(Readable.fromWeb(content.body), res);
|
|
}
|
|
|
|
async function relayWorkspaceEvents(
|
|
req: IncomingMessage,
|
|
res: ServerResponse,
|
|
ctx: HostApiContext,
|
|
workspaceId: string,
|
|
): Promise<void> {
|
|
if (!ctx.imageWorkspace?.openWorkspaceEvents) {
|
|
throw new DesignWorkspaceModuleError(
|
|
501,
|
|
'DESIGN_EVENT_STREAM_UNAVAILABLE',
|
|
'AI 设计任务实时状态暂时不可用',
|
|
);
|
|
}
|
|
const header = req.headers['last-event-id'];
|
|
const afterEventId = Array.isArray(header) ? header[0] : header;
|
|
const subscription = await ctx.imageWorkspace.openWorkspaceEvents({
|
|
workspaceId,
|
|
...(afterEventId ? { afterEventId } : {}),
|
|
});
|
|
let closed = false;
|
|
const close = () => {
|
|
if (closed) return;
|
|
closed = true;
|
|
subscription.close();
|
|
};
|
|
res.once('close', close);
|
|
try {
|
|
res.statusCode = 200;
|
|
res.setHeader('Content-Type', 'text/event-stream; charset=utf-8');
|
|
res.setHeader('Cache-Control', 'no-cache, no-transform');
|
|
res.setHeader('Connection', 'keep-alive');
|
|
res.setHeader('X-Accel-Buffering', 'no');
|
|
flushStreamingHeaders(res);
|
|
if (!await writeStreamingChunk(res, ': connected\n\n')) return;
|
|
for await (const event of subscription.events) {
|
|
if (!await writeStreamingChunk(
|
|
res,
|
|
`id: ${event.id}\nevent: ${event.type}\ndata: ${JSON.stringify(event)}\n\n`,
|
|
)) {
|
|
return;
|
|
}
|
|
}
|
|
if (!res.writableEnded) res.end();
|
|
} finally {
|
|
res.off('close', close);
|
|
close();
|
|
}
|
|
}
|
|
|
|
export async function handleImageWorkspaceRoutes(
|
|
req: IncomingMessage,
|
|
res: ServerResponse,
|
|
url: URL,
|
|
ctx: HostApiContext,
|
|
): Promise<boolean> {
|
|
if (url.pathname !== IMAGE_WORKSPACE_API_PATH
|
|
&& !url.pathname.startsWith(`${IMAGE_WORKSPACE_API_PATH}/`)) {
|
|
return false;
|
|
}
|
|
|
|
if (!ctx.imageWorkspace) {
|
|
sendJson(res, 501, {
|
|
success: false,
|
|
status: 501,
|
|
code: IMAGE_WORKSPACE_UNAVAILABLE_CODE,
|
|
error: IMAGE_WORKSPACE_UNAVAILABLE_MESSAGE,
|
|
});
|
|
return true;
|
|
}
|
|
|
|
const segments = decodedSegments(url.pathname);
|
|
if (!segments) {
|
|
sendJson(res, 400, { success: false, status: 400, error: '无效的 AI 设计路径' });
|
|
return true;
|
|
}
|
|
|
|
try {
|
|
if (segments.length === 0 && req.method === 'GET') {
|
|
sendData(res, await ctx.imageWorkspace.bootstrap());
|
|
return true;
|
|
}
|
|
|
|
if (segments.length === 1 && segments[0] === 'workspaces' && req.method === 'POST') {
|
|
const body = await parseJsonBody<Record<string, unknown>>(req);
|
|
const input: DesignCreateWorkspaceInput = {
|
|
clientWorkspaceId: asString(body.clientWorkspaceId),
|
|
title: asString(body.title),
|
|
};
|
|
sendData(res, await ctx.imageWorkspace.createWorkspace(input));
|
|
return true;
|
|
}
|
|
|
|
if (segments.length === 1 && segments[0] === 'local-data' && req.method === 'DELETE') {
|
|
if (!ctx.imageWorkspace.reset) {
|
|
throw new DesignWorkspaceModuleError(
|
|
405,
|
|
'IMAGE_WORKSPACE_RESET_NOT_ALLOWED',
|
|
'云端 AI 设计不支持清空本地数据',
|
|
);
|
|
}
|
|
sendData(res, await ctx.imageWorkspace.reset());
|
|
return true;
|
|
}
|
|
|
|
if (segments.length === 2 && segments[0] === 'workspaces' && req.method === 'GET') {
|
|
sendData(res, await ctx.imageWorkspace.getWorkspace(segments[1]));
|
|
return true;
|
|
}
|
|
|
|
if (segments.length === 2 && segments[0] === 'workspaces' && req.method === 'PATCH') {
|
|
const body = await parseJsonBody<Record<string, unknown>>(req);
|
|
const input: DesignRenameWorkspaceInput = {
|
|
workspaceId: segments[1],
|
|
title: asString(body.title),
|
|
};
|
|
sendData(res, await ctx.imageWorkspace.renameWorkspace(input));
|
|
return true;
|
|
}
|
|
|
|
if (segments.length === 3
|
|
&& segments[0] === 'workspaces'
|
|
&& segments[2] === 'messages'
|
|
&& req.method === 'POST') {
|
|
const body = await parseJsonBody<Record<string, unknown>>(req);
|
|
const input: DesignSubmitMessageInput = {
|
|
workspaceId: segments[1],
|
|
clientTurnId: asString(body.clientTurnId),
|
|
expectedTurnRevision: asInteger(body.expectedTurnRevision),
|
|
message: asString(body.message),
|
|
attachmentAssetIds: asStringArray(body.attachmentAssetIds),
|
|
};
|
|
sendData(res, await ctx.imageWorkspace.submitMessage(input));
|
|
return true;
|
|
}
|
|
|
|
if (segments.length === 3
|
|
&& segments[0] === 'workspaces'
|
|
&& segments[2] === 'tasks'
|
|
&& req.method === 'GET') {
|
|
sendData(res, await ctx.imageWorkspace.listTasks(segments[1]));
|
|
return true;
|
|
}
|
|
|
|
if (segments.length === 3
|
|
&& segments[0] === 'workspaces'
|
|
&& segments[2] === 'assets'
|
|
&& req.method === 'POST') {
|
|
if (!ctx.imageWorkspace.uploadAsset) {
|
|
throw new DesignWorkspaceModuleError(
|
|
501,
|
|
IMAGE_WORKSPACE_UNAVAILABLE_CODE,
|
|
'当前环境暂不支持上传设计图片',
|
|
);
|
|
}
|
|
const body = await parseAssetUploadBody(req);
|
|
sendData(
|
|
res,
|
|
await ctx.imageWorkspace.uploadAsset(decodeAssetUpload(segments[1], body)),
|
|
);
|
|
return true;
|
|
}
|
|
|
|
if (segments.length === 3
|
|
&& segments[0] === 'workspaces'
|
|
&& segments[2] === 'events'
|
|
&& req.method === 'GET') {
|
|
await relayWorkspaceEvents(req, res, ctx, segments[1]);
|
|
return true;
|
|
}
|
|
|
|
if (segments.length === 5
|
|
&& segments[0] === 'workspaces'
|
|
&& segments[2] === 'quotes'
|
|
&& segments[4] === 'confirm'
|
|
&& req.method === 'POST') {
|
|
const body = await parseJsonBody<Record<string, unknown>>(req);
|
|
const input: DesignConfirmGenerationInput = {
|
|
workspaceId: segments[1],
|
|
quoteId: segments[3],
|
|
clientTurnId: asString(body.clientTurnId),
|
|
expectedTurnRevision: asInteger(body.expectedTurnRevision),
|
|
};
|
|
sendData(res, await ctx.imageWorkspace.confirmGeneration(input));
|
|
return true;
|
|
}
|
|
|
|
if (segments.length === 5
|
|
&& segments[0] === 'workspaces'
|
|
&& segments[2] === 'assets'
|
|
&& segments[4] === 'content'
|
|
&& (req.method === 'GET' || req.method === 'HEAD')) {
|
|
await relayAssetContent(req, res, ctx, segments[1], segments[3]);
|
|
return true;
|
|
}
|
|
|
|
if (segments.length === 5
|
|
&& segments[0] === 'workspaces'
|
|
&& segments[2] === 'assets'
|
|
&& segments[4] === 'download'
|
|
&& req.method === 'POST') {
|
|
const body = await parseJsonBody<Record<string, unknown>>(req);
|
|
await saveAssetContent(
|
|
res,
|
|
ctx,
|
|
segments[1],
|
|
segments[3],
|
|
asString(body.defaultFileName),
|
|
);
|
|
return true;
|
|
}
|
|
|
|
sendJson(res, 404, {
|
|
success: false,
|
|
status: 404,
|
|
code: 'IMAGE_WORKSPACE_ROUTE_NOT_FOUND',
|
|
error: `没有对应的 AI 设计接口:${req.method ?? 'GET'} ${url.pathname}`,
|
|
});
|
|
} catch (error) {
|
|
sendRouteError(res, error);
|
|
}
|
|
return true;
|
|
}
|