feat: 初始化项目，并且接近完成 ozon 部分
This commit is contained in:
Joey
@@ -0,0 +1,33 @@
|
||||
# ===== 服务 =====
|
||||
# 注意：不要用 5000/7000（macOS 隔空播放接收器占用）
|
||||
HOST=127.0.0.1
|
||||
PORT=3300
|
||||
# 拼给插件/前端的媒体访问地址（默认本机）
|
||||
APP_BASE_URL=http://127.0.0.1:3300
|
||||
|
||||
# ===== 存储 =====
|
||||
# 图片/数据库落盘目录（默认 <项目根>/data）
|
||||
# DATA_DIR=/Users/joey/sites/seller-store/image-suite-studio/data
|
||||
|
||||
# ===== 图像生成 =====
|
||||
# 默认 provider：doubao（火山方舟 Seedream）| tongyi（阿里 DashScope）
|
||||
IMAGE_PROVIDER=doubao
|
||||
# 单张生图请求超时（秒）
|
||||
REQUEST_TIMEOUT=300
|
||||
# 异步任务轮询上限（秒）
|
||||
POLL_MAX_WAIT=600
|
||||
|
||||
# --- 豆包 / 火山方舟 ---
|
||||
ARK_API_KEY=
|
||||
ARK_BASE_URL=https://ark.cn-beijing.volces.com/api/v3/images/generations
|
||||
ARK_IMAGE_MODEL=doubao-seedream-4-5-251128
|
||||
|
||||
# --- 通义 / DashScope ---
|
||||
DASHSCOPE_API_KEY=
|
||||
DASHSCOPE_BASE_URL=
|
||||
DASHSCOPE_MODEL=wan2.7-image-pro
|
||||
|
||||
# --- DeepSeek（出图方案规划器）---
|
||||
DEEPSEEK_API_KEY=
|
||||
DEEPSEEK_BASE_URL=https://api.deepseek.com/v1
|
||||
DEEPSEEK_MODEL=deepseek-v4-flash
|
||||
+19
@@ -0,0 +1,19 @@
|
||||
.venv/
|
||||
.env
|
||||
**/__pycache__/
|
||||
*.pyc
|
||||
.DS_Store
|
||||
web/ozonSeller.html.bak
|
||||
|
||||
# V2 运行时数据（SQLite + 本地媒体）
|
||||
data/
|
||||
|
||||
# 反编译参考资料（约 40 个 bundle），设计结论已写入 docs/extension/plan.md §2
|
||||
reference/
|
||||
|
||||
# Node（extension / studio / packages）
|
||||
node_modules/
|
||||
dist/
|
||||
.output/
|
||||
.wxt/
|
||||
.pnpm-store/
|
||||
@@ -0,0 +1,92 @@
|
||||
# 电商套图工作台（image-suite-studio）
|
||||
|
||||
Chrome 插件 + Python 后端：采集 Ozon / 1688 / 淘宝 / 天猫 商品页的图片与信息（标题、描述、规格、尺寸），
|
||||
基于采集素材**一键生成电商套图**（可设 5 种风格、7 种图类型、中英文案），生成后导出 ZIP。
|
||||
|
||||
参考并复用了 [ozon-seller-kit](../ozon-seller-kit) 的采集引擎（extension-v1/v2）与
|
||||
[ecommerce-image-suite](../ecommerce-image-suite) 的生图 Prompt 架构。
|
||||
|
||||
## 架构
|
||||
|
||||
```
|
||||
Chrome 插件（WXT + React + antd） Python 后端（FastAPI + SQLite）
|
||||
┌────────────────────────────┐ ┌──────────────────────────────┐
|
||||
│ Side Panel │ │ POST /api/materials │
|
||||
│ ① 扫描商品页（四站点） │ ──上传──▶ │ → 落库 + 后台转存图片 │
|
||||
│ ② 勾选/编辑素材 │ │ POST /api/products/{id}/suites│
|
||||
│ ③ 选风格提交生成 │ ──提交──▶ │ → 套图任务（后台逐张生图） │
|
||||
│ ④ 轮询进度 → 导出 ZIP │ ◀─轮询── │ GET /api/suites/{id} │
|
||||
└────────────────────────────┘ │ GET /api/suites/{id}/zip │
|
||||
└──────────────────────────────┘
|
||||
```
|
||||
|
||||
### 采集引擎（extension/src）
|
||||
|
||||
- 声明式 `SiteProfile`（选择器 + srcProps + 去重/排除规则），加站点只需加一个 profile：
|
||||
- `profiles/ozon.ts` — data-widget 选择器（DOM 兜底）
|
||||
- `profiles/1688.ts` — 多套画廊选择器变体 + CSS 背景图 SKU
|
||||
- `profiles/taobao.ts` — CSS Modules 前缀匹配，淘宝/天猫一份 profile
|
||||
- 多路径采集（`collector/scan.ts` 统一编排）：
|
||||
- **Ozon**：SSR data-state（白名单）→ JSON-LD → 页面 JSON API → DOM，多源合并
|
||||
- **淘宝/天猫**：`window.__ICE_APP_CONTEXT__` SSR 主路径 + DOM 补充详情图
|
||||
- **1688**：纯 DOM（懒加载属性降级 + 占位图过滤 + 组内去重）
|
||||
- 图片 URL 自动还原原图（阿里 `_400x400` 后缀 / Ozon `/wc\d+/` 路径段）
|
||||
|
||||
### 套图生成（server/services）
|
||||
|
||||
- `prompt.py`：7 种图类型 × 5 套风格模板，公共组件 QUALITY / PRODUCT_REF_LOCK（商品一致性锁）/ TEXT_RENDER
|
||||
- 图类型：白底主图 / 核心卖点图 / 卖点图 / 材质图 / 场景展示图 / 多场景拼图 / 电商详情图
|
||||
- 风格：经典商拍 / 生活杂志 / 极简高冷 / 活力爆款 / 暗调质感
|
||||
- 卖点从采集的参数表/卖点文本自动提炼
|
||||
- `generator.py`：图像 provider（图生图，参考图 = 采集主图）
|
||||
- `doubao`：火山方舟 Seedream（默认，`ARK_API_KEY`）
|
||||
- `tongyi`：通义万相/千问（`DASHSCOPE_API_KEY`，wan* 异步轮询 / qwen* 同步）
|
||||
|
||||
## 快速开始
|
||||
|
||||
### 1. 后端
|
||||
|
||||
```bash
|
||||
cd server
|
||||
python3 -m venv .venv && source .venv/bin/activate
|
||||
pip install -r requirements.txt
|
||||
|
||||
# 配置 API Key（二选一，豆包为默认）
|
||||
cp ../.env.example ../.env
|
||||
# 编辑 ../.env 填入 ARK_API_KEY 或 DASHSCOPE_API_KEY
|
||||
|
||||
python main.py # http://127.0.0.1:3300
|
||||
```
|
||||
|
||||
### 2. 插件
|
||||
|
||||
```bash
|
||||
cd extension
|
||||
pnpm install
|
||||
pnpm build # 产物在 .output/chrome-mv3
|
||||
# Chrome → chrome://extensions → 开发者模式 → 加载已解压的扩展程序 → 选 .output/chrome-mv3
|
||||
```
|
||||
|
||||
### 3. 使用
|
||||
|
||||
1. 打开 Ozon / 1688 / 淘宝 / 天猫 的**商品详情页**，滚动到底部（详情图懒加载）后点击插件图标
|
||||
2. Side Panel：扫描 → 检查/勾选素材（默认全选主图+SKU）→ 保存到服务端
|
||||
3. 选择风格 / 图类型 / 文案语言 → 一键生成 → 完成后「导出 ZIP」
|
||||
|
||||
## API 一览
|
||||
|
||||
| 方法 | 路径 | 说明 |
|
||||
|---|---|---|
|
||||
| POST | `/api/materials` | 采集上传（文本 + 图片 URL），异步转存 |
|
||||
| GET | `/api/products` / `/api/products/{id}` | 商品列表/详情 |
|
||||
| POST | `/api/products/{id}/suites` | 创建套图任务 `{style_set, types, lang, provider?}` |
|
||||
| GET | `/api/suites/{id}` | 任务状态 + 已生成图 URL |
|
||||
| GET | `/api/suites/{id}/zip` | 导出 ZIP |
|
||||
| GET | `/api/health` | 健康检查 + provider 配置状态 |
|
||||
|
||||
## 说明与限制
|
||||
|
||||
- 单用户本地部署，未做鉴权（如需暴露公网请自行加 token 校验）
|
||||
- 生图依赖付费 API（豆包 Seedream / 通义万相），任务逐张串行生成，一张约 10-60 秒
|
||||
- 淘宝/天猫页面改版频繁，选择器失效时优先检查 `profiles/taobao.ts` 的 `[class*="xx--"]` 前缀
|
||||
- 模特图（两阶段生成）与视频生成暂未实现，可参考 ecommerce-image-suite 后续扩展
|
||||
@@ -0,0 +1,34 @@
|
||||
import { generateSuite, getSuite, planSuite } from '../src/api/client';
|
||||
|
||||
// Background Service Worker —— 唯一出网口（生成 / 规划 / 轮询任务，绕 CORS）
|
||||
export default defineBackground(() => {
|
||||
console.log('[电商套图工作台] background started');
|
||||
|
||||
// 点击扩展图标 → 打开 Side Panel
|
||||
chrome.sidePanel.setPanelBehavior({ openPanelOnActionClick: true });
|
||||
|
||||
chrome.runtime.onMessage.addListener((msg, _sender, sendResponse) => {
|
||||
if (msg?.action === 'generateSuite') {
|
||||
generateSuite(msg.baseUrl, msg.token, msg.payload)
|
||||
.then((data) => sendResponse({ ok: true, data }))
|
||||
.catch((err) => sendResponse({ ok: false, error: err instanceof Error ? err.message : String(err) }));
|
||||
return true;
|
||||
}
|
||||
|
||||
if (msg?.action === 'planSuite') {
|
||||
planSuite(msg.baseUrl, msg.token, msg.payload)
|
||||
.then((data) => sendResponse({ ok: true, data }))
|
||||
.catch((err) => sendResponse({ ok: false, error: err instanceof Error ? err.message : String(err) }));
|
||||
return true;
|
||||
}
|
||||
|
||||
if (msg?.action === 'getSuite') {
|
||||
getSuite(msg.baseUrl, msg.token, msg.suiteId)
|
||||
.then((data) => sendResponse({ ok: true, data }))
|
||||
.catch((err) => sendResponse({ ok: false, error: err instanceof Error ? err.message : String(err) }));
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,26 @@
|
||||
// Content Script —— 注入四个平台的商品页，暴露采集入口
|
||||
import { scanCurrentPage } from '../../src/collector/scan';
|
||||
|
||||
export default defineContentScript({
|
||||
matches: [
|
||||
// Ozon
|
||||
'https://*.ozon.ru/*',
|
||||
'https://*.ozon.kz/*',
|
||||
'https://*.ozon.by/*',
|
||||
// 1688
|
||||
'https://detail.1688.com/*',
|
||||
// 淘宝 / 天猫
|
||||
'https://item.taobao.com/*',
|
||||
'https://detail.tmall.com/*',
|
||||
],
|
||||
main() {
|
||||
console.log('[电商套图工作台] Content script loaded');
|
||||
|
||||
// 暴露采集入口到全局（供 side panel 调用 / console 调试）
|
||||
(window as any).__SuiteCollector = {
|
||||
scan: scanCurrentPage,
|
||||
};
|
||||
|
||||
console.log('[电商套图工作台] 就绪。Console 可测: await window.__SuiteCollector.scan()');
|
||||
},
|
||||
});
|
||||
@@ -0,0 +1,598 @@
|
||||
/**
|
||||
* 电商套图工作台 - Side Panel
|
||||
*
|
||||
* 布局：顶栏 + 目标平台
|
||||
* ├─ 左 01 商品信息 ｜ 右 02 采集图片（两列等高，采集阶段）
|
||||
* ├─ 03 出图方案（整行：方案列表 + AI 智能规划 + 风格 + 一键生成）
|
||||
* └─ 04 生成结果（整行）
|
||||
*
|
||||
* 流程：采集页面 → 编辑/勾选 → AI 规划或用默认方案 → 一键生成 → 导出 ZIP
|
||||
*/
|
||||
import React, { useCallback, useEffect, useRef, useState } from 'react';
|
||||
import { createRoot } from 'react-dom/client';
|
||||
import { App as AntApp, ConfigProvider, Popover, Progress } from 'antd';
|
||||
import { SettingOutlined, DownloadOutlined, ThunderboltOutlined } from '@ant-design/icons';
|
||||
import type { ScanResult, ImageMaterial } from '../../src/collector/scan';
|
||||
import {
|
||||
buildGeneratePayload, suiteZipUrl,
|
||||
DEFAULT_PLAN, PLATFORM_OPTIONS, PLATFORM_SPECS, STYLE_SET_OPTIONS,
|
||||
type PlanItem, type SuiteInfo,
|
||||
} from '../../src/api/client';
|
||||
import { loadSettings, saveSettings, type BackendSettings } from '../../src/storage/settings';
|
||||
|
||||
/** 数据来源 → 展示含义 */
|
||||
const SOURCE_LABELS: Record<string, string> = {
|
||||
state: '页面数据',
|
||||
ssr: '页面数据',
|
||||
jsonld: '结构化数据',
|
||||
api: '站内接口',
|
||||
dom: 'DOM解析',
|
||||
mixed: '混合来源',
|
||||
};
|
||||
|
||||
/** 平台 → 展示名 */
|
||||
const PLATFORM_LABELS: Record<string, string> = {
|
||||
ozon: 'Ozon',
|
||||
'1688': '1688',
|
||||
taobao: '淘宝/天猫',
|
||||
};
|
||||
|
||||
/** 在当前活动 tab 执行采集（content script 已把入口挂到 window） */
|
||||
async function scanActiveTab(): Promise<ScanResult> {
|
||||
const [tab] = await chrome.tabs.query({ active: true, currentWindow: true });
|
||||
if (!tab?.id) throw new Error('未找到活动标签页');
|
||||
const [res] = await chrome.scripting.executeScript({
|
||||
target: { tabId: tab.id },
|
||||
func: () => (window as any).__SuiteCollector?.scan?.() ?? null,
|
||||
});
|
||||
const r = (res?.result ?? null) as ScanResult | null;
|
||||
if (!r) throw new Error('采集失败：页面不支持或内容脚本未就绪，请刷新页面后重试');
|
||||
return r;
|
||||
}
|
||||
|
||||
function send<T>(action: string, payload: Record<string, unknown>): Promise<T> {
|
||||
return new Promise((resolve, reject) => {
|
||||
chrome.runtime.sendMessage({ action, ...payload }, (res: { ok: boolean; data?: T; error?: string }) => {
|
||||
if (chrome.runtime.lastError) return reject(new Error(chrome.runtime.lastError.message));
|
||||
if (!res?.ok) return reject(new Error(res?.error || '后台请求失败'));
|
||||
resolve(res.data as T);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// ── 小组件 ─────────────────────────────────────────────────────────────────
|
||||
|
||||
const Section: React.FC<{ no: string; title: string; extra?: React.ReactNode; children: React.ReactNode }> =
|
||||
({ no, title, extra, children }) => (
|
||||
<div className="section">
|
||||
<div className="section-head">
|
||||
<span className="section-no">{no}</span>
|
||||
<span className="section-title">{title}</span>
|
||||
{extra && <span className="section-extra">{extra}</span>}
|
||||
</div>
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
|
||||
const Field: React.FC<{ label: string; children: React.ReactNode }> = ({ label, children }) => (
|
||||
<div className="field">
|
||||
<label>{label}</label>
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
|
||||
/** 数量加减器 */
|
||||
const Stepper: React.FC<{ value: number; onChange: (v: number) => void }> = ({ value, onChange }) => (
|
||||
<span className="stepper">
|
||||
<button className="step-btn" disabled={value <= 0} onClick={() => onChange(Math.max(0, value - 1))}>−</button>
|
||||
<span className="step-num">{value}</span>
|
||||
<button className="step-btn" disabled={value >= 5} onClick={() => onChange(Math.min(5, value + 1))}>＋</button>
|
||||
</span>
|
||||
);
|
||||
|
||||
const App: React.FC = () => {
|
||||
const { modal } = AntApp.useApp();
|
||||
|
||||
// 采集
|
||||
const [scanning, setScanning] = useState(false);
|
||||
const [result, setResult] = useState<ScanResult | null>(null);
|
||||
const [selectedKeys, setSelectedKeys] = useState<Set<string>>(new Set());
|
||||
const [titleEdit, setTitleEdit] = useState('');
|
||||
const [descEdit, setDescEdit] = useState('');
|
||||
const [paramsOpen, setParamsOpen] = useState(false);
|
||||
|
||||
// 服务端
|
||||
const [settings, setSettings] = useState<BackendSettings>({ baseUrl: 'http://127.0.0.1:3300', token: '' });
|
||||
|
||||
// 出图方案
|
||||
const [platform, setPlatform] = useState<'ozon' | 'wb' | 'cn'>('cn');
|
||||
const [styleSet, setStyleSet] = useState(1);
|
||||
const [plan, setPlan] = useState<PlanItem[]>(DEFAULT_PLAN.map(p => ({ ...p })));
|
||||
const [planSource, setPlanSource] = useState<'default' | 'ai'>('default');
|
||||
const [planSummary, setPlanSummary] = useState('');
|
||||
const [planning, setPlanning] = useState(false);
|
||||
|
||||
// 生成
|
||||
const [suite, setSuite] = useState<SuiteInfo | null>(null);
|
||||
const [generating, setGenerating] = useState(false);
|
||||
const pollRef = useRef<ReturnType<typeof setInterval> | null>(null);
|
||||
|
||||
// 图片放大预览
|
||||
const [previewUrl, setPreviewUrl] = useState<string | null>(null);
|
||||
|
||||
useEffect(() => {
|
||||
loadSettings().then(setSettings);
|
||||
return () => { if (pollRef.current) clearInterval(pollRef.current); };
|
||||
}, []);
|
||||
|
||||
const price = result?.texts.find(t => t.kind === 'price')?.content ?? '';
|
||||
const brand = result?.texts.find(t => t.kind === 'brand')?.content ?? '';
|
||||
const paramPairs = result?.texts.find(t => t.kind === 'params')?.pairs ?? [];
|
||||
|
||||
const handleScan = async () => {
|
||||
setScanning(true);
|
||||
try {
|
||||
const r = await scanActiveTab();
|
||||
setResult(r);
|
||||
setSuite(null);
|
||||
setParamsOpen(false);
|
||||
// 默认全选主图 + SKU 图（SKU 图带规格名，AI 规划的 variant 绑定要用）
|
||||
const keys = new Set(r.images.filter(i => i.groupKey === 'main' || i.groupKey === 'sku').map(i => i.key));
|
||||
setSelectedKeys(keys);
|
||||
setTitleEdit(r.texts.find(t => t.kind === 'title')?.content ?? '');
|
||||
setDescEdit(r.texts.find(t => t.kind === 'desc')?.content ?? '');
|
||||
} catch (e) {
|
||||
modal.error({ title: '采集失败', content: e instanceof Error ? e.message : String(e), okText: '知道了' });
|
||||
} finally {
|
||||
setScanning(false);
|
||||
}
|
||||
};
|
||||
|
||||
const stopPolling = () => { if (pollRef.current) { clearInterval(pollRef.current); pollRef.current = null; } };
|
||||
|
||||
const pollSuite = useCallback((suiteId: string) => {
|
||||
stopPolling();
|
||||
pollRef.current = setInterval(async () => {
|
||||
try {
|
||||
const s = await send<SuiteInfo>('getSuite', { baseUrl: settings.baseUrl, token: settings.token, suiteId });
|
||||
setSuite(s);
|
||||
if (['done', 'partial', 'failed'].includes(s.status)) {
|
||||
stopPolling();
|
||||
setGenerating(false);
|
||||
if (s.status === 'partial') modal.warning({ title: '部分生成失败', content: '可重试或更换风格重新生成', okText: '知道了' });
|
||||
if (s.status === 'failed') modal.error({ title: '生成失败', content: s.error || '未知错误', okText: '知道了' });
|
||||
}
|
||||
} catch (e) {
|
||||
stopPolling();
|
||||
setGenerating(false);
|
||||
}
|
||||
}, 3000);
|
||||
}, [settings.baseUrl, settings.token, modal]);
|
||||
|
||||
/** 当前编辑后的文本素材（规划与生成共用） */
|
||||
const editedTexts = () => {
|
||||
if (!result) return [];
|
||||
const orig = (kind: string) => result.texts.find(t => t.kind === kind);
|
||||
const texts: Array<{ kind: string; content: string; pairs?: Array<{ key: string; value: string }> | null }> = [];
|
||||
const title = titleEdit || orig('title')?.content || '';
|
||||
const desc = descEdit || orig('desc')?.content || '';
|
||||
if (title) texts.push({ kind: 'title', content: title });
|
||||
if (orig('price')?.content) texts.push({ kind: 'price', content: orig('price')!.content });
|
||||
if (orig('brand')?.content) texts.push({ kind: 'brand', content: orig('brand')!.content });
|
||||
if ((orig('params')?.pairs ?? []).length) texts.push({ kind: 'params', content: '', pairs: orig('params')!.pairs });
|
||||
if (orig('selling_point')?.content) texts.push({ kind: 'selling_point', content: orig('selling_point')!.content });
|
||||
if (desc) texts.push({ kind: 'desc', content: desc });
|
||||
return texts;
|
||||
};
|
||||
|
||||
/** AI 智能规划出图方案 */
|
||||
const handlePlan = async () => {
|
||||
if (!result) return modal.warning({ title: '请先采集商品页' });
|
||||
setPlanning(true);
|
||||
try {
|
||||
const skuVariants = Array.from(new Set(
|
||||
result.images.filter(i => i.groupKey === 'sku' && i.variantName).map(i => i.variantName!)
|
||||
));
|
||||
const data = await send<{ summary: string; items: PlanItem[] }>('planSuite', {
|
||||
baseUrl: settings.baseUrl, token: settings.token,
|
||||
payload: {
|
||||
texts: editedTexts(),
|
||||
sku_variants: skuVariants,
|
||||
image_stats: result.stats,
|
||||
platform,
|
||||
},
|
||||
});
|
||||
setPlan(data.items);
|
||||
setPlanSource('ai');
|
||||
setPlanSummary(data.summary);
|
||||
const total = data.items.reduce((s, i) => s + i.count, 0);
|
||||
modal.info({
|
||||
title: 'AI 方案已生成',
|
||||
content: `${data.summary}（共 ${total} 张）。可逐项调整数量，0 即不生成。`,
|
||||
okText: '好的',
|
||||
});
|
||||
} catch (e) {
|
||||
modal.error({ title: '规划失败', content: e instanceof Error ? e.message : String(e), okText: '知道了' });
|
||||
} finally {
|
||||
setPlanning(false);
|
||||
}
|
||||
};
|
||||
|
||||
const totalPlanned = plan.reduce((s, i) => s + i.count, 0);
|
||||
const doneCount = suite?.images.filter(i => i.status === 'ok').length ?? 0;
|
||||
const suiteTotal = suite?.images.length ?? totalPlanned;
|
||||
|
||||
const handleGenerate = () => {
|
||||
if (!result) return;
|
||||
if (selectedKeys.size === 0) return modal.warning({ title: '请先在采集图片区勾选参考图' });
|
||||
if (totalPlanned === 0) return modal.warning({ title: '出图方案的张数都是 0' });
|
||||
const spec = PLATFORM_SPECS[platform];
|
||||
modal.confirm({
|
||||
title: '生成电商套图',
|
||||
content: `目标平台「${spec.label}」（${spec.lang}文案 · ${spec.ratio}），风格「${STYLE_SET_OPTIONS.find(s => s.value === styleSet)?.label}」，共 ${totalPlanned} 张、参考图 ${selectedKeys.size} 张。生成需要几分钟，可在下方查看进度。`,
|
||||
okText: '开始生成', cancelText: '取消',
|
||||
onOk: async () => {
|
||||
setGenerating(true);
|
||||
setSuite(null);
|
||||
try {
|
||||
const payload = buildGeneratePayload(
|
||||
result, selectedKeys,
|
||||
{ title: titleEdit, desc: descEdit },
|
||||
{ style_set: styleSet, plan: plan.filter(p => p.count > 0), platform },
|
||||
);
|
||||
const { suite_id } = await send<{ suite_id: string }>('generateSuite', {
|
||||
baseUrl: settings.baseUrl, token: settings.token, payload,
|
||||
});
|
||||
pollSuite(suite_id);
|
||||
} catch (e) {
|
||||
setGenerating(false);
|
||||
modal.error({ title: '提交失败', content: e instanceof Error ? e.message : String(e), okText: '知道了' });
|
||||
}
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const handleExport = () => {
|
||||
if (!suite) return;
|
||||
chrome.tabs.create({ url: suiteZipUrl(settings.baseUrl, suite.id) });
|
||||
};
|
||||
|
||||
const toggleKey = (key: string) => {
|
||||
const next = new Set(selectedKeys);
|
||||
if (next.has(key)) next.delete(key); else next.add(key);
|
||||
setSelectedKeys(next);
|
||||
};
|
||||
|
||||
const groupImages = (groupKey: string): ImageMaterial[] =>
|
||||
result?.images.filter(i => i.groupKey === groupKey) ?? [];
|
||||
|
||||
const toggleGroup = (groupKey: string, on: boolean) => {
|
||||
const next = new Set(selectedKeys);
|
||||
groupImages(groupKey).forEach(i => on ? next.add(i.key) : next.delete(i.key));
|
||||
setSelectedKeys(next);
|
||||
};
|
||||
|
||||
const setPlanCount = (idx: number, count: number) => {
|
||||
setPlan(prev => prev.map((p, i) => i === idx ? { ...p, count } : p));
|
||||
};
|
||||
|
||||
/** 源站图防盗链时的兜底：走服务端图片代理 */
|
||||
const proxied = (u: string) =>
|
||||
`${settings.baseUrl.replace(/\/$/, '')}/api/proxy-image?url=${encodeURIComponent(u)}`;
|
||||
|
||||
/** 缩略图三级降级：thumbUrl → 原图 → 服务端代理 */
|
||||
const onThumbError = (e: React.SyntheticEvent<HTMLImageElement>, url: string) => {
|
||||
const el = e.currentTarget;
|
||||
if (el.dataset.step === '1') { el.dataset.step = '2'; el.src = url; }
|
||||
else if (el.dataset.step === '2') { el.dataset.step = '3'; el.src = proxied(url); }
|
||||
};
|
||||
|
||||
const settingsPopup = (
|
||||
<div style={{ width: 260 }}>
|
||||
<Field label="后端地址">
|
||||
<input
|
||||
value={settings.baseUrl}
|
||||
onChange={(e) => setSettings({ ...settings, baseUrl: e.target.value })}
|
||||
onBlur={() => saveSettings(settings)}
|
||||
/>
|
||||
</Field>
|
||||
<Field label="Token（可选）">
|
||||
<input
|
||||
value={settings.token}
|
||||
onChange={(e) => setSettings({ ...settings, token: e.target.value })}
|
||||
onBlur={() => saveSettings(settings)}
|
||||
/>
|
||||
</Field>
|
||||
</div>
|
||||
);
|
||||
|
||||
return (
|
||||
<div className="page">
|
||||
{/* ── 顶栏 ── */}
|
||||
<div className="topbar">
|
||||
<div className="logo">套</div>
|
||||
<div>
|
||||
<h1>电商套图工作台</h1>
|
||||
<div className="sub">商品采集 · 套图生成 · 一键导出</div>
|
||||
</div>
|
||||
<div className="spacer" />
|
||||
<Popover content={settingsPopup} title="服务端设置" trigger="click" placement="bottomRight">
|
||||
<button className="icon-btn" title="服务端设置"><SettingOutlined /></button>
|
||||
</Popover>
|
||||
<button className="btn btn-primary" disabled={scanning} onClick={handleScan}>
|
||||
{scanning ? '采集中…' : '快速采集'}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* ── 目标平台切换（决定文案语言 + 图片比例）── */}
|
||||
<div className="platform-bar">
|
||||
<span className="platform-label">目标平台</span>
|
||||
<div className="pills">
|
||||
{PLATFORM_OPTIONS.map(p => (
|
||||
<span
|
||||
key={p.value}
|
||||
className={`pill ${platform === p.value ? 'on' : ''}`}
|
||||
onClick={() => setPlatform(p.value)}
|
||||
>{p.label}</span>
|
||||
))}
|
||||
</div>
|
||||
<span className="platform-spec">
|
||||
{PLATFORM_SPECS[platform].lang}文案 · {PLATFORM_SPECS[platform].ratio} 图片
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{/* ── 采集区：左信息 / 右图片，两列等高 ── */}
|
||||
<div className="two-col">
|
||||
<Section
|
||||
no="01"
|
||||
title="商品信息"
|
||||
extra={result
|
||||
? `${PLATFORM_LABELS[result.platform] ?? result.platform} · ${SOURCE_LABELS[result.source] ?? result.source}`
|
||||
: undefined}
|
||||
>
|
||||
{!result ? (
|
||||
<div className="empty">点击右上角「快速采集」抓取当前商品页</div>
|
||||
) : (
|
||||
<>
|
||||
<Field label="标题">
|
||||
<input value={titleEdit} onChange={(e) => setTitleEdit(e.target.value)} />
|
||||
</Field>
|
||||
<div style={{ display: 'flex', gap: 8 }}>
|
||||
<div style={{ flex: 1 }}>
|
||||
<Field label="价格">
|
||||
<input value={price} readOnly style={{ color: 'var(--text-2)' }} />
|
||||
</Field>
|
||||
</div>
|
||||
<div style={{ flex: 1 }}>
|
||||
<Field label="品牌">
|
||||
<input value={brand} readOnly style={{ color: 'var(--text-2)' }} />
|
||||
</Field>
|
||||
</div>
|
||||
</div>
|
||||
{paramPairs.length > 0 && (
|
||||
<div className="field">
|
||||
<label style={{ cursor: 'pointer' }} onClick={() => setParamsOpen(v => !v)}>
|
||||
规格 / 参数（{paramPairs.length} 项）{paramsOpen ? ' ▴' : ' ▾'}
|
||||
</label>
|
||||
{paramsOpen && (
|
||||
<table className="kv-table">
|
||||
<tbody>
|
||||
{paramPairs.slice(0, 30).map((p, i) => (
|
||||
<tr key={i}><td className="k">{p.key}</td><td>{p.value}</td></tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
<Field label="商品描述（用于生成图内文案）">
|
||||
<textarea rows={6} value={descEdit} onChange={(e) => setDescEdit(e.target.value)} />
|
||||
</Field>
|
||||
{result.warnings.length > 0 && (
|
||||
<div className="warn-box">{result.warnings.map((w, i) => <div key={i}>{w}</div>)}</div>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</Section>
|
||||
|
||||
<Section
|
||||
no="02"
|
||||
title="采集图片"
|
||||
extra={result ? `已选 ${selectedKeys.size} / ${result.images.length}` : undefined}
|
||||
>
|
||||
{!result ? (
|
||||
<div className="empty">采集后在此勾选图片</div>
|
||||
) : (
|
||||
<div className="img-groups">
|
||||
{['main', 'sku', 'detail'].map(g => groupImages(g).length > 0 && (
|
||||
<div key={g} style={{ marginBottom: 10 }}>
|
||||
<div className="group-head">
|
||||
<span className="name">
|
||||
{g === 'main' ? '主图' : g === 'sku' ? 'SKU图片' : '详情图'}
|
||||
</span>
|
||||
<span className="count">{groupImages(g).length}</span>
|
||||
<span
|
||||
className="mini-check"
|
||||
onClick={() => {
|
||||
const all = groupImages(g).every(i => selectedKeys.has(i.key));
|
||||
toggleGroup(g, !all);
|
||||
}}
|
||||
>
|
||||
{groupImages(g).every(i => selectedKeys.has(i.key)) ? '取消全选' : '全选'}
|
||||
</span>
|
||||
</div>
|
||||
<div className="img-grid">
|
||||
{groupImages(g).map(img => {
|
||||
const on = selectedKeys.has(img.key);
|
||||
return (
|
||||
<div key={img.key} className={`img-cell ${on ? 'on' : ''}`}
|
||||
title="点击放大预览，勾选圆点选择图片"
|
||||
onClick={() => setPreviewUrl(img.url)}>
|
||||
<img
|
||||
src={img.thumbUrl || img.url}
|
||||
referrerPolicy="no-referrer"
|
||||
data-step="1"
|
||||
onError={(e) => onThumbError(e, img.url)}
|
||||
/>
|
||||
<span
|
||||
className="tick"
|
||||
onClick={(e) => { e.stopPropagation(); toggleKey(img.key); }}
|
||||
>✓</span>
|
||||
{img.variantName && <span className="variant">{img.variantName}</span>}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</Section>
|
||||
</div>
|
||||
|
||||
{/* ── 出图方案（整行）── */}
|
||||
<Section
|
||||
no="03"
|
||||
title="出图方案"
|
||||
extra={
|
||||
<span>
|
||||
{planSource === 'ai' ? <span className="ai-tag">AI 方案</span> : '默认方案'}
|
||||
{' '}共 <b style={{ color: 'var(--primary)' }}>{totalPlanned}</b> 张
|
||||
</span>
|
||||
}
|
||||
>
|
||||
<div className="plan-list">
|
||||
{plan.map((p, idx) => (
|
||||
<div key={idx} className={`plan-row ${p.count === 0 ? 'off' : ''}`}>
|
||||
<div className="plan-main">
|
||||
<span className="plan-title">{p.title}</span>
|
||||
{p.variant_name && <span className="variant-chip">{p.variant_name}</span>}
|
||||
{p.detail && <span className="plan-detail" title={p.detail}>{p.detail}</span>}
|
||||
</div>
|
||||
<Stepper value={p.count} onChange={(v) => setPlanCount(idx, v)} />
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<div style={{ display: 'flex', alignItems: 'center', gap: 10, margin: '10px 0' }}>
|
||||
<button className="btn" disabled={!result || planning} onClick={handlePlan}>
|
||||
<ThunderboltOutlined /> {planning ? '规划中…' : 'AI 智能规划'}
|
||||
</button>
|
||||
{planSource === 'ai' && (
|
||||
<button
|
||||
className="btn btn-sm"
|
||||
onClick={() => { setPlan(DEFAULT_PLAN.map(p => ({ ...p }))); setPlanSource('default'); setPlanSummary(''); }}
|
||||
>恢复默认方案</button>
|
||||
)}
|
||||
<span className="hint" style={{ flex: 1 }}>
|
||||
{planSummary || '方案与张数由规划器根据商品信息自动决定，可手动微调，0 即不生成'}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div className="divider" />
|
||||
<div className="field">
|
||||
<label>视觉风格</label>
|
||||
<div className="pills">
|
||||
{STYLE_SET_OPTIONS.map(s => (
|
||||
<span
|
||||
key={s.value}
|
||||
className={`pill ${styleSet === s.value ? 'on' : ''}`}
|
||||
onClick={() => setStyleSet(s.value)}
|
||||
>{s.label}</span>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
<div style={{ display: 'flex', alignItems: 'center', gap: 10, marginTop: 4 }}>
|
||||
<button
|
||||
className="btn btn-primary" disabled={!result || generating || selectedKeys.size === 0 || totalPlanned === 0}
|
||||
onClick={handleGenerate}
|
||||
>
|
||||
{generating ? '生成中…' : `一键生成（${totalPlanned} 张）`}
|
||||
</button>
|
||||
{generating && (
|
||||
<div style={{ flex: 1 }}>
|
||||
<Progress
|
||||
percent={suiteTotal ? Math.round(doneCount / suiteTotal * 100) : 0}
|
||||
size="small" status="active" format={() => `${doneCount}/${suiteTotal}`}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</Section>
|
||||
|
||||
{/* ── 生成结果（整行）── */}
|
||||
<Section
|
||||
no="04"
|
||||
title="生成结果"
|
||||
extra={
|
||||
suite && ['done', 'partial'].includes(suite.status) && (
|
||||
<button className="btn btn-sm" onClick={handleExport}>
|
||||
<DownloadOutlined /> 导出 ZIP
|
||||
</button>
|
||||
)
|
||||
}
|
||||
>
|
||||
{!suite ? (
|
||||
<div className="empty">生成后在此查看与导出</div>
|
||||
) : (
|
||||
<>
|
||||
<div style={{ marginBottom: 8 }} className="hint">
|
||||
状态：<b style={{ color: suite.status === 'done' ? 'var(--green)' : suite.status === 'failed' ? 'var(--red)' : 'var(--primary)' }}>
|
||||
{suite.status === 'running' ? '生成中' : suite.status === 'done' ? '完成' : suite.status === 'partial' ? '部分失败' : suite.status === 'pending' ? '排队中' : '失败'}
|
||||
</b>
|
||||
{' '}· {PLATFORM_SPECS[suite.platform]?.label ?? suite.platform}
|
||||
{' '}· {PLATFORM_SPECS[suite.platform]?.lang ?? suite.lang}文案 · {suite.ratio}
|
||||
{' '}· 风格「{STYLE_SET_OPTIONS.find(s => s.value === suite.style_set)?.label}」
|
||||
</div>
|
||||
<div className="result-grid">
|
||||
{suite.images.map(img => (
|
||||
<div
|
||||
key={img.type_id + img.name}
|
||||
className={`result-cell ${img.status !== 'ok' ? 'fail' : ''}`}
|
||||
title={img.error || img.name}
|
||||
style={{ cursor: img.status === 'ok' ? 'zoom-in' : 'default' }}
|
||||
onClick={() => img.status === 'ok' && setPreviewUrl(img.url)}
|
||||
>
|
||||
{img.status === 'ok' ? (
|
||||
<img src={img.url} referrerPolicy="no-referrer" />
|
||||
) : (
|
||||
<div style={{ aspectRatio: suite.ratio === '3:4' ? '3/4' : '1', background: 'var(--card-soft)' }} />
|
||||
)}
|
||||
{img.status !== 'ok' && <span className="fail-tag">{img.status === 'failed' ? '✗' : '…'}</span>}
|
||||
<div className="cap">{img.name}</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
{suite.error && <div className="warn-box">{suite.error}</div>}
|
||||
</>
|
||||
)}
|
||||
</Section>
|
||||
|
||||
{/* ── 图片放大预览 ── */}
|
||||
{previewUrl && (
|
||||
<div className="lightbox" onClick={() => setPreviewUrl(null)}>
|
||||
<img src={previewUrl} referrerPolicy="no-referrer" onClick={(e) => e.stopPropagation()} />
|
||||
<span className="lightbox-tip">点击任意处关闭</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const Root: React.FC = () => (
|
||||
<ConfigProvider
|
||||
theme={{
|
||||
token: {
|
||||
colorPrimary: '#8b5cf6',
|
||||
colorLink: '#8b5cf6',
|
||||
borderRadius: 8,
|
||||
fontFamily: "Arial, 'PingFang SC', 'Microsoft YaHei', sans-serif",
|
||||
},
|
||||
}}
|
||||
>
|
||||
<AntApp>
|
||||
<App />
|
||||
</AntApp>
|
||||
</ConfigProvider>
|
||||
);
|
||||
|
||||
createRoot(document.getElementById('root')!).render(<Root />);
|
||||
@@ -0,0 +1,255 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>电商套图工作台</title>
|
||||
<style>
|
||||
:root {
|
||||
--bg: #f5f5f5; /* 页面背景（中性灰） */
|
||||
--card: #ffffff;
|
||||
--card-soft: #fafafa;
|
||||
--border: #f0f0f0;
|
||||
--border-strong: #e0e0e0;
|
||||
--primary: #8b5cf6; /* 紫（ozon-seller-kit v2 主题色） */
|
||||
--primary-hover: #7c3aed;
|
||||
--primary-ring: rgba(139, 92, 246, 0.12);
|
||||
--green: #52c41a;
|
||||
--red: #ff4d4f;
|
||||
--warn-bg: #fffbe6;
|
||||
--warn-border: #ffe58f;
|
||||
--warn-text: #8c6d1f;
|
||||
--text: #262626;
|
||||
--text-2: #8c8c8c;
|
||||
}
|
||||
html, body, #root {
|
||||
min-width: 860px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
body {
|
||||
background: var(--bg);
|
||||
color: var(--text);
|
||||
font-family: Arial, 'PingFang SC', 'Microsoft YaHei', sans-serif;
|
||||
font-size: 14px;
|
||||
}
|
||||
* { box-sizing: border-box; }
|
||||
|
||||
/* ── 页面骨架 ── */
|
||||
.page { padding: 16px 18px 22px; }
|
||||
/* 采集区两列等高：左右卡片拉伸到同一高度 */
|
||||
.two-col { display: flex; gap: 14px; align-items: stretch; margin-bottom: 14px; }
|
||||
.two-col .section { flex: 1; min-width: 0; margin-bottom: 0; display: flex; flex-direction: column; }
|
||||
.two-col .section .section-head { flex-shrink: 0; }
|
||||
.img-groups { flex: 1; overflow-y: auto; max-height: 560px; }
|
||||
.divider { border-top: 1px solid var(--border); margin: 12px 0; }
|
||||
|
||||
/* ── 顶部 ── */
|
||||
.topbar {
|
||||
display: flex; align-items: center; gap: 11px;
|
||||
padding-bottom: 14px; margin-bottom: 14px;
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
.logo {
|
||||
width: 38px; height: 38px; border-radius: 9px;
|
||||
background: var(--primary); color: #fff;
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
font-size: 19px; font-weight: 700;
|
||||
}
|
||||
.topbar h1 { font-size: 17px; margin: 0; font-weight: 700; }
|
||||
.topbar .sub { font-size: 12px; color: var(--text-2); margin-top: 1px; }
|
||||
.topbar .spacer { flex: 1; }
|
||||
.btn {
|
||||
display: inline-flex; align-items: center; gap: 6px;
|
||||
padding: 8px 16px; border-radius: 8px; border: 1px solid var(--border-strong);
|
||||
font-size: 14px; cursor: pointer; user-select: none;
|
||||
background: #fff; color: var(--text);
|
||||
transition: all .15s;
|
||||
}
|
||||
.btn:hover { border-color: var(--primary); color: var(--primary); }
|
||||
.btn-primary {
|
||||
background: var(--primary); border-color: var(--primary); color: #fff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.btn-primary:hover { background: var(--primary-hover); border-color: var(--primary-hover); color: #fff; }
|
||||
.btn[disabled] { opacity: .5; cursor: not-allowed; }
|
||||
.btn-sm { padding: 5px 11px; font-size: 12.5px; }
|
||||
.icon-btn {
|
||||
width: 34px; height: 34px; border-radius: 8px; border: 1px solid var(--border-strong);
|
||||
background: #fff; cursor: pointer; color: var(--text-2);
|
||||
display: inline-flex; align-items: center; justify-content: center;
|
||||
}
|
||||
.icon-btn:hover { color: var(--primary); border-color: var(--primary); }
|
||||
|
||||
/* ── 编号步骤卡片 ── */
|
||||
.section {
|
||||
background: var(--card); border: 1px solid var(--border);
|
||||
border-radius: 8px; padding: 14px 16px; margin-bottom: 14px;
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
|
||||
}
|
||||
.section-head { display: flex; align-items: baseline; gap: 9px; margin-bottom: 12px; }
|
||||
.section-no {
|
||||
font-size: 20px; font-weight: 800; color: var(--primary);
|
||||
font-variant-numeric: tabular-nums; line-height: 1;
|
||||
}
|
||||
.section-title { font-size: 15px; font-weight: 700; }
|
||||
.section-extra { margin-left: auto; font-size: 12px; color: var(--text-2); }
|
||||
|
||||
/* ── 字段 ── */
|
||||
.field { margin-bottom: 10px; }
|
||||
.field label { display: block; font-size: 12.5px; color: var(--text-2); margin-bottom: 4px; }
|
||||
.field input, .field textarea {
|
||||
width: 100%; padding: 8px 11px; border: 1px solid var(--border-strong);
|
||||
border-radius: 6px; font-size: 14px; font-family: inherit; line-height: 1.5;
|
||||
background: var(--card-soft); color: var(--text); outline: none;
|
||||
transition: border-color .15s, box-shadow .15s;
|
||||
}
|
||||
.field input:focus, .field textarea:focus {
|
||||
border-color: var(--primary);
|
||||
box-shadow: 0 0 0 3px var(--primary-ring);
|
||||
background: #fff;
|
||||
}
|
||||
.kv-table {
|
||||
width: 100%; border-collapse: collapse; font-size: 13px;
|
||||
background: var(--card-soft); border-radius: 6px; overflow: hidden;
|
||||
}
|
||||
.kv-table td { padding: 6px 10px; border-bottom: 1px solid var(--border); vertical-align: top; }
|
||||
.kv-table tr:last-child td { border-bottom: none; }
|
||||
.kv-table td.k { color: var(--text-2); white-space: nowrap; width: 1%; padding-right: 16px; }
|
||||
|
||||
/* ── 药丸选择 ── */
|
||||
.pills { display: flex; flex-wrap: wrap; gap: 7px; }
|
||||
.pill {
|
||||
padding: 5px 13px; border-radius: 999px; border: 1px solid var(--border-strong);
|
||||
background: #fff; font-size: 13px; cursor: pointer; color: var(--text-2);
|
||||
user-select: none; transition: all .15s; line-height: 1.6;
|
||||
}
|
||||
.pill:hover { border-color: var(--primary); color: var(--primary); }
|
||||
.pill.on {
|
||||
background: var(--primary); border-color: var(--primary); color: #fff; font-weight: 600;
|
||||
}
|
||||
|
||||
/* ── 图片网格 ── */
|
||||
.group-head { display: flex; align-items: center; gap: 8px; margin: 4px 0 9px; }
|
||||
.group-head .name { font-size: 13px; font-weight: 600; color: var(--text-2); }
|
||||
.group-head .count {
|
||||
font-size: 12px; color: var(--text-2); background: var(--card-soft);
|
||||
border: 1px solid var(--border); border-radius: 999px; padding: 0 8px;
|
||||
}
|
||||
.group-head .mini-check { margin-left: auto; font-size: 12px; color: var(--primary); cursor: pointer; user-select: none; }
|
||||
.group-head .mini-check:hover { text-decoration: underline; }
|
||||
.img-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; }
|
||||
.img-cell {
|
||||
position: relative; aspect-ratio: 1; border-radius: 6px; overflow: hidden;
|
||||
border: 2px solid transparent; cursor: zoom-in; background: var(--card-soft);
|
||||
}
|
||||
.img-cell img { width: 100%; height: 100%; object-fit: cover; display: block; }
|
||||
.img-cell.on { border-color: var(--primary); }
|
||||
.img-cell .tick {
|
||||
position: absolute; top: 5px; left: 5px; width: 18px; height: 18px;
|
||||
border-radius: 50%; border: 1.5px solid #fff;
|
||||
background: rgba(255, 255, 255, 0.55); display: flex; align-items: center; justify-content: center;
|
||||
color: #fff; font-size: 11px; transition: all .15s; cursor: pointer;
|
||||
}
|
||||
.img-cell.on .tick { background: var(--primary); border-color: var(--primary); }
|
||||
.img-cell .variant {
|
||||
position: absolute; bottom: 0; left: 0; right: 0;
|
||||
background: rgba(0, 0, 0, 0.55); color: #fff; font-size: 11px;
|
||||
padding: 1px 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
/* ── 生成结果（整行，6 列）── */
|
||||
.result-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
|
||||
.result-cell { position: relative; border-radius: 6px; overflow: hidden; border: 1px solid var(--border); }
|
||||
.result-cell img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; }
|
||||
.result-cell .cap {
|
||||
font-size: 11.5px; text-align: center; padding: 3px 0;
|
||||
background: var(--card-soft); color: var(--text-2);
|
||||
border-top: 1px solid var(--border); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
|
||||
}
|
||||
.result-cell.fail { opacity: .55; }
|
||||
.result-cell .fail-tag {
|
||||
position: absolute; top: 5px; right: 5px; font-size: 11px;
|
||||
background: var(--red); color: #fff; border-radius: 4px; padding: 0 5px;
|
||||
}
|
||||
|
||||
/* ── 目标平台切换条 ── */
|
||||
.platform-bar {
|
||||
display: flex; align-items: center; gap: 10px;
|
||||
background: var(--card); border: 1px solid var(--border);
|
||||
border-radius: 8px; padding: 10px 16px; margin-bottom: 14px;
|
||||
}
|
||||
.platform-label { font-size: 13px; font-weight: 700; }
|
||||
.platform-spec { margin-left: auto; font-size: 12.5px; color: var(--text-2); }
|
||||
/* 三个平台药丸等宽：选中态加粗会让文字变宽，用固定 min-width 消除抖动 */
|
||||
.platform-bar .pill { min-width: 108px; text-align: center; }
|
||||
|
||||
/* ── 图片放大预览 ── */
|
||||
.lightbox {
|
||||
position: fixed; inset: 0; z-index: 1000;
|
||||
background: rgba(0, 0, 0, 0.82);
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
flex-direction: column; gap: 12px; cursor: zoom-out;
|
||||
}
|
||||
.lightbox img {
|
||||
max-width: 92%; max-height: 86%;
|
||||
border-radius: 8px; box-shadow: 0 8px 40px rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
.lightbox-tip { color: rgba(255, 255, 255, 0.75); font-size: 12.5px; }
|
||||
|
||||
/* ── 出图方案 ── */
|
||||
.plan-list { display: flex; flex-direction: column; gap: 4px; }
|
||||
.plan-row {
|
||||
display: flex; align-items: center; gap: 10px;
|
||||
padding: 7px 10px; border: 1px solid var(--border); border-radius: 6px;
|
||||
background: var(--card-soft);
|
||||
}
|
||||
.plan-row.off { opacity: .45; }
|
||||
.plan-main { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; }
|
||||
.plan-title { font-size: 13.5px; font-weight: 600; white-space: nowrap; }
|
||||
.variant-chip {
|
||||
flex-shrink: 0; font-size: 11.5px; padding: 0 8px; line-height: 1.8;
|
||||
border-radius: 999px; background: #f3efff; border: 1px solid #ddd3fa; color: #6d28d9;
|
||||
}
|
||||
.plan-detail {
|
||||
font-size: 12px; color: var(--text-2);
|
||||
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
|
||||
}
|
||||
.stepper { display: inline-flex; align-items: center; gap: 0; flex-shrink: 0; }
|
||||
.step-btn {
|
||||
width: 24px; height: 24px; border: 1px solid var(--border-strong); background: #fff;
|
||||
border-radius: 5px; cursor: pointer; font-size: 14px; line-height: 1; color: var(--text);
|
||||
display: inline-flex; align-items: center; justify-content: center;
|
||||
}
|
||||
.step-btn:hover:not([disabled]) { border-color: var(--primary); color: var(--primary); }
|
||||
.step-btn[disabled] { opacity: .35; cursor: not-allowed; }
|
||||
.step-num {
|
||||
min-width: 28px; text-align: center; font-size: 13.5px; font-weight: 600;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
.ai-tag {
|
||||
background: var(--primary); color: #fff; font-size: 11px;
|
||||
border-radius: 4px; padding: 1px 6px; margin-right: 4px;
|
||||
}
|
||||
|
||||
.hint { font-size: 12.5px; color: var(--text-2); line-height: 1.6; }
|
||||
.ok-chip {
|
||||
display: inline-flex; align-items: center; gap: 5px;
|
||||
background: #f6ffed; border: 1px solid #b7eb8f; color: #389e0d;
|
||||
border-radius: 6px; padding: 4px 9px; font-size: 12.5px;
|
||||
}
|
||||
.warn-box {
|
||||
background: var(--warn-bg); border: 1px solid var(--warn-border); color: var(--warn-text);
|
||||
border-radius: 6px; padding: 7px 10px; font-size: 12.5px; margin-top: 6px; line-height: 1.6;
|
||||
}
|
||||
.empty {
|
||||
text-align: center; color: var(--text-2); font-size: 13px;
|
||||
padding: 22px 0; background: var(--card-soft); border-radius: 6px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="./App.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,24 @@
|
||||
{
|
||||
"name": "suite-collector-extension",
|
||||
"version": "0.1.0",
|
||||
"type": "module",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "wxt",
|
||||
"build": "wxt build",
|
||||
"zip": "wxt zip"
|
||||
},
|
||||
"dependencies": {
|
||||
"@ant-design/icons": "^6.3.2",
|
||||
"antd": "^6.6.0",
|
||||
"react": "^18.3.1",
|
||||
"react-dom": "^18.3.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/chrome": "^0.0.268",
|
||||
"@types/react": "^18.3.3",
|
||||
"@types/react-dom": "^18.3.0",
|
||||
"typescript": "^5.5.3",
|
||||
"wxt": "^0.19.0"
|
||||
}
|
||||
}
|
||||
Generated
+4411
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,6 @@
|
||||
allowBuilds:
|
||||
esbuild: set this to true or false
|
||||
spawn-sync: set this to true or false
|
||||
onlyBuiltDependencies:
|
||||
- esbuild
|
||||
- spawn-sync
|
||||
@@ -0,0 +1,262 @@
|
||||
/**
|
||||
* 后端 HTTP 客户端 —— 仅 background 使用（有 host_permissions，不受 CORS 约束）。
|
||||
* 契约对齐 server 端 /api/materials 与 /api/suites。
|
||||
*/
|
||||
import type { ScanResult } from '../collector/scan';
|
||||
|
||||
export interface MaterialsPayload {
|
||||
product_id: string | null;
|
||||
source: {
|
||||
platform: string;
|
||||
itemId: string | null;
|
||||
url: string;
|
||||
collectedAt: number;
|
||||
};
|
||||
texts: Array<{ kind: string; content: string; pairs?: Array<{ key: string; value: string }> | null }>;
|
||||
images: Array<{
|
||||
groupKey: string;
|
||||
groupName: string;
|
||||
variantName?: string | null;
|
||||
url: string;
|
||||
index: number;
|
||||
type: string;
|
||||
dedupeKey?: string | null;
|
||||
}>;
|
||||
refererOrigin?: string;
|
||||
}
|
||||
|
||||
/** 服务端支持的套图类型（与 server/services/prompt.py 保持一致） */
|
||||
export const SUITE_TYPE_OPTIONS = [
|
||||
{ value: 'white_bg', label: '白底主图' },
|
||||
{ value: 'key_features', label: '核心卖点图' },
|
||||
{ value: 'selling_pt', label: '卖点图' },
|
||||
{ value: 'material', label: '材质图' },
|
||||
{ value: 'lifestyle', label: '场景展示图' },
|
||||
{ value: 'multi_scene', label: '多场景拼图' },
|
||||
{ value: 'ecommerce_detail', label: '电商详情图' },
|
||||
{ value: 'size_chart', label: '尺寸标注图' },
|
||||
{ value: 'sku_collection', label: 'SKU合集图' },
|
||||
{ value: 'custom', label: '创意图' },
|
||||
] as const;
|
||||
|
||||
/** 出图方案项：一类图 × 数量，可绑定 SKU 规格 */
|
||||
export interface PlanItem {
|
||||
kind: string;
|
||||
title: string;
|
||||
detail: string;
|
||||
prompt_hint: string;
|
||||
count: number;
|
||||
variant_name?: string | null;
|
||||
}
|
||||
|
||||
/** 默认方案：7 种基础类型各 1 张（AI 规划前） */
|
||||
export const DEFAULT_PLAN: PlanItem[] = SUITE_TYPE_OPTIONS.slice(0, 7).map(t => ({
|
||||
kind: t.value, title: t.label, detail: '', prompt_hint: '', count: 1, variant_name: null,
|
||||
}));
|
||||
|
||||
export const STYLE_SET_OPTIONS = [
|
||||
{ value: 1, label: '经典商拍' },
|
||||
{ value: 2, label: '生活杂志' },
|
||||
{ value: 3, label: '极简高冷' },
|
||||
{ value: 4, label: '活力爆款' },
|
||||
{ value: 5, label: '暗调质感' },
|
||||
] as const;
|
||||
|
||||
/** 目标平台（决定文案语言 + 图片比例）：Ozon/Wildberries → 俄文 3:4，中文 → 中文 1:1 */
|
||||
export const PLATFORM_OPTIONS = [
|
||||
{ value: 'ozon', label: 'Ozon' },
|
||||
{ value: 'wb', label: 'Wildberries' },
|
||||
{ value: 'cn', label: '中文' },
|
||||
] as const;
|
||||
|
||||
export type PlatformId = (typeof PLATFORM_OPTIONS)[number]['value'];
|
||||
|
||||
export const PLATFORM_SPECS: Record<string, { lang: string; ratio: string; label: string }> = {
|
||||
ozon: { lang: '俄文', ratio: '3:4', label: 'Ozon' },
|
||||
wb: { lang: '俄文', ratio: '3:4', label: 'Wildberries' },
|
||||
cn: { lang: '中文', ratio: '1:1', label: '中文' },
|
||||
};
|
||||
|
||||
export interface SuiteImageInfo {
|
||||
type_id: string;
|
||||
name: string;
|
||||
url: string;
|
||||
status: string;
|
||||
error?: string | null;
|
||||
}
|
||||
|
||||
export interface SuiteInfo {
|
||||
id: string;
|
||||
product_id: string;
|
||||
status: 'pending' | 'running' | 'done' | 'partial' | 'failed';
|
||||
style_set: number;
|
||||
platform: string;
|
||||
lang: string;
|
||||
ratio: string;
|
||||
types: string[];
|
||||
provider: string;
|
||||
images: SuiteImageInfo[];
|
||||
error?: string | null;
|
||||
}
|
||||
|
||||
/** 用（可能已二次修改的）文本 + 已勾选图片，组装 /api/materials 请求体 */
|
||||
export function buildMaterialsPayload(
|
||||
result: ScanResult,
|
||||
selectedKeys: Set<string>,
|
||||
edits?: { title?: string; desc?: string },
|
||||
): MaterialsPayload {
|
||||
const orig = (kind: string) => result.texts.find((t) => t.kind === kind);
|
||||
|
||||
const texts: MaterialsPayload['texts'] = [];
|
||||
const title = edits?.title ?? orig('title')?.content ?? '';
|
||||
const price = orig('price')?.content ?? '';
|
||||
const brand = orig('brand')?.content ?? '';
|
||||
const params = orig('params')?.pairs ?? [];
|
||||
const sellingPoints = orig('selling_point')?.content ?? '';
|
||||
const desc = edits?.desc ?? orig('desc')?.content ?? '';
|
||||
|
||||
if (title) texts.push({ kind: 'title', content: title });
|
||||
if (price) texts.push({ kind: 'price', content: price });
|
||||
if (brand) texts.push({ kind: 'brand', content: brand });
|
||||
if (params.length) texts.push({ kind: 'params', content: '', pairs: params });
|
||||
if (sellingPoints) texts.push({ kind: 'selling_point', content: sellingPoints });
|
||||
if (desc) texts.push({ kind: 'desc', content: desc });
|
||||
|
||||
const images = result.images
|
||||
.filter((img) => selectedKeys.has(img.key))
|
||||
.map((img) => ({
|
||||
groupKey: img.groupKey,
|
||||
groupName: img.groupName,
|
||||
variantName: img.variantName ?? null,
|
||||
url: img.url,
|
||||
index: img.index,
|
||||
type: img.type,
|
||||
dedupeKey: img.url,
|
||||
}));
|
||||
|
||||
return {
|
||||
product_id: null,
|
||||
source: {
|
||||
platform: result.platform,
|
||||
itemId: result.itemId,
|
||||
url: result.url,
|
||||
collectedAt: result.scannedAt,
|
||||
},
|
||||
texts,
|
||||
images,
|
||||
refererOrigin: undefined,
|
||||
};
|
||||
}
|
||||
|
||||
function authHeaders(token: string): Record<string, string> {
|
||||
return token ? { Authorization: `Bearer ${token}` } : {};
|
||||
}
|
||||
|
||||
export async function uploadMaterials(
|
||||
baseUrl: string,
|
||||
token: string,
|
||||
payload: MaterialsPayload,
|
||||
): Promise<{ product_id: string; assets_queued: number; assets_skipped: number }> {
|
||||
const res = await fetch(`${baseUrl.replace(/\/$/, '')}/api/materials`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json', ...authHeaders(token) },
|
||||
body: JSON.stringify(payload),
|
||||
});
|
||||
const data = await res.json().catch(() => ({}));
|
||||
if (!res.ok) throw new Error(data?.detail || `上传失败 HTTP ${res.status}`);
|
||||
return data;
|
||||
}
|
||||
|
||||
/** 无状态生成请求体：采集数据 + 勾选图片 + 出图方案，一次携带 */
|
||||
export interface GeneratePayload {
|
||||
texts: Array<{ kind: string; content: string; pairs?: Array<{ key: string; value: string }> | null }>;
|
||||
images: Array<{ url: string; group_key: string; variant_name?: string | null }>;
|
||||
style_set: number;
|
||||
plan: PlanItem[];
|
||||
platform: string;
|
||||
}
|
||||
|
||||
/** 组装无状态生成请求：已编辑的文本 + 已勾选图片 + 出图方案 */
|
||||
export function buildGeneratePayload(
|
||||
result: ScanResult,
|
||||
selectedKeys: Set<string>,
|
||||
edits: { title?: string; desc?: string },
|
||||
config: { style_set: number; plan: PlanItem[]; platform: string },
|
||||
): GeneratePayload {
|
||||
const orig = (kind: string) => result.texts.find((t) => t.kind === kind);
|
||||
|
||||
const texts: GeneratePayload['texts'] = [];
|
||||
const title = edits.title ?? orig('title')?.content ?? '';
|
||||
const price = orig('price')?.content ?? '';
|
||||
const brand = orig('brand')?.content ?? '';
|
||||
const params = orig('params')?.pairs ?? [];
|
||||
const sellingPoints = orig('selling_point')?.content ?? '';
|
||||
const desc = edits.desc ?? orig('desc')?.content ?? '';
|
||||
|
||||
if (title) texts.push({ kind: 'title', content: title });
|
||||
if (price) texts.push({ kind: 'price', content: price });
|
||||
if (brand) texts.push({ kind: 'brand', content: brand });
|
||||
if (params.length) texts.push({ kind: 'params', content: '', pairs: params });
|
||||
if (sellingPoints) texts.push({ kind: 'selling_point', content: sellingPoints });
|
||||
if (desc) texts.push({ kind: 'desc', content: desc });
|
||||
|
||||
const images = result.images
|
||||
.filter((img) => selectedKeys.has(img.key))
|
||||
.map((img) => ({ url: img.url, group_key: img.groupKey, variant_name: img.variantName ?? null }));
|
||||
|
||||
return { texts, images, ...config };
|
||||
}
|
||||
|
||||
/** 出图方案规划请求体 */
|
||||
export interface PlanPayload {
|
||||
texts: Array<{ kind: string; content: string; pairs?: Array<{ key: string; value: string }> | null }>;
|
||||
sku_variants: string[];
|
||||
image_stats: Record<string, number>;
|
||||
platform: string;
|
||||
}
|
||||
|
||||
/** AI 智能规划：DeepSeek 根据商品信息生成出图方案 */
|
||||
export async function planSuite(
|
||||
baseUrl: string,
|
||||
token: string,
|
||||
payload: PlanPayload,
|
||||
): Promise<{ summary: string; items: PlanItem[] }> {
|
||||
const res = await fetch(`${baseUrl.replace(/\/$/, '')}/api/plan`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json', ...authHeaders(token) },
|
||||
body: JSON.stringify(payload),
|
||||
});
|
||||
const data = await res.json().catch(() => ({}));
|
||||
if (!res.ok) throw new Error(data?.detail || `规划失败 HTTP ${res.status}`);
|
||||
return data;
|
||||
}
|
||||
|
||||
/** 无状态一键生成：后端直接用请求数据生图，不落商品库 */
|
||||
export async function generateSuite(
|
||||
baseUrl: string,
|
||||
token: string,
|
||||
payload: GeneratePayload,
|
||||
): Promise<{ suite_id: string }> {
|
||||
const res = await fetch(`${baseUrl.replace(/\/$/, '')}/api/generate`, {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/json', ...authHeaders(token) },
|
||||
body: JSON.stringify(payload),
|
||||
});
|
||||
const data = await res.json().catch(() => ({}));
|
||||
if (!res.ok) throw new Error(data?.detail || `提交失败 HTTP ${res.status}`);
|
||||
return data;
|
||||
}
|
||||
|
||||
/** 查询套图任务状态（轮询用） */
|
||||
export async function getSuite(baseUrl: string, token: string, suiteId: string): Promise<SuiteInfo> {
|
||||
const res = await fetch(`${baseUrl.replace(/\/$/, '')}/api/suites/${suiteId}`, {
|
||||
headers: authHeaders(token),
|
||||
});
|
||||
const data = await res.json().catch(() => ({}));
|
||||
if (!res.ok) throw new Error(data?.detail || `查询失败 HTTP ${res.status}`);
|
||||
return data;
|
||||
}
|
||||
|
||||
export function suiteZipUrl(baseUrl: string, suiteId: string): string {
|
||||
return `${baseUrl.replace(/\/$/, '')}/api/suites/${suiteId}/zip`;
|
||||
}
|
||||
@@ -0,0 +1,54 @@
|
||||
/**
|
||||
* DOM 工具 - 等待元素、Shadow DOM 穿透
|
||||
* 从 extension-v1 移植
|
||||
*/
|
||||
|
||||
/** 等待任一选择器出现（MutationObserver + 超时） */
|
||||
export function waitForAny(
|
||||
selectors: string[],
|
||||
timeoutMs = 10_000
|
||||
): Promise<Element | null> {
|
||||
const hit = () => selectors.map((s) => document.querySelector(s)).find(Boolean) ?? null;
|
||||
|
||||
const found = hit();
|
||||
if (found) return Promise.resolve(found);
|
||||
|
||||
return new Promise((resolve) => {
|
||||
const timer = setTimeout(() => {
|
||||
observer.disconnect();
|
||||
resolve(null);
|
||||
}, timeoutMs);
|
||||
|
||||
const observer = new MutationObserver(() => {
|
||||
const el = hit();
|
||||
if (el) {
|
||||
clearTimeout(timer);
|
||||
observer.disconnect();
|
||||
resolve(el);
|
||||
}
|
||||
});
|
||||
|
||||
observer.observe(document.documentElement, { childList: true, subtree: true });
|
||||
});
|
||||
}
|
||||
|
||||
/** 穿透 Shadow DOM 查询元素（Ozon 部分组件用了 Web Components） */
|
||||
export function queryAllDeep(selectors: string[]): Element[] {
|
||||
const out: Element[] = [];
|
||||
for (const sel of selectors) {
|
||||
let nodes: NodeListOf<Element>;
|
||||
try {
|
||||
nodes = document.querySelectorAll(sel);
|
||||
} catch {
|
||||
continue; // 选择器写错不能拖垮整个扫描
|
||||
}
|
||||
nodes.forEach((el) => {
|
||||
if (el.shadowRoot) {
|
||||
out.push(...Array.from(el.shadowRoot.querySelectorAll('img, video, source')));
|
||||
} else {
|
||||
out.push(el);
|
||||
}
|
||||
});
|
||||
}
|
||||
return out;
|
||||
}
|
||||
@@ -0,0 +1,146 @@
|
||||
/**
|
||||
* 图片提取 - 主图、SKU、详情图、视频
|
||||
* 从 extension-v1 移植，新增：
|
||||
* - srcset 处理（Ozon 画廊是 <img srcset> / <picture><source>）
|
||||
* - toOriginalUrl 传平台规则（Ozon /wc\d+/）
|
||||
*/
|
||||
import {
|
||||
toAbsoluteUrl,
|
||||
toOriginalUrl,
|
||||
urlInBrackets,
|
||||
looksLikeImageUrl,
|
||||
dedupeKey,
|
||||
pickBestFromSrcset,
|
||||
} from './url';
|
||||
import { queryAllDeep } from './dom';
|
||||
import type { ImageGroupKey, SiteProfile, SrcProp } from '../profiles/types';
|
||||
|
||||
export interface ImageMaterial {
|
||||
key: string; // 'main-001'
|
||||
groupKey: ImageGroupKey; // 'main'
|
||||
groupName: string; // '主图'
|
||||
variantName?: string; // SKU 规格名（仅 sku 组）
|
||||
url: string; // 已还原为原图
|
||||
thumbUrl: string; // 页面上的原始小图地址
|
||||
index: number;
|
||||
type: 'img' | 'video';
|
||||
width?: number;
|
||||
height?: number;
|
||||
}
|
||||
|
||||
/** 从元素上读出图片地址与名称，按 srcProps 顺序降级 */
|
||||
function readImageSource(
|
||||
el: Element,
|
||||
srcProps: SrcProp[],
|
||||
nameSelectors?: string[]
|
||||
): { url: string; name: string; imgEl: HTMLImageElement | null } {
|
||||
let url = '';
|
||||
let name = '';
|
||||
let imgEl: HTMLImageElement | null = el instanceof HTMLImageElement ? el : null;
|
||||
|
||||
for (const prop of srcProps) {
|
||||
if (url) break;
|
||||
|
||||
if (prop === 'backgroundImage') {
|
||||
if (el.tagName === 'IMG') {
|
||||
const img = el as HTMLImageElement;
|
||||
url = img.currentSrc || img.src || '';
|
||||
name = img.alt || '';
|
||||
} else {
|
||||
const bg = getComputedStyle(el).backgroundImage || '';
|
||||
const cand = (urlInBrackets(bg) || bg).replace(/['"]/g, '');
|
||||
if (looksLikeImageUrl(cand)) url = cand;
|
||||
}
|
||||
continue;
|
||||
}
|
||||
|
||||
if (prop === 'srcset') {
|
||||
// <img srcset> 或 <source srcset>
|
||||
const raw = el.getAttribute('srcset') || (el as any).srcset || '';
|
||||
if (raw) url = pickBestFromSrcset(raw);
|
||||
continue;
|
||||
}
|
||||
|
||||
const raw = (el as any)[prop] || el.getAttribute(prop);
|
||||
if (raw) {
|
||||
// srcset 场景下 currentSrc 才是实际加载的那张
|
||||
url = prop === 'src' ? ((el as HTMLImageElement).currentSrc || (el as HTMLImageElement).src || '') : raw;
|
||||
}
|
||||
}
|
||||
|
||||
// 选择器命中的是容器、图在子节点上
|
||||
if (!url && el.tagName !== 'IMG') {
|
||||
const inner = el.querySelector('img, source');
|
||||
if (inner) {
|
||||
const srcset = inner.getAttribute('srcset');
|
||||
url = srcset
|
||||
? pickBestFromSrcset(srcset)
|
||||
: inner.getAttribute('data-src') || (inner as HTMLImageElement).currentSrc || (inner as HTMLImageElement).src || '';
|
||||
if (inner instanceof HTMLImageElement) imgEl = inner;
|
||||
if (!name && inner instanceof HTMLImageElement) name = inner.alt || '';
|
||||
}
|
||||
}
|
||||
|
||||
// 名称统一取（SKU 规格名）
|
||||
if (!name && nameSelectors?.length) {
|
||||
for (const sel of nameSelectors) {
|
||||
const t = el.querySelector(sel)?.textContent?.trim();
|
||||
if (t) {
|
||||
name = t;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return { url: url ? toAbsoluteUrl(url) : '', name, imgEl };
|
||||
}
|
||||
|
||||
export function collectImages(profile: SiteProfile): ImageMaterial[] {
|
||||
const result: ImageMaterial[] = [];
|
||||
|
||||
for (const group of profile.imageGroups) {
|
||||
const srcProps = group.srcProps ?? profile.defaultSrcProps;
|
||||
// 去重按组独立：一张图同时是主图和 SKU 图是正常的
|
||||
const seen = new Set<string>();
|
||||
const activeSet = new Set(group.activeSelectors ? queryAllDeep(group.activeSelectors) : []);
|
||||
|
||||
for (const el of queryAllDeep(group.selectors)) {
|
||||
if (activeSet.has(el)) continue;
|
||||
if (group.excludeWithin?.some((sel) => el.closest(sel))) continue;
|
||||
|
||||
const { url: rawUrl, name, imgEl } = readImageSource(el, srcProps, group.nameSelectors);
|
||||
if (!rawUrl) continue;
|
||||
|
||||
if (group.type === 'video' && !/\.(mp4|avi|mov|wmv|m3u8|webm)(\?|$)/i.test(rawUrl) && !/^blob:/i.test(rawUrl)) {
|
||||
continue;
|
||||
}
|
||||
|
||||
const url = group.type === 'img' ? toOriginalUrl(rawUrl, profile.originalUrlRules) : rawUrl;
|
||||
|
||||
// 尺寸过滤
|
||||
if (group.type === 'img' && (group.minWidth || group.minHeight)) {
|
||||
const measured = imgEl ?? (el as HTMLElement);
|
||||
const w = (measured as HTMLImageElement).naturalWidth || (measured as HTMLElement).offsetWidth || 0;
|
||||
const h = (measured as HTMLImageElement).naturalHeight || (measured as HTMLElement).offsetHeight || 0;
|
||||
if (w > 0 && h > 0 && (w < (group.minWidth ?? 0) || h < (group.minHeight ?? 0))) continue;
|
||||
}
|
||||
|
||||
const k = group.key === 'sku' ? `${dedupeKey(url, profile.originalUrlRules)}::${name}` : dedupeKey(url, profile.originalUrlRules);
|
||||
if (seen.has(k)) continue;
|
||||
seen.add(k);
|
||||
|
||||
result.push({
|
||||
key: `${group.key}-${String(result.filter((r) => r.groupKey === group.key).length + 1).padStart(3, '0')}`,
|
||||
groupKey: group.key,
|
||||
groupName: group.name,
|
||||
variantName: group.key === 'sku' ? name || undefined : undefined,
|
||||
url,
|
||||
thumbUrl: rawUrl,
|
||||
index: result.length,
|
||||
type: group.type,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
@@ -0,0 +1,107 @@
|
||||
/**
|
||||
* JSON-LD 提取器（schema.org/Product）
|
||||
*
|
||||
* Ozon 是 SSR 站点，商品页 HTML 里带 application/ld+json，
|
||||
* 是 DOM 之外最稳定的结构化来源（比哈希类名稳定一个数量级）。
|
||||
*
|
||||
* 参考实现（毛子ERP）也解析 application/ld+json 取 description / offers.url。
|
||||
*/
|
||||
|
||||
export interface JsonLdProduct {
|
||||
title?: string;
|
||||
description?: string;
|
||||
brand?: string;
|
||||
sku?: string;
|
||||
price?: string;
|
||||
currency?: string;
|
||||
images: string[];
|
||||
rating?: string;
|
||||
reviewCount?: string;
|
||||
}
|
||||
|
||||
function asString(v: unknown): string | undefined {
|
||||
if (typeof v === 'string') return v;
|
||||
if (typeof v === 'number') return String(v);
|
||||
return undefined;
|
||||
}
|
||||
|
||||
function findProduct(node: unknown): any | null {
|
||||
if (Array.isArray(node)) {
|
||||
for (const item of node) {
|
||||
const r = findProduct(item);
|
||||
if (r) return r;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
if (!node || typeof node !== 'object') return null;
|
||||
|
||||
const obj = node as Record<string, unknown>;
|
||||
const type = obj['@type'];
|
||||
const types = Array.isArray(type) ? type : [type];
|
||||
if (types.some((t) => t === 'Product')) return obj;
|
||||
|
||||
// @graph 包裹
|
||||
if (Array.isArray(obj['@graph'])) {
|
||||
for (const g of obj['@graph']) {
|
||||
const r = findProduct(g);
|
||||
if (r) return r;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
function collectImages(node: unknown, out: string[]): void {
|
||||
if (!node) return;
|
||||
if (typeof node === 'string') {
|
||||
if (/^(https?:)?\/\/.+/i.test(node) && !out.includes(node)) out.push(node);
|
||||
return;
|
||||
}
|
||||
if (Array.isArray(node)) {
|
||||
node.forEach((n) => collectImages(n, out));
|
||||
return;
|
||||
}
|
||||
if (typeof node === 'object') {
|
||||
for (const v of Object.values(node as Record<string, unknown>)) {
|
||||
collectImages(v, out);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export function extractJsonLd(): JsonLdProduct | null {
|
||||
try {
|
||||
const scripts = document.querySelectorAll('script[type="application/ld+json"]');
|
||||
for (const script of Array.from(scripts)) {
|
||||
const text = script.textContent?.trim();
|
||||
if (!text) continue;
|
||||
let data: unknown;
|
||||
try {
|
||||
data = JSON.parse(text);
|
||||
} catch {
|
||||
continue;
|
||||
}
|
||||
const product = findProduct(data);
|
||||
if (!product) continue;
|
||||
|
||||
const offers = Array.isArray(product.offers) ? product.offers[0] : product.offers;
|
||||
const brandName = product.brand?.name ?? (typeof product.brand === 'string' ? product.brand : undefined);
|
||||
|
||||
const images: string[] = [];
|
||||
if (product.image) collectImages(product.image, images);
|
||||
|
||||
return {
|
||||
title: asString(product.name),
|
||||
description: asString(product.description),
|
||||
brand: asString(brandName),
|
||||
sku: asString(product.sku),
|
||||
price: asString(offers?.price),
|
||||
currency: asString(offers?.priceCurrency),
|
||||
images,
|
||||
rating: asString(product.aggregateRating?.ratingValue),
|
||||
reviewCount: asString(product.aggregateRating?.reviewCount),
|
||||
};
|
||||
}
|
||||
} catch (err) {
|
||||
console.warn('[JSON-LD] 提取失败:', err);
|
||||
}
|
||||
return null;
|
||||
}
|
||||
@@ -0,0 +1,283 @@
|
||||
/**
|
||||
* Ozon 内部页 JSON API 提取器（补充路径）
|
||||
*
|
||||
* 参考实现（毛子ERP）的采集核心是直接请求 Ozon 自己的页数据接口：
|
||||
*
|
||||
* GET {origin}/api/entrypoint-api.bx/page/json/v2?url=/product/{id}/
|
||||
* → { widgetStates: { "webCharacteristics-…": "...", "webGallery-…": "...", ... } }
|
||||
*
|
||||
* ★ 关键点（毛子ERP 的做法，也是本文件修复点）：
|
||||
* - 默认页 `/product/{id}/` 里带 **webCharacteristics（全量「特征」）**，
|
||||
* SSR 里的 webShortCharacteristics 只给前 5 项（limit:5）。
|
||||
* - 描述页 `/product/{id}/?layout_container=pdpPage2column&layout_page_index=2`
|
||||
* 里带 webDescription（富文本描述）。
|
||||
* 所以要两个 URL 都请求、合并，才能拿到完整参数表 + 描述。
|
||||
*
|
||||
* ★ 图片只从画廊类 widget 收（白名单），绝不递归全部 widgetStates，
|
||||
* 避免「为您推荐 / 一起购买」等 carousel 图混入。
|
||||
*/
|
||||
|
||||
export interface OzonPageData {
|
||||
title?: string;
|
||||
price?: string;
|
||||
oldPrice?: string;
|
||||
description?: string;
|
||||
/** 主图画廊（仅来自画廊 widget） */
|
||||
images: string[];
|
||||
videos: string[];
|
||||
/** 参数表（kv） */
|
||||
characteristics: Array<{ key: string; value: string }>;
|
||||
}
|
||||
|
||||
const IMG_EXT = /\.(jpg|jpeg|png|webp|gif|avif)(\?|$)/i;
|
||||
const VID_EXT = /\.(mp4|m3u8|webm|mov)(\?|$)/i;
|
||||
|
||||
function parseWidgetState(v: unknown): unknown {
|
||||
if (typeof v !== 'string') return v;
|
||||
try {
|
||||
return JSON.parse(v);
|
||||
} catch {
|
||||
return v;
|
||||
}
|
||||
}
|
||||
|
||||
function parseWidgetStates(widgetStates: unknown): Record<string, unknown> {
|
||||
const out: Record<string, unknown> = {};
|
||||
if (!widgetStates || typeof widgetStates !== 'object') return out;
|
||||
for (const [k, v] of Object.entries(widgetStates as Record<string, unknown>)) {
|
||||
out[k] = parseWidgetState(v);
|
||||
}
|
||||
return out;
|
||||
}
|
||||
|
||||
function pushUnique(arr: string[], v: string): void {
|
||||
if (v && !arr.includes(v)) arr.push(v);
|
||||
}
|
||||
|
||||
/** 递归收集画廊 widget 内的图片/视频 URL（只在这个 widget 内走） */
|
||||
function collectMedia(node: unknown, images: string[], videos: string[]): void {
|
||||
if (!node) return;
|
||||
if (typeof node === 'string') {
|
||||
if (IMG_EXT.test(node)) pushUnique(images, node);
|
||||
else if (VID_EXT.test(node)) pushUnique(videos, node);
|
||||
return;
|
||||
}
|
||||
if (Array.isArray(node)) {
|
||||
node.forEach((n) => collectMedia(n, images, videos));
|
||||
return;
|
||||
}
|
||||
if (typeof node !== 'object') return;
|
||||
for (const v of Object.values(node as Record<string, unknown>)) {
|
||||
collectMedia(v, images, videos);
|
||||
}
|
||||
}
|
||||
|
||||
/** 从 characteristic 类 widget 里收参数表 */
|
||||
function collectCharacteristics(node: unknown, out: Array<{ key: string; value: string }>): void {
|
||||
if (!node || typeof node !== 'object') return;
|
||||
const walk = (n: unknown): void => {
|
||||
if (!n || typeof n !== 'object') return;
|
||||
if (Array.isArray(n)) {
|
||||
n.forEach(walk);
|
||||
return;
|
||||
}
|
||||
const obj = n as Record<string, unknown>;
|
||||
for (const [k, v] of Object.entries(obj)) {
|
||||
if (/characteristic|aspect/i.test(k) && Array.isArray(v)) {
|
||||
for (const row of v) {
|
||||
if (!row || typeof row !== 'object') continue;
|
||||
const r = row as Record<string, unknown>;
|
||||
// { title: {textRs:[{content}]}, values:[{text}] }（Ozon 实测结构）
|
||||
const key = readText(r.title);
|
||||
if (key && Array.isArray(r.values)) {
|
||||
const vals = r.values
|
||||
.map((x) => (x && typeof x === 'object' ? readText((x as Record<string, unknown>).text) : ''))
|
||||
.filter(Boolean);
|
||||
if (vals.length) out.push({ key, value: vals.join(', ') });
|
||||
continue;
|
||||
}
|
||||
// { key/value } / { name/value } / { title/text }
|
||||
const k2 = (r.key ?? r.name ?? r.title) as string | undefined;
|
||||
const v2 = (r.value ?? r.text) as string | undefined;
|
||||
if (typeof k2 === 'string' && k2 && typeof v2 === 'string' && v2) {
|
||||
out.push({ key: k2, value: v2 });
|
||||
}
|
||||
}
|
||||
} else if (/characteristic|aspect/i.test(k) && typeof v === 'object') {
|
||||
walk(v);
|
||||
}
|
||||
}
|
||||
};
|
||||
walk(node);
|
||||
}
|
||||
|
||||
function readText(node: unknown): string {
|
||||
if (!node) return '';
|
||||
if (typeof node === 'string') return node.trim();
|
||||
if (typeof node !== 'object') return '';
|
||||
// { textRs: [{ type, content }] } / { content } / { text }
|
||||
const obj = node as Record<string, unknown>;
|
||||
if (Array.isArray(obj.textRs)) {
|
||||
return obj.textRs
|
||||
.map((t) => (t && typeof t === 'object' ? (t as Record<string, unknown>).content ?? '' : ''))
|
||||
.join('')
|
||||
.trim();
|
||||
}
|
||||
if (typeof obj.content === 'string') return obj.content.trim();
|
||||
if (typeof obj.text === 'string') return obj.text.trim();
|
||||
return '';
|
||||
}
|
||||
|
||||
/** 从描述类 widget 里收富文本描述 */
|
||||
function collectDescription(node: unknown, out: { description?: string }): void {
|
||||
if (!node || typeof node !== 'object') return;
|
||||
const obj = node as Record<string, unknown>;
|
||||
if (typeof obj.richAnnotationJson === 'string') {
|
||||
try {
|
||||
const rich = JSON.parse(obj.richAnnotationJson);
|
||||
out.description = richToString(rich);
|
||||
} catch {
|
||||
out.description = obj.richAnnotationJson;
|
||||
}
|
||||
return;
|
||||
}
|
||||
if (typeof obj.description === 'string') {
|
||||
out.description = obj.description;
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
/** richAnnotationJson（富文本块数组）→ 纯文本 */
|
||||
function richToString(rich: unknown): string {
|
||||
if (!rich) return '';
|
||||
if (typeof rich === 'string') return rich;
|
||||
const texts: string[] = [];
|
||||
const walk = (n: unknown): void => {
|
||||
if (!n) return;
|
||||
if (typeof n === 'string') {
|
||||
texts.push(n);
|
||||
return;
|
||||
}
|
||||
if (Array.isArray(n)) {
|
||||
n.forEach(walk);
|
||||
return;
|
||||
}
|
||||
if (typeof n === 'object') {
|
||||
for (const [k, v] of Object.entries(n as Record<string, unknown>)) {
|
||||
if (k === 'text' && typeof v === 'string') texts.push(v);
|
||||
else if (k !== 'type') walk(v);
|
||||
}
|
||||
}
|
||||
};
|
||||
walk(rich);
|
||||
return texts.join('\n').trim();
|
||||
}
|
||||
|
||||
/** 解析单个 widgetStates → 部分 OzonPageData */
|
||||
function parsePage(widgets: Record<string, unknown>): OzonPageData {
|
||||
const images: string[] = [];
|
||||
const videos: string[] = [];
|
||||
const characteristics: Array<{ key: string; value: string }> = [];
|
||||
const desc: { description?: string } = {};
|
||||
let title: string | undefined;
|
||||
let price: string | undefined;
|
||||
let oldPrice: string | undefined;
|
||||
|
||||
for (const [wkey, wval] of Object.entries(widgets)) {
|
||||
const key = wkey.toLowerCase();
|
||||
|
||||
// 图片/视频：只收主画廊 widget（webGallery），
|
||||
// 不能按 "gallery" 子串匹配 —— webReviewGallery 是「买家照片和视频」，会混入
|
||||
if (key.startsWith('webgallery')) {
|
||||
collectMedia(wval, images, videos);
|
||||
}
|
||||
// 参数表（含全量 webCharacteristics）
|
||||
if (/(characteristic|aspect)/.test(key)) {
|
||||
collectCharacteristics(wval, characteristics);
|
||||
}
|
||||
// 描述
|
||||
if (/(description|richcontent)/.test(key)) {
|
||||
collectDescription(wval, desc);
|
||||
}
|
||||
// 标题 / 价格（各自的 widget）
|
||||
if (/heading|title/.test(key) && !title) {
|
||||
const v = (wval as Record<string, unknown>)?.title ?? (wval as Record<string, unknown>)?.name;
|
||||
if (typeof v === 'string' && v && !/^https?:/i.test(v)) title = v;
|
||||
}
|
||||
if (/webprice/.test(key) && !price) {
|
||||
const p = (wval as Record<string, unknown>)?.price;
|
||||
if (typeof p === 'string') price = p;
|
||||
const op = (wval as Record<string, unknown>)?.originalPrice;
|
||||
if (typeof op === 'string') oldPrice = op;
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
title,
|
||||
price,
|
||||
oldPrice,
|
||||
description: desc.description,
|
||||
images,
|
||||
videos,
|
||||
characteristics: dedupePairs(characteristics),
|
||||
};
|
||||
}
|
||||
|
||||
async function fetchPage(url: string): Promise<Record<string, unknown> | null> {
|
||||
try {
|
||||
const res = await fetch(url, { credentials: 'include', headers: { Accept: 'application/json' } });
|
||||
if (!res.ok) return null;
|
||||
const json = (await res.json()) as { widgetStates?: unknown };
|
||||
return parseWidgetStates(json.widgetStates);
|
||||
} catch (err) {
|
||||
console.warn('[Ozon API] 请求失败:', url, err);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
export async function fetchOzonPageData(itemId: string): Promise<OzonPageData | null> {
|
||||
// 默认页（标题/价格/画廊 + 全量特征 webCharacteristics）+ 描述页（富文本描述）
|
||||
const urls = [
|
||||
`/product/${itemId}/`,
|
||||
`/product/${itemId}/?layout_container=pdpPage2column&layout_page_index=2`,
|
||||
];
|
||||
|
||||
const merged: OzonPageData = { images: [], videos: [], characteristics: [] };
|
||||
let gotAny = false;
|
||||
|
||||
for (const target of urls) {
|
||||
const widgets = await fetchPage(
|
||||
`${location.origin}/api/entrypoint-api.bx/page/json/v2?url=${encodeURIComponent(target)}`,
|
||||
);
|
||||
if (!widgets) continue;
|
||||
const p = parsePage(widgets);
|
||||
gotAny = true;
|
||||
|
||||
merged.title = merged.title || p.title;
|
||||
merged.price = merged.price || p.price;
|
||||
merged.oldPrice = merged.oldPrice || p.oldPrice;
|
||||
merged.description = merged.description || p.description;
|
||||
for (const img of p.images) if (!merged.images.includes(img)) merged.images.push(img);
|
||||
for (const v of p.videos) if (!merged.videos.includes(v)) merged.videos.push(v);
|
||||
for (const c of p.characteristics) merged.characteristics.push(c);
|
||||
}
|
||||
|
||||
merged.characteristics = dedupePairs(merged.characteristics);
|
||||
|
||||
return gotAny &&
|
||||
(merged.images.length || merged.title || merged.price || merged.characteristics.length || merged.description)
|
||||
? merged
|
||||
: null;
|
||||
}
|
||||
|
||||
function dedupePairs(pairs: Array<{ key: string; value: string }>): Array<{ key: string; value: string }> {
|
||||
const seen = new Set<string>();
|
||||
const out: Array<{ key: string; value: string }> = [];
|
||||
for (const p of pairs) {
|
||||
const k = `${p.key}::${p.value}`;
|
||||
if (seen.has(k)) continue;
|
||||
seen.add(k);
|
||||
out.push(p);
|
||||
}
|
||||
return out;
|
||||
}
|
||||
@@ -0,0 +1,244 @@
|
||||
/**
|
||||
* Ozon SSR widget state 提取器（主路径）
|
||||
*
|
||||
* Ozon 页面把每个 widget 的 JSON state 内嵌在 DOM 里：
|
||||
* <div id="state-webGallery-3311626-default-1" data-state='{...}'>
|
||||
* content script 直接读 data-state 即可，无需访问页面 JS（main world）。
|
||||
*
|
||||
* 结构已在真实页面实测（reference/ozon1.html、ozon2.html）：
|
||||
* - webGallery: coverImage / images[{src,alt}]（原图）/ videos[{url,coverUrl}]
|
||||
* - webPrice: price / originalPrice / cardPrice（如 "108,26 ¥"）
|
||||
* - webProductHeading: title
|
||||
* - webShortCharacteristics / webDetailedCharacteristics: characteristics[]
|
||||
* - webAspects: aspects[].variants[].data.{searchableText, coverImage}（SKU 变体）
|
||||
* - webReviewProductScore: totalScore / reviewsCount
|
||||
*
|
||||
* ★ 白名单机制：只读上面这几个 widget 的 state。
|
||||
* 绝不遍历全页 —— "为您推荐 / 一起购买" 等其它商品 carousel 的 state
|
||||
* （webRecommendedProducts / webCarousel / 类似 widget）根本不会被读到。
|
||||
*/
|
||||
import { toAbsoluteUrl } from './url';
|
||||
|
||||
export interface OzonVariant {
|
||||
name: string;
|
||||
image?: string; // 可能为 undefined（纯文字规格，如尺码）
|
||||
}
|
||||
|
||||
export interface BreadcrumbItem {
|
||||
name: string; // 类目名称（如"扑满"、"儿童房"）
|
||||
href: string; // 原始链接（/category/kopilki-15056/ 或 ?category=7041）
|
||||
searchCategoryId?: number; // Ozon 搜索类目 ID（从 ?category=xxx 解析）
|
||||
slug?: string; // URL slug（从 /category/xxx-123/ 解析，含数字 ID）
|
||||
}
|
||||
|
||||
export interface OzonStateData {
|
||||
title?: string;
|
||||
price?: string;
|
||||
originalPrice?: string;
|
||||
rating?: string;
|
||||
reviewCount?: string;
|
||||
galleryImages: string[]; // 原图（无尺寸标记）
|
||||
videos: string[];
|
||||
videoCovers: string[];
|
||||
skuVariants: OzonVariant[];
|
||||
characteristics: Array<{ key: string; value: string }>;
|
||||
breadcrumbs: BreadcrumbItem[]; // 面包屑类目路径
|
||||
}
|
||||
|
||||
/** 允许读取的 widget 前缀白名单 */
|
||||
const ALLOWED_WIDGETS = [
|
||||
'webGallery-',
|
||||
'webPrice-',
|
||||
'webProductHeading-',
|
||||
'webShortCharacteristics-',
|
||||
'webDetailedCharacteristics-',
|
||||
'webCharacteristics-',
|
||||
'webAspects-',
|
||||
'webReviewProductScore-',
|
||||
'breadCrumbs-', // 面包屑类目路径
|
||||
];
|
||||
|
||||
function pushUnique(arr: string[], v: string): void {
|
||||
const abs = toAbsoluteUrl(v);
|
||||
if (abs && !arr.includes(abs)) arr.push(abs);
|
||||
}
|
||||
|
||||
function readTextRs(node: unknown): string {
|
||||
// 提取 textRs / descriptionRs 里的展示文本。
|
||||
// 规则：content/text 字段的值收进文本；递归进入数组/对象找嵌套的 content/text；
|
||||
// 跳过 type/font/color/id/href 等样式与元数据字段（type=newLine 除外）。
|
||||
if (node == null) return '';
|
||||
if (typeof node === 'string') return node.trim();
|
||||
if (typeof node !== 'object') return '';
|
||||
const texts: string[] = [];
|
||||
const walk = (n: unknown): void => {
|
||||
if (!n) return;
|
||||
if (typeof n === 'string') {
|
||||
texts.push(n);
|
||||
return;
|
||||
}
|
||||
if (Array.isArray(n)) {
|
||||
n.forEach(walk);
|
||||
return;
|
||||
}
|
||||
if (typeof n === 'object') {
|
||||
for (const [k, v] of Object.entries(n as Record<string, unknown>)) {
|
||||
if (k === 'type' && (v === 'newLine' || v === 'lineBreak')) {
|
||||
texts.push('\n');
|
||||
} else if (k === 'content' || k === 'text') {
|
||||
walk(v);
|
||||
} else if (v && typeof v === 'object') {
|
||||
walk(v);
|
||||
}
|
||||
// 其它原始值（font/color/id/type='text' 等）直接跳过
|
||||
}
|
||||
}
|
||||
};
|
||||
walk(node);
|
||||
return texts.join('').trim();
|
||||
}
|
||||
|
||||
function parseCharacteristics(chars: unknown): Array<{ key: string; value: string }> {
|
||||
if (!Array.isArray(chars)) return [];
|
||||
const out: Array<{ key: string; value: string }> = [];
|
||||
for (const c of chars) {
|
||||
if (!c || typeof c !== 'object') continue;
|
||||
const row = c as Record<string, unknown>;
|
||||
// 结构 A：{ title: { textRs: [...] }, values: [{ text: ... }] }（实测）
|
||||
const key = readTextRs(row.title);
|
||||
if (Array.isArray(row.values)) {
|
||||
const vals = row.values
|
||||
.map((v) => (v && typeof v === 'object' ? readTextRs((v as Record<string, unknown>).text) : ''))
|
||||
.map((t) => t.replace(/,\s*$/, '')) // 源数据值自带尾逗号（如 "音乐, "）
|
||||
.filter(Boolean);
|
||||
if (key && vals.length) out.push({ key, value: vals.join(', ') });
|
||||
continue;
|
||||
}
|
||||
// 结构 B：{ key, value } / { name, value } / { title, text }
|
||||
const k2 = (row.key ?? row.name ?? row.title) as string | undefined;
|
||||
const v2 = (row.value ?? row.text) as string | undefined;
|
||||
if (typeof k2 === 'string' && k2 && typeof v2 === 'string' && v2) {
|
||||
out.push({ key: k2, value: v2 });
|
||||
}
|
||||
}
|
||||
return out;
|
||||
}
|
||||
|
||||
export function extractOzonState(): OzonStateData {
|
||||
const data: OzonStateData = {
|
||||
galleryImages: [],
|
||||
videos: [],
|
||||
videoCovers: [],
|
||||
skuVariants: [],
|
||||
characteristics: [],
|
||||
breadcrumbs: [],
|
||||
};
|
||||
const seenChars = new Set<string>();
|
||||
|
||||
const els = document.querySelectorAll('div[id^="state-"]');
|
||||
for (const el of Array.from(els)) {
|
||||
const id = el.id.slice('state-'.length);
|
||||
if (!ALLOWED_WIDGETS.some((p) => id.startsWith(p))) continue;
|
||||
const raw = el.getAttribute('data-state');
|
||||
if (!raw) continue;
|
||||
let state: unknown;
|
||||
try {
|
||||
state = JSON.parse(raw);
|
||||
} catch {
|
||||
continue;
|
||||
}
|
||||
if (!state || typeof state !== 'object') continue;
|
||||
const s = state as Record<string, unknown>;
|
||||
|
||||
if (id.startsWith('webGallery-')) {
|
||||
if (typeof s.coverImage === 'string') pushUnique(data.galleryImages, s.coverImage);
|
||||
if (Array.isArray(s.images)) {
|
||||
for (const img of s.images) {
|
||||
const src = img && typeof (img as Record<string, unknown>).src === 'string'
|
||||
? (img as Record<string, unknown>).src as string
|
||||
: undefined;
|
||||
if (src) pushUnique(data.galleryImages, src);
|
||||
}
|
||||
}
|
||||
if (Array.isArray(s.videos)) {
|
||||
for (const v of s.videos) {
|
||||
const rec = v as Record<string, unknown>;
|
||||
if (typeof rec.url === 'string') pushUnique(data.videos, rec.url);
|
||||
if (typeof rec.coverUrl === 'string') pushUnique(data.videoCovers, rec.coverUrl);
|
||||
}
|
||||
}
|
||||
} else if (id.startsWith('webPrice-')) {
|
||||
if (typeof s.price === 'string') data.price = s.price;
|
||||
if (typeof s.originalPrice === 'string') data.originalPrice = s.originalPrice;
|
||||
if (!data.price && typeof s.cardPrice === 'string') data.price = s.cardPrice;
|
||||
} else if (id.startsWith('webProductHeading-')) {
|
||||
if (typeof s.title === 'string') data.title = s.title;
|
||||
} else if (
|
||||
id.startsWith('webShortCharacteristics-') ||
|
||||
id.startsWith('webDetailedCharacteristics-') ||
|
||||
id.startsWith('webCharacteristics-')
|
||||
) {
|
||||
for (const c of parseCharacteristics(s.characteristics)) {
|
||||
const k = `${c.key}::${c.value}`;
|
||||
if (!seenChars.has(k)) {
|
||||
seenChars.add(k);
|
||||
data.characteristics.push(c);
|
||||
}
|
||||
}
|
||||
} else if (id.startsWith('webAspects-')) {
|
||||
if (Array.isArray(s.aspects)) {
|
||||
for (const aspect of s.aspects) {
|
||||
const a = aspect as Record<string, unknown>;
|
||||
if (!Array.isArray(a.variants)) continue;
|
||||
for (const v of a.variants) {
|
||||
const rec = v as Record<string, unknown>;
|
||||
const d = rec.data as Record<string, unknown> | undefined;
|
||||
const name = typeof d?.searchableText === 'string' ? d.searchableText
|
||||
: typeof d?.title === 'string' ? d.title : '';
|
||||
const image = typeof d?.coverImage === 'string' ? d.coverImage : undefined;
|
||||
if (name) data.skuVariants.push({ name, image });
|
||||
}
|
||||
}
|
||||
}
|
||||
} else if (id.startsWith('webReviewProductScore-')) {
|
||||
if (typeof s.totalScore === 'number') data.rating = String(s.totalScore);
|
||||
if (typeof s.reviewsCount === 'number') data.reviewCount = String(s.reviewsCount);
|
||||
} else if (id.startsWith('breadCrumbs-')) {
|
||||
// breadCrumbs widget state: { breadcrumbs: [{text, link, crumbType}] }
|
||||
if (Array.isArray(s.breadcrumbs) && data.breadcrumbs.length === 0) {
|
||||
for (const crumb of s.breadcrumbs) {
|
||||
const c = crumb as Record<string, unknown>;
|
||||
const name = typeof c.text === 'string' ? c.text.trim() : '';
|
||||
const href = typeof c.link === 'string' ? c.link : '';
|
||||
if (!name || !href) continue;
|
||||
// 解析 ?category=7041（highlight 样式链接）
|
||||
const catMatch = href.match(/[?&]category=(\d+)/);
|
||||
const searchCategoryId = catMatch ? Number(catMatch[1]) : undefined;
|
||||
// 解析 /category/kopilki-15056/（末尾带数字 ID 的 slug）
|
||||
const slugMatch = href.match(/\/category\/([^/?]+)/);
|
||||
const slug = slugMatch ? slugMatch[1] : undefined;
|
||||
data.breadcrumbs.push({ name, href, searchCategoryId, slug });
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 如果 widget state 没有面包屑（旧版页面），尝试读 DOM 渲染的 ol
|
||||
if (data.breadcrumbs.length === 0) {
|
||||
const ol = document.querySelector('[class*="breadCrumbs"] ol, nav ol, ol[class*="breadcrumb"]');
|
||||
if (ol) {
|
||||
for (const a of Array.from(ol.querySelectorAll('a[href]'))) {
|
||||
const href = a.getAttribute('href') ?? '';
|
||||
const name = a.textContent?.trim() ?? '';
|
||||
if (!name) continue;
|
||||
const catMatch = href.match(/[?&]category=(\d+)/);
|
||||
const searchCategoryId = catMatch ? Number(catMatch[1]) : undefined;
|
||||
const slugMatch = href.match(/\/category\/([^/?]+)/);
|
||||
const slug = slugMatch ? slugMatch[1] : undefined;
|
||||
data.breadcrumbs.push({ name, href, searchCategoryId, slug });
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return data;
|
||||
}
|
||||
@@ -0,0 +1,342 @@
|
||||
/**
|
||||
* 统一采集引擎入口 - 扫描当前页
|
||||
*
|
||||
* 按平台选择采集策略：
|
||||
* - ozon：四路径（SSR data-state ★主路径 → JSON-LD → 页 JSON API → DOM 兜底），多源合并
|
||||
* - taobao/tmall：SSR（window.__ICE_APP_CONTEXT__）★主路径 + DOM 补充（详情图在 DOM 里）
|
||||
* - 1688：纯 DOM（多套选择器变体）
|
||||
*
|
||||
* 各路径产出的素材最终走同一个合并器：文本按 kind 合并（params 按键并集），
|
||||
* 图片按组去重后重排 key。
|
||||
*/
|
||||
import { matchProfile } from '../profiles';
|
||||
import { waitForAny } from './dom';
|
||||
import { collectImages, type ImageMaterial } from './image';
|
||||
import { collectTexts, mergeTexts, type TextMaterial } from './text';
|
||||
import { extractJsonLd } from './jsonld';
|
||||
import { fetchOzonPageData, type OzonPageData } from './ozon-api';
|
||||
import { extractOzonState, type OzonStateData, type BreadcrumbItem } from './ozon-state';
|
||||
import { extractSSRData, type SSRData } from './ssr';
|
||||
import { buildFromSSR } from './ssr-builder';
|
||||
import { dedupeKey, toOriginalUrl, toThumbUrl } from './url';
|
||||
import type { SiteProfile } from '../profiles/types';
|
||||
|
||||
export type { ImageMaterial, TextMaterial };
|
||||
|
||||
export interface ScanResult {
|
||||
platform: string;
|
||||
itemId: string | null;
|
||||
url: string;
|
||||
texts: TextMaterial[];
|
||||
images: ImageMaterial[];
|
||||
breadcrumbs: BreadcrumbItem[];
|
||||
scannedAt: number;
|
||||
stats: Record<string, number>; // 分组统计
|
||||
warnings: string[]; // 警告（如详情图为 0）
|
||||
source: 'state' | 'ssr' | 'jsonld' | 'api' | 'dom' | 'mixed'; // 主路径
|
||||
}
|
||||
|
||||
const GROUP_ORDER: Array<{ key: ImageMaterial['groupKey']; name: string }> = [
|
||||
{ key: 'main', name: '主图' },
|
||||
{ key: 'sku', name: 'SKU图片' },
|
||||
{ key: 'detail', name: '详情图' },
|
||||
{ key: 'video', name: '视频' },
|
||||
];
|
||||
|
||||
// ── Ozon：结构化合并（state + jsonld + api）───────────────────────────────
|
||||
|
||||
interface StructuredBundle {
|
||||
title?: string;
|
||||
price?: string;
|
||||
brand?: string;
|
||||
description?: string;
|
||||
characteristics: Array<{ key: string; value: string }>;
|
||||
galleryImages: string[];
|
||||
videos: string[];
|
||||
videoCovers: string[];
|
||||
skuVariants: Array<{ name: string; image?: string }>;
|
||||
}
|
||||
|
||||
function mergeStructured(
|
||||
state: OzonStateData,
|
||||
jsonld: ReturnType<typeof extractJsonLd>,
|
||||
api: OzonPageData | null
|
||||
): StructuredBundle {
|
||||
const bundle: StructuredBundle = {
|
||||
title: state.title || jsonld?.title || api?.title,
|
||||
price: state.price || jsonld?.price || api?.price,
|
||||
brand: jsonld?.brand,
|
||||
description: api?.description || jsonld?.description,
|
||||
characteristics: [...state.characteristics],
|
||||
galleryImages: [...state.galleryImages],
|
||||
videos: [...state.videos],
|
||||
videoCovers: [...state.videoCovers],
|
||||
skuVariants: [...state.skuVariants],
|
||||
};
|
||||
|
||||
for (const u of api?.images ?? []) {
|
||||
if (!bundle.galleryImages.includes(u)) bundle.galleryImages.push(u);
|
||||
}
|
||||
for (const u of api?.videos ?? []) {
|
||||
if (!bundle.videos.includes(u)) bundle.videos.push(u);
|
||||
}
|
||||
const seenChars = new Set(bundle.characteristics.map((c) => `${c.key}::${c.value}`));
|
||||
for (const c of api?.characteristics ?? []) {
|
||||
const k = `${c.key}::${c.value}`;
|
||||
if (!seenChars.has(k)) {
|
||||
seenChars.add(k);
|
||||
bundle.characteristics.push(c);
|
||||
}
|
||||
}
|
||||
|
||||
return bundle;
|
||||
}
|
||||
|
||||
function buildFromBundle(profile: SiteProfile, bundle: StructuredBundle): {
|
||||
texts: TextMaterial[];
|
||||
images: ImageMaterial[];
|
||||
} {
|
||||
const texts: TextMaterial[] = [];
|
||||
const images: ImageMaterial[] = [];
|
||||
|
||||
if (bundle.title) texts.push({ kind: 'title', content: bundle.title });
|
||||
if (bundle.price) texts.push({ kind: 'price', content: bundle.price });
|
||||
if (bundle.brand) texts.push({ kind: 'brand', content: bundle.brand });
|
||||
if (bundle.characteristics.length) {
|
||||
texts.push({
|
||||
kind: 'params',
|
||||
content: bundle.characteristics.map((p) => `${p.key}: ${p.value}`).join('\n'),
|
||||
pairs: bundle.characteristics,
|
||||
});
|
||||
}
|
||||
if (bundle.description) texts.push({ kind: 'desc', content: bundle.description });
|
||||
|
||||
let idx = 0;
|
||||
bundle.galleryImages.forEach((u, i) => {
|
||||
const orig = toOriginalUrl(u, profile.originalUrlRules);
|
||||
images.push({
|
||||
key: `main-${String(i + 1).padStart(3, '0')}`,
|
||||
groupKey: 'main',
|
||||
groupName: '主图',
|
||||
url: orig,
|
||||
thumbUrl: toThumbUrl(orig),
|
||||
index: idx++,
|
||||
type: 'img',
|
||||
});
|
||||
});
|
||||
|
||||
bundle.skuVariants.forEach((s, i) => {
|
||||
if (!s.image) return;
|
||||
const orig = toOriginalUrl(s.image, profile.originalUrlRules);
|
||||
images.push({
|
||||
key: `sku-${String(i + 1).padStart(3, '0')}`,
|
||||
groupKey: 'sku',
|
||||
groupName: 'SKU图片',
|
||||
variantName: s.name || undefined,
|
||||
url: orig,
|
||||
thumbUrl: toThumbUrl(orig),
|
||||
index: idx++,
|
||||
type: 'img',
|
||||
});
|
||||
});
|
||||
|
||||
bundle.videos.forEach((u, i) => {
|
||||
images.push({
|
||||
key: `video-${String(i + 1).padStart(3, '0')}`,
|
||||
groupKey: 'video',
|
||||
groupName: '视频',
|
||||
url: u,
|
||||
thumbUrl: bundle.videoCovers[i] ?? '',
|
||||
index: idx++,
|
||||
type: 'video',
|
||||
});
|
||||
});
|
||||
|
||||
return { texts, images };
|
||||
}
|
||||
|
||||
// ── 统一合并器 ────────────────────────────────────────────────────────────
|
||||
|
||||
/** 按组分组合并：靠前来源优先，靠后来源填缺，按 dedupeKey 去重后重排 index */
|
||||
function mergeImages(
|
||||
primary: ImageMaterial[],
|
||||
fallback: ImageMaterial[],
|
||||
profile: SiteProfile
|
||||
): ImageMaterial[] {
|
||||
const byGroup = new Map<string, ImageMaterial[]>();
|
||||
const seen = new Set<string>();
|
||||
let counter = 0;
|
||||
|
||||
const push = (m: ImageMaterial) => {
|
||||
const k = m.groupKey === 'sku'
|
||||
? `${dedupeKey(m.url, profile.originalUrlRules)}::${m.variantName ?? ''}`
|
||||
: dedupeKey(m.url, profile.originalUrlRules);
|
||||
if (seen.has(k)) return;
|
||||
seen.add(k);
|
||||
const arr = byGroup.get(m.groupKey) ?? [];
|
||||
arr.push({ ...m, index: counter++ });
|
||||
byGroup.set(m.groupKey, arr);
|
||||
};
|
||||
|
||||
for (const m of primary) push(m);
|
||||
for (const m of fallback) push(m);
|
||||
|
||||
const out: ImageMaterial[] = [];
|
||||
for (const g of GROUP_ORDER) {
|
||||
const arr = byGroup.get(g.key);
|
||||
if (!arr) continue;
|
||||
arr.forEach((m, i) => {
|
||||
m.key = `${g.key}-${String(i + 1).padStart(3, '0')}`;
|
||||
m.groupName = g.name;
|
||||
});
|
||||
out.push(...arr);
|
||||
}
|
||||
return out;
|
||||
}
|
||||
|
||||
function finalize(
|
||||
profile: SiteProfile,
|
||||
itemId: string | null,
|
||||
texts: TextMaterial[],
|
||||
images: ImageMaterial[],
|
||||
breadcrumbs: BreadcrumbItem[],
|
||||
source: ScanResult['source']
|
||||
): ScanResult {
|
||||
const stats: Record<string, number> = {};
|
||||
for (const img of images) stats[img.groupKey] = (stats[img.groupKey] ?? 0) + 1;
|
||||
|
||||
const warnings: string[] = [];
|
||||
if (!texts.some((t) => t.kind === 'title')) warnings.push('未采集到标题');
|
||||
if (images.length === 0) warnings.push('未扫描到任何图片/视频');
|
||||
if ((stats.detail ?? 0) === 0) warnings.push('详情图为 0 张，请滚动到页面底部后重新采集');
|
||||
|
||||
return {
|
||||
platform: profile.id,
|
||||
itemId,
|
||||
url: location.href,
|
||||
texts,
|
||||
images,
|
||||
breadcrumbs,
|
||||
scannedAt: Date.now(),
|
||||
stats,
|
||||
warnings,
|
||||
source,
|
||||
};
|
||||
}
|
||||
|
||||
// ── 各平台策略 ────────────────────────────────────────────────────────────
|
||||
|
||||
/** Ozon：四路径合并（来自 extension-v2 生产逻辑） */
|
||||
async function scanOzon(profile: SiteProfile, itemId: string | null): Promise<ScanResult> {
|
||||
const state = extractOzonState();
|
||||
let source: ScanResult['source'] = state.title || state.galleryImages.length ? 'state' : 'dom';
|
||||
|
||||
const jsonld = extractJsonLd();
|
||||
|
||||
let api: OzonPageData | null = null;
|
||||
if (itemId) {
|
||||
try {
|
||||
api = await fetchOzonPageData(itemId);
|
||||
} catch (err) {
|
||||
console.warn('[SuiteCollector] API 提取异常:', err);
|
||||
}
|
||||
}
|
||||
|
||||
const bundle = mergeStructured(state, jsonld, api);
|
||||
const structured = buildFromBundle(profile, bundle);
|
||||
if ((structured.texts.some((t) => t.kind === 'title') || structured.images.length > 0) && source === 'dom') {
|
||||
source = 'mixed';
|
||||
}
|
||||
|
||||
const anchor = await waitForAny(profile.readySelectors, profile.readyTimeoutMs ?? 8_000);
|
||||
if (!anchor) console.warn('[SuiteCollector] 等待页面就绪超时（继续尝试 DOM 采集）');
|
||||
const domTexts = collectTexts(profile).materials;
|
||||
const domImages = collectImages(profile);
|
||||
|
||||
const texts = mergeTexts(structured.texts, domTexts);
|
||||
const images = mergeImages(structured.images, domImages, profile);
|
||||
return finalize(profile, itemId, texts, images, state.breadcrumbs, source);
|
||||
}
|
||||
|
||||
/** 淘宝/天猫：SSR 主路径 + DOM 补充（详情图、SKU 兜底都在 DOM 里） */
|
||||
async function scanTaobao(profile: SiteProfile, itemId: string | null): Promise<ScanResult> {
|
||||
const ssrData: SSRData | null = extractSSRData();
|
||||
|
||||
let primaryTexts: TextMaterial[] = [];
|
||||
let primaryImages: ImageMaterial[] = [];
|
||||
let source: ScanResult['source'] = 'dom';
|
||||
let breadcrumbs: BreadcrumbItem[] = [];
|
||||
|
||||
if (ssrData) {
|
||||
const built = buildFromSSR(ssrData, profile);
|
||||
// ssr-builder 的本地类型 groupKey 是 string，这里对齐到 ImageGroupKey
|
||||
primaryTexts = built.texts;
|
||||
primaryImages = built.images as ImageMaterial[];
|
||||
source = 'ssr';
|
||||
}
|
||||
|
||||
const anchor = await waitForAny(profile.readySelectors, profile.readyTimeoutMs ?? 10_000);
|
||||
if (!anchor) console.warn('[SuiteCollector] 等待页面就绪超时（继续尝试 DOM 采集）');
|
||||
const { materials: domTexts, missingRequired } = collectTexts(profile);
|
||||
const domImages = collectImages(profile);
|
||||
|
||||
if (primaryImages.length > 0 && domImages.length > 0) source = 'mixed';
|
||||
|
||||
const texts = mergeTexts(primaryTexts, domTexts);
|
||||
const images = mergeImages(primaryImages, domImages, profile);
|
||||
const result = finalize(profile, itemId ?? ssrData?.item.itemId ?? null, texts, images, breadcrumbs, source);
|
||||
if (missingRequired.length > 0) result.warnings.push(`缺少必需字段: ${missingRequired.join(', ')}`);
|
||||
return result;
|
||||
}
|
||||
|
||||
/** 1688：纯 DOM（多套画廊选择器变体覆盖线上版本） */
|
||||
async function scan1688(profile: SiteProfile, itemId: string | null): Promise<ScanResult> {
|
||||
const anchor = await waitForAny(profile.readySelectors, profile.readyTimeoutMs ?? 10_000);
|
||||
if (!anchor) console.warn('[SuiteCollector] 等待页面就绪超时（继续尝试 DOM 采集）');
|
||||
|
||||
const { materials: texts, missingRequired } = collectTexts(profile);
|
||||
const images = collectImages(profile);
|
||||
const result = finalize(profile, itemId, texts, images, [], 'dom');
|
||||
if (missingRequired.length > 0) result.warnings.push(`缺少必需字段: ${missingRequired.join(', ')}`);
|
||||
return result;
|
||||
}
|
||||
|
||||
// ── 入口 ──────────────────────────────────────────────────────────────────
|
||||
|
||||
export async function scanCurrentPage(): Promise<ScanResult | null> {
|
||||
const profile = matchProfile(location.href);
|
||||
if (!profile) {
|
||||
console.warn('[SuiteCollector] 当前页面不支持采集:', location.href);
|
||||
return null;
|
||||
}
|
||||
|
||||
const itemId = profile.extractItemId(location.href);
|
||||
console.log('[SuiteCollector] 开始采集:', profile.name, itemId, location.href);
|
||||
|
||||
let result: ScanResult | null = null;
|
||||
try {
|
||||
if (profile.id === 'ozon') result = await scanOzon(profile, itemId);
|
||||
else if (profile.id === 'taobao') result = await scanTaobao(profile, itemId);
|
||||
else result = await scan1688(profile, itemId);
|
||||
} catch (err) {
|
||||
console.error('[SuiteCollector] 采集异常:', err);
|
||||
return null;
|
||||
}
|
||||
|
||||
console.log('[SuiteCollector] 采集完成:', {
|
||||
platform: result.platform,
|
||||
texts: result.texts.map((t) => t.kind),
|
||||
images: result.images.length,
|
||||
stats: result.stats,
|
||||
warnings: result.warnings,
|
||||
source: result.source,
|
||||
});
|
||||
return result;
|
||||
}
|
||||
|
||||
// 暴露到全局供 side panel / console 调用
|
||||
if (typeof window !== 'undefined') {
|
||||
(window as any).__SuiteCollector = {
|
||||
scan: scanCurrentPage,
|
||||
};
|
||||
}
|
||||
@@ -0,0 +1,155 @@
|
||||
/**
|
||||
* 从 SSR JSON 构建 ScanResult
|
||||
*/
|
||||
import { toOriginalUrl } from './url';
|
||||
import type { SiteProfile } from '../profiles/types';
|
||||
import type { SSRData } from './ssr';
|
||||
|
||||
// 直接定义类型避免循环依赖
|
||||
interface TextMaterial {
|
||||
kind: 'title' | 'price' | 'params' | 'desc';
|
||||
content: string;
|
||||
pairs?: Array<{ key: string; value: string }>;
|
||||
}
|
||||
|
||||
interface ImageMaterial {
|
||||
key: string;
|
||||
groupKey: string;
|
||||
groupName: string;
|
||||
variantName?: string;
|
||||
url: string;
|
||||
thumbUrl: string;
|
||||
index: number;
|
||||
type: 'img' | 'video';
|
||||
width?: number;
|
||||
height?: number;
|
||||
}
|
||||
|
||||
interface ScanResult {
|
||||
platform: string;
|
||||
itemId: string | null;
|
||||
url: string;
|
||||
texts: TextMaterial[];
|
||||
images: ImageMaterial[];
|
||||
scannedAt: number;
|
||||
stats: Record<string, number>;
|
||||
warnings: string[];
|
||||
}
|
||||
|
||||
export function buildFromSSR(data: SSRData, profile: SiteProfile): ScanResult {
|
||||
const texts: TextMaterial[] = [];
|
||||
const images: ImageMaterial[] = [];
|
||||
|
||||
// 1. 标题（必需）
|
||||
texts.push({
|
||||
kind: 'title',
|
||||
content: data.item.title
|
||||
});
|
||||
|
||||
// 2. 价格
|
||||
if (data.price?.priceText) {
|
||||
texts.push({
|
||||
kind: 'price',
|
||||
content: `￥${data.price.priceText}`
|
||||
});
|
||||
}
|
||||
|
||||
// 3. 参数表
|
||||
const allParams = [
|
||||
...(data.params?.basicParamList || []),
|
||||
...(data.params?.enhanceParamList || [])
|
||||
];
|
||||
if (allParams.length > 0) {
|
||||
const pairs = allParams
|
||||
.filter(p => p.propertyName && p.valueName)
|
||||
.map(p => ({ key: p.propertyName, value: p.valueName }));
|
||||
|
||||
if (pairs.length > 0) {
|
||||
texts.push({
|
||||
kind: 'params',
|
||||
content: pairs.map(p => `${p.key}: ${p.value}`).join('\n'),
|
||||
pairs
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
// 4. 主图（item.images）
|
||||
let idx = 0;
|
||||
(data.item.images || []).forEach((url, i) => {
|
||||
if (!url) return;
|
||||
const origUrl = toOriginalUrl(url);
|
||||
images.push({
|
||||
key: `main-${String(i + 1).padStart(3, '0')}`,
|
||||
groupKey: 'main',
|
||||
groupName: '主图',
|
||||
url: origUrl,
|
||||
thumbUrl: url,
|
||||
index: idx++,
|
||||
type: 'img'
|
||||
});
|
||||
});
|
||||
|
||||
// 5. SKU 图（skuBase.props[0].values）
|
||||
// 淘宝/天猫通常只有一个规格维度（颜色分类），取 props[0]
|
||||
const skuProp = data.skuBase?.props?.[0];
|
||||
if (skuProp?.values) {
|
||||
skuProp.values.forEach((v, i) => {
|
||||
if (!v.image) return; // 有些 SKU 没配图（如天猫那个 vid=43699206432）
|
||||
const origUrl = toOriginalUrl(v.image);
|
||||
images.push({
|
||||
key: `sku-${String(i + 1).padStart(3, '0')}`,
|
||||
groupKey: 'sku',
|
||||
groupName: 'SKU图片',
|
||||
variantName: v.name || undefined,
|
||||
url: origUrl,
|
||||
thumbUrl: v.image,
|
||||
index: idx++,
|
||||
type: 'img'
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// 6. 视频（item.videos）
|
||||
(data.item.videos || []).forEach((v, i) => {
|
||||
if (!v.url) return;
|
||||
images.push({
|
||||
key: `video-${String(i + 1).padStart(3, '0')}`,
|
||||
groupKey: 'video',
|
||||
groupName: '视频',
|
||||
url: v.url,
|
||||
thumbUrl: v.videoThumbnailURL || v.url,
|
||||
index: idx++,
|
||||
type: 'video'
|
||||
});
|
||||
});
|
||||
|
||||
// 统计各组数量
|
||||
const stats: Record<string, number> = {};
|
||||
for (const img of images) {
|
||||
stats[img.groupKey] = (stats[img.groupKey] ?? 0) + 1;
|
||||
}
|
||||
|
||||
// 生成警告
|
||||
const warnings: string[] = [];
|
||||
if (texts.length === 0) {
|
||||
warnings.push('未提取到任何文本');
|
||||
}
|
||||
if (images.length === 0) {
|
||||
warnings.push('未扫描到任何图片/视频');
|
||||
}
|
||||
// SSR 数据里没有详情图，需要 DOM 补充
|
||||
if (stats.detail === undefined) {
|
||||
warnings.push('详情图需 DOM 补充：请滚动到页面底部后重新采集');
|
||||
}
|
||||
|
||||
return {
|
||||
platform: profile.id,
|
||||
itemId: data.item.itemId,
|
||||
url: location.href,
|
||||
texts,
|
||||
images,
|
||||
scannedAt: Date.now(),
|
||||
stats,
|
||||
warnings
|
||||
};
|
||||
}
|
||||
@@ -0,0 +1,79 @@
|
||||
/**
|
||||
* SSR 数据提取器 - 淘宝/天猫页面内嵌 JSON
|
||||
*
|
||||
* 页面 HTML 里有完整商品数据挂在 window.__ICE_APP_CONTEXT__，
|
||||
* 包含标题、主图、SKU（图+名）、价格、参数，比 DOM 采集稳定 10 倍：
|
||||
* - 不受懒加载影响
|
||||
* - 不受改版影响（JSON 结构远比 CSS 类名稳定）
|
||||
* - 一次拿全所有 SKU，无需滚动
|
||||
*
|
||||
* 当前只支持淘宝/天猫（__ICE_APP_CONTEXT__），
|
||||
* 其他平台返回 null，触发 DOM 降级。
|
||||
*/
|
||||
|
||||
export interface SSRData {
|
||||
item: {
|
||||
title: string;
|
||||
itemId: string;
|
||||
images: string[];
|
||||
videos?: Array<{ url: string; videoThumbnailURL?: string }>;
|
||||
};
|
||||
skuBase?: {
|
||||
props: Array<{
|
||||
pid: string;
|
||||
name: string; // "颜色分类" / "商品规格"
|
||||
values: Array<{
|
||||
vid: string;
|
||||
name: string; // SKU 规格名
|
||||
image?: string; // SKU 图片
|
||||
}>;
|
||||
}>;
|
||||
};
|
||||
params?: {
|
||||
basicParamList?: Array<{ propertyName: string; valueName: string }>;
|
||||
enhanceParamList?: Array<{ propertyName: string; valueName: string }>;
|
||||
};
|
||||
price?: {
|
||||
priceText?: string;
|
||||
priceMoney?: string;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* 尝试从页面提取 SSR 数据（淘宝/天猫 __ICE_APP_CONTEXT__）
|
||||
*/
|
||||
export function extractSSRData(): SSRData | null {
|
||||
try {
|
||||
const ctx = (window as any).__ICE_APP_CONTEXT__;
|
||||
if (!ctx?.loaderData?.home?.data?.res) return null;
|
||||
|
||||
const res = ctx.loaderData.home.data.res;
|
||||
|
||||
// 基础结构验证
|
||||
if (!res.item?.title || !res.item?.itemId) return null;
|
||||
|
||||
// 提取参数（两个来源都试）
|
||||
const industryParams = res.plusViewVO?.industryParamVO;
|
||||
const extensionParams = res.componentsVO?.extensionInfoVO?.infos?.find(
|
||||
(i: any) => i.type === 'BASE_PROPS'
|
||||
);
|
||||
|
||||
return {
|
||||
item: {
|
||||
title: res.item.title,
|
||||
itemId: res.item.itemId,
|
||||
images: res.item.images || [],
|
||||
videos: res.item.videos
|
||||
},
|
||||
skuBase: res.skuBase,
|
||||
params: {
|
||||
basicParamList: industryParams?.basicParamList || extensionParams?.items || [],
|
||||
enhanceParamList: industryParams?.enhanceParamList || []
|
||||
},
|
||||
price: res.componentsVO?.priceVO?.price || res.componentsVO?.priceVO?.extraPrice
|
||||
};
|
||||
} catch (err) {
|
||||
console.warn('[SSR] 提取失败:', err);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,110 @@
|
||||
/**
|
||||
* 文本提取 - 标题、价格、参数表、卖点、描述、品牌
|
||||
* 从 extension-v1 移植（DOM 兜底路径）
|
||||
*/
|
||||
import type { SiteProfile, TextRule } from '../profiles/types';
|
||||
|
||||
export interface TextMaterial {
|
||||
kind: TextRule['kind'];
|
||||
content: string;
|
||||
pairs?: Array<{ key: string; value: string }>; // table 模式的结构化结果
|
||||
}
|
||||
|
||||
function clean(s: string): string {
|
||||
return s.replace(/\s+/g, ' ').trim();
|
||||
}
|
||||
|
||||
function extractOne(rule: TextRule): TextMaterial | null {
|
||||
for (const sel of rule.selectors) {
|
||||
let nodes: NodeListOf<Element>;
|
||||
try {
|
||||
nodes = document.querySelectorAll(sel);
|
||||
} catch {
|
||||
continue;
|
||||
}
|
||||
if (!nodes.length) continue;
|
||||
|
||||
// table 模式：参数表
|
||||
if (rule.extract === 'table') {
|
||||
const pairs: Array<{ key: string; value: string }> = [];
|
||||
nodes.forEach((row) => {
|
||||
const k = clean(row.querySelector(rule.tableKeySelector ?? '')?.textContent ?? '');
|
||||
const v = clean(row.querySelector(rule.tableValueSelector ?? '')?.textContent ?? '');
|
||||
if (k && v) pairs.push({ key: k.replace(/[:：]$/, ''), value: v });
|
||||
});
|
||||
if (pairs.length) {
|
||||
return {
|
||||
kind: rule.kind,
|
||||
content: pairs.map((p) => `${p.key}: ${p.value}`).join('\n'),
|
||||
pairs,
|
||||
};
|
||||
}
|
||||
continue;
|
||||
}
|
||||
|
||||
// join 模式：标题被拆成多个 span
|
||||
if (rule.extract === 'join') {
|
||||
let text = '';
|
||||
nodes.forEach((n) => {
|
||||
text += n.textContent ?? '';
|
||||
});
|
||||
text = clean(text);
|
||||
if (text) return { kind: rule.kind, content: text };
|
||||
continue;
|
||||
}
|
||||
|
||||
// first 模式：只取第一个
|
||||
const first = clean(nodes[0].textContent ?? '');
|
||||
if (first) return { kind: rule.kind, content: first };
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
export function collectTexts(profile: SiteProfile): {
|
||||
materials: TextMaterial[];
|
||||
missingRequired: string[];
|
||||
} {
|
||||
const materials: TextMaterial[] = [];
|
||||
const missingRequired: string[] = [];
|
||||
|
||||
for (const rule of profile.textRules) {
|
||||
const m = extractOne(rule);
|
||||
if (m) materials.push(m);
|
||||
else if (rule.required) missingRequired.push(rule.kind);
|
||||
}
|
||||
|
||||
return { materials, missingRequired };
|
||||
}
|
||||
|
||||
/** 合并去重：以 kind 为键，结构化来源优先，DOM 来源兜底。
|
||||
* 参数表（params）特殊处理：两边的 pairs 做并集合并（按 key 去重），
|
||||
* 因为「关于商品」只给前几项，完整「特征」在 DOM 里，需要合并才能拿全。
|
||||
*/
|
||||
export function mergeTexts(
|
||||
primary: TextMaterial[],
|
||||
fallback: TextMaterial[]
|
||||
): TextMaterial[] {
|
||||
const map = new Map<string, TextMaterial>();
|
||||
for (const m of [...primary, ...fallback]) {
|
||||
if (m.kind === 'params') {
|
||||
const existing = map.get('params');
|
||||
if (!existing) {
|
||||
map.set('params', { ...m, pairs: [...(m.pairs ?? [])] });
|
||||
} else {
|
||||
const merged = [...(existing.pairs ?? [])];
|
||||
const seen = new Set(merged.map((p) => p.key));
|
||||
for (const p of m.pairs ?? []) {
|
||||
if (!seen.has(p.key)) {
|
||||
merged.push(p);
|
||||
seen.add(p.key);
|
||||
}
|
||||
}
|
||||
existing.pairs = merged;
|
||||
existing.content = merged.map((p) => `${p.key}: ${p.value}`).join('\n');
|
||||
}
|
||||
continue;
|
||||
}
|
||||
if (!map.has(m.kind)) map.set(m.kind, m);
|
||||
}
|
||||
return Array.from(map.values());
|
||||
}
|
||||
@@ -0,0 +1,132 @@
|
||||
/**
|
||||
* URL 工具链
|
||||
* 从 extension-v1 移植，新增：
|
||||
* - toOriginalUrl 支持平台自定义规则（Ozon 的 /wc\d+/ 路径段尺寸标记）
|
||||
* - pickBestFromSrcset：从 srcset 里挑最大尺寸候选
|
||||
*/
|
||||
|
||||
const IMG_EXT = /\.(jpg|jpeg|png|gif|bmp|heic|webp|avif)$/i;
|
||||
|
||||
export interface UrlRule {
|
||||
match: RegExp;
|
||||
replace: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* 缩略图 URL → 原图 URL
|
||||
* 先走平台规则（Ozon 的 /wc\d+/ → /wc1200/），
|
||||
* 再走阿里系通用规则：xxx.jpg_400x400.jpg → xxx.jpg
|
||||
*/
|
||||
export function toOriginalUrl(url: string, rules?: UrlRule[]): string {
|
||||
let out = url;
|
||||
for (const r of rules ?? []) {
|
||||
// 带 g 标志的正则（query 清洗）要反复 replace，不带 g 的只替换一次
|
||||
if (r.match.global) {
|
||||
out = out.replace(r.match, r.replace);
|
||||
} else if (r.match.test(out)) {
|
||||
out = out.replace(r.match, r.replace);
|
||||
}
|
||||
}
|
||||
const m = out.match(/^(.+?\.(jpg|jpeg|png|gif|bmp|heic|webp|avif))_/i);
|
||||
return m ? m[1] : out;
|
||||
}
|
||||
|
||||
/** url("https://...") → https://... */
|
||||
export function urlInBrackets(s: string): string {
|
||||
if (!s?.trim()) return '';
|
||||
return s.match(/\((.*?)\)/)?.[1]?.replace(/['"]/g, '') ?? '';
|
||||
}
|
||||
|
||||
export function isDataUrl(u: string): boolean {
|
||||
return /^data:image/.test(u);
|
||||
}
|
||||
|
||||
/** 协议相对 // / 根相对 / / 相对路径 → 绝对 URL */
|
||||
export function toAbsoluteUrl(u: string): string {
|
||||
if (!u) return u;
|
||||
if (isDataUrl(u) || u.startsWith('blob:')) return u;
|
||||
const proto = u.startsWith('http:') ? 'http' : 'https';
|
||||
if (/^\/\//.test(u)) return `${proto}:${u}`;
|
||||
if (/^\//.test(u)) return `${location.origin}${u}`;
|
||||
if (!/^(.*):/.test(u)) return `${location.origin}/${u}`;
|
||||
return u;
|
||||
}
|
||||
|
||||
/** 去重用的归一化 key：还原原图 + 剥 query/hash */
|
||||
export function dedupeKey(url: string, rules?: UrlRule[]): string {
|
||||
const base = toOriginalUrl(url, rules);
|
||||
try {
|
||||
const u = new URL(base);
|
||||
u.search = '';
|
||||
u.hash = '';
|
||||
return u.toString();
|
||||
} catch {
|
||||
return base;
|
||||
}
|
||||
}
|
||||
|
||||
export function looksLikeImageUrl(u: string): boolean {
|
||||
if (isDataUrl(u)) return true;
|
||||
try {
|
||||
return IMG_EXT.test(new URL(u).pathname);
|
||||
} catch {
|
||||
return IMG_EXT.test(u);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 从 srcset 里挑最大尺寸候选。
|
||||
* 支持两种语法：
|
||||
* "a.jpg 100w, b.jpg 200w, c.jpg 300w" → c.jpg
|
||||
* "a.jpg 1x, b.jpg 2x" → 最后一个
|
||||
* "a.jpg 400w, b.jpg 800w, c.jpg 1200w, d.jpg" → 最后一个（无描述符 = 兜底最大）
|
||||
*/
|
||||
export function pickBestFromSrcset(srcset: string): string {
|
||||
if (!srcset) return '';
|
||||
const parts = srcset.split(',').map((p) => p.trim()).filter(Boolean);
|
||||
if (!parts.length) return '';
|
||||
|
||||
let best = '';
|
||||
let bestSize = -1;
|
||||
for (const part of parts) {
|
||||
const seg = part.split(/\s+/);
|
||||
const url = seg[0];
|
||||
const desc = seg[1] ?? '';
|
||||
let size = -1;
|
||||
const w = desc.match(/^(\d+)w$/);
|
||||
const x = desc.match(/^(\d+(?:\.\d+)?)x$/);
|
||||
if (w) size = Number(w[1]);
|
||||
else if (x) size = Math.round(Number(x[1]) * 1000);
|
||||
else size = 0; // 无描述符，通常是最小的兜底，但也可能是唯一候选
|
||||
|
||||
if (size >= bestSize) {
|
||||
bestSize = size;
|
||||
best = url;
|
||||
}
|
||||
}
|
||||
return best;
|
||||
}
|
||||
|
||||
/**
|
||||
* Ozon CDN 原图 → wc200 缩略图（侧边栏预览用，省流量）
|
||||
* 实测结构（reference/ozon1.html）：
|
||||
* https://ir.ozone.ru/s3/multimedia-1-5/9290076089.jpg
|
||||
* → https://ir.ozone.ru/s3/multimedia-1-5/wc200/9290076089.jpg
|
||||
* 已带尺寸标记（/wc\d+/、/c\d+/）或非 multimedia 路径的 URL 原样返回。
|
||||
*/
|
||||
export function toThumbUrl(url: string): string {
|
||||
const m = url.match(/^(https?:\/\/[^/]+\/s3\/[^/]+\/)([^/]+)$/);
|
||||
if (m && !/\/wc\d+\//.test(url) && !/\/c\d+\//.test(url)) {
|
||||
return `${m[1]}wc200/${m[2]}`;
|
||||
}
|
||||
return url;
|
||||
}
|
||||
|
||||
/** 清洗文件名非法字符（Windows 兼容） */
|
||||
export function cleanFilename(name: string): string {
|
||||
return name
|
||||
.replace(/[<>:"/\\|?*]/g, '_')
|
||||
.replace(/\s+/g, ' ')
|
||||
.replace(/\s+/g, '_')
|
||||
.substring(0, 80);
|
||||
}
|
||||
@@ -0,0 +1,115 @@
|
||||
/**
|
||||
* 1688 采集配置
|
||||
* 从 docs/extension/plan.md §6.2 移植（选择器来自 v1.1.8 生产 bundle）
|
||||
*/
|
||||
import type { SiteProfile } from './types';
|
||||
|
||||
export const profile1688: SiteProfile = {
|
||||
id: '1688',
|
||||
name: '1688',
|
||||
|
||||
urlPatterns: [/^https:\/\/detail\.1688\.com\/offer\/\d+\.html/],
|
||||
|
||||
extractItemId: (url) => url.match(/\/offer\/(\d+)\.html/)?.[1] ?? null,
|
||||
|
||||
readySelectors: ['.title-content', '#dt-tab', '#screen', '#content'],
|
||||
readyTimeoutMs: 10_000,
|
||||
|
||||
// 懒加载真实地址在 data-* 上（顺序不能动）
|
||||
defaultSrcProps: ['data-lazyload-src', 'data-src', 'currentSrc', 'src'],
|
||||
|
||||
refererOrigin: 'https://www.1688.com',
|
||||
|
||||
textRules: [
|
||||
{
|
||||
kind: 'title',
|
||||
// 标题被拆成多个 .title-text span，必须 join
|
||||
selectors: ['.title-content .title-text', '.title-content h1', '.od-pc-offer-title', 'h1'],
|
||||
extract: 'join',
|
||||
required: true
|
||||
},
|
||||
{
|
||||
kind: 'price',
|
||||
selectors: ['.price-original', '.od-pc-offer-price-priceRange', '.price .value'],
|
||||
extract: 'first'
|
||||
},
|
||||
{
|
||||
kind: 'params',
|
||||
selectors: [
|
||||
'.offer-attr-list .offer-attr-item',
|
||||
'.od-pc-attribute-table tr',
|
||||
'.obj-content .table-tr'
|
||||
],
|
||||
extract: 'table',
|
||||
tableKeySelector: '.offer-attr-item-name, td:first-child, .table-th',
|
||||
tableValueSelector: '.offer-attr-item-value, td:last-child, .table-td'
|
||||
},
|
||||
{
|
||||
kind: 'desc',
|
||||
selectors: ['.de-description-detail', '#detailContentContainer', '.html-description'],
|
||||
extract: 'join'
|
||||
}
|
||||
],
|
||||
|
||||
imageGroups: [
|
||||
{
|
||||
key: 'main',
|
||||
name: '主图',
|
||||
type: 'img',
|
||||
// 四套画廊变体（说明 1688 至少有四个线上版本）
|
||||
selectors: [
|
||||
'#recyclerview .detail-gallery-turn-wrapper .detail-gallery-img',
|
||||
'#screen .od-gallery-turn-item-wrapper .od-gallery-img',
|
||||
'#content .od-scroller-item .v-image-cover',
|
||||
'#content .od-picture-gallery-list .v-image-cover',
|
||||
'#dt-tab img',
|
||||
'.detail-gallery-turn img.detail-gallery-img',
|
||||
'.img-list-wrapper img.od-gallery-img'
|
||||
],
|
||||
activeSelectors: [
|
||||
'.detail-gallery-turn-wrapper.prepic-active .detail-gallery-img',
|
||||
'.od-gallery-turn-item-wrapper.prepic-active .od-gallery-img',
|
||||
'.v-image-cover.image-item-active'
|
||||
],
|
||||
minWidth: 200,
|
||||
minHeight: 200
|
||||
},
|
||||
{
|
||||
key: 'sku',
|
||||
name: 'SKU图片',
|
||||
type: 'img',
|
||||
selectors: [
|
||||
'.pc-sku-wrapper .prop-item-inner-wrapper',
|
||||
'.sku-item-wrapper',
|
||||
'.specification-cell',
|
||||
'.sku-filter-button',
|
||||
'.expand-view-item',
|
||||
'.feature-item img'
|
||||
],
|
||||
// SKU 缩略图是 CSS 背景图
|
||||
srcProps: ['backgroundImage'],
|
||||
// 规格名（五种 DOM 结构）
|
||||
nameSelectors: ['.prop-name', '.sku-item-name', '.item-label', '.label-name', '.normal-text'],
|
||||
minWidth: 20,
|
||||
minHeight: 20
|
||||
},
|
||||
{
|
||||
key: 'detail',
|
||||
name: '详情图',
|
||||
type: 'img',
|
||||
selectors: [
|
||||
'.de-description-detail img',
|
||||
'#detailContentContainer img',
|
||||
'.html-description img'
|
||||
],
|
||||
minWidth: 300,
|
||||
minHeight: 100
|
||||
},
|
||||
{
|
||||
key: 'video',
|
||||
name: '视频',
|
||||
type: 'video',
|
||||
selectors: ['.lib-video video', 'video']
|
||||
}
|
||||
]
|
||||
};
|
||||
@@ -0,0 +1,21 @@
|
||||
/**
|
||||
* Profile 路由 - 根据 URL 匹配平台（ozon / 1688 / 淘宝 / 天猫）
|
||||
*/
|
||||
import type { SiteProfile } from './types';
|
||||
import { profileOzon } from './ozon';
|
||||
import { profile1688 } from './1688';
|
||||
import { profileTaobao } from './taobao';
|
||||
|
||||
const PROFILES: SiteProfile[] = [profileOzon, profile1688, profileTaobao];
|
||||
|
||||
export function matchProfile(url: string): SiteProfile | null {
|
||||
for (const p of PROFILES) {
|
||||
if (p.urlPatterns.some((re) => re.test(url))) {
|
||||
return p;
|
||||
}
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
export { profileOzon, profile1688, profileTaobao };
|
||||
export type { SiteProfile };
|
||||
@@ -0,0 +1,162 @@
|
||||
/**
|
||||
* Ozon 商品页采集配置
|
||||
*
|
||||
* 选择器已在真实页面实测（reference/ozon1.html、ozon2.html，2026-08-15）：
|
||||
* - webProductHeading → <h1> 标题
|
||||
* - webGallery → 主图（<img srcset>，wc50/wc100 缩略图）
|
||||
* - webAspects → SKU 变体（颜色/尺码选择器）
|
||||
* - webShortCharacteristics / webDetailedCharacteristics → 参数表（"关于商品"区）
|
||||
* - webPrice → 价格（DOM 结构复杂，价格主路径走 data-state）
|
||||
*
|
||||
* ★ 主采集路径是 structured（ozon-state.ts 读 SSR data-state + JSON-LD + API），
|
||||
* 本文件的 DOM 选择器只是兜底 + 详情图补充。
|
||||
*/
|
||||
import type { SiteProfile } from './types';
|
||||
|
||||
export const profileOzon: SiteProfile = {
|
||||
id: 'ozon',
|
||||
name: 'Ozon',
|
||||
|
||||
urlPatterns: [
|
||||
// 新版: https://www.ozon.ru/product/slug-123456789/
|
||||
/^https:\/\/[^/]+\.ozon\.(ru|kz|by)\/product\/[^/]+-\d+\/?/,
|
||||
// 旧版: https://www.ozon.ru/context/detail/id/123456789/
|
||||
/^https:\/\/[^/]+\.ozon\.(ru|kz|by)\/context\/detail\/id\/\d+/,
|
||||
],
|
||||
|
||||
extractItemId: (url) => {
|
||||
const m = url.match(/\/product\/[^/]+-(\d+)\/?/);
|
||||
if (m?.[1]) return m[1];
|
||||
const m2 = url.match(/\/context\/detail\/id\/(\d+)/);
|
||||
return m2?.[1] ?? null;
|
||||
},
|
||||
|
||||
readySelectors: [
|
||||
'[data-widget="webProductHeading"]',
|
||||
'[data-widget="webGallery"]',
|
||||
'h1',
|
||||
],
|
||||
readyTimeoutMs: 8_000,
|
||||
|
||||
// Ozon 画廊图片是 <img srcset>，懒加载真实地址在 srcset / currentSrc / src
|
||||
defaultSrcProps: ['srcset', 'currentSrc', 'src', 'data-src'],
|
||||
|
||||
refererOrigin: 'https://www.ozon.ru',
|
||||
|
||||
textRules: [
|
||||
{
|
||||
kind: 'title',
|
||||
selectors: [
|
||||
'[data-widget="webProductHeading"] h1',
|
||||
'h1[itemprop="name"]',
|
||||
'h1',
|
||||
],
|
||||
extract: 'first',
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
kind: 'price',
|
||||
selectors: [
|
||||
'[data-widget="webPrice"] span',
|
||||
'span[itemprop="price"]',
|
||||
'[data-widget="webPrice"]',
|
||||
],
|
||||
extract: 'first',
|
||||
},
|
||||
{
|
||||
kind: 'params',
|
||||
selectors: [
|
||||
'[data-widget="webDetailedCharacteristics"] dl',
|
||||
'[data-widget="webCharacteristics"] dl',
|
||||
'[data-widget="webShortCharacteristics"] dl',
|
||||
'[data-widget="webAspects"] dl',
|
||||
'#section-characteristics dl',
|
||||
],
|
||||
extract: 'table',
|
||||
tableKeySelector: 'dt, [class*="key"], [class*="Key"], [class*="label"]',
|
||||
tableValueSelector: 'dd, [class*="value"], [class*="Value"]',
|
||||
},
|
||||
{
|
||||
kind: 'selling_point',
|
||||
selectors: [
|
||||
'[data-widget="webShortCharacteristics"]',
|
||||
'[data-widget="webFeatures"]',
|
||||
'[data-widget="webAO"]',
|
||||
],
|
||||
extract: 'join',
|
||||
},
|
||||
{
|
||||
kind: 'desc',
|
||||
selectors: [
|
||||
'[data-widget="webDescription"]',
|
||||
'[data-widget="webRichContent"]',
|
||||
'#section-description',
|
||||
],
|
||||
extract: 'join',
|
||||
},
|
||||
],
|
||||
|
||||
imageGroups: [
|
||||
{
|
||||
key: 'main',
|
||||
name: '主图',
|
||||
type: 'img',
|
||||
selectors: [
|
||||
'[data-widget="webGallery"] img',
|
||||
'[data-widget="webGallery"] source',
|
||||
'[data-widget="webPhotoGallery"] img',
|
||||
],
|
||||
// 不设 minWidth：画廊缩略图 naturalWidth 可能很小，原图靠 toOriginalUrl 还原
|
||||
},
|
||||
{
|
||||
key: 'sku',
|
||||
name: 'SKU图片',
|
||||
type: 'img',
|
||||
selectors: [
|
||||
// 实测：变体选择器在 webAspects（webDetailSKU 其实是"复制 SKU"按钮，没有图）
|
||||
'[data-widget="webAspects"] img',
|
||||
'[data-widget="webVariants"] img',
|
||||
],
|
||||
nameSelectors: [
|
||||
'span[class*="Value"]',
|
||||
'span[class*="Text"]',
|
||||
'span',
|
||||
],
|
||||
minWidth: 16,
|
||||
minHeight: 16,
|
||||
},
|
||||
{
|
||||
key: 'detail',
|
||||
name: '详情图',
|
||||
type: 'img',
|
||||
selectors: [
|
||||
'[data-widget="webDescription"] img',
|
||||
'[data-widget="webRichContent"] img',
|
||||
'[data-widget="webFeatures"] img',
|
||||
'#section-description img',
|
||||
],
|
||||
minWidth: 300,
|
||||
minHeight: 100,
|
||||
},
|
||||
{
|
||||
key: 'video',
|
||||
name: '视频',
|
||||
type: 'video',
|
||||
selectors: [
|
||||
'[data-widget="webGallery"] video',
|
||||
'[data-widget="webVideo"] video',
|
||||
],
|
||||
},
|
||||
],
|
||||
|
||||
// 实测 CDN（ir.ozone.ru）：尺寸标记是路径段 /wc\d+/（wc50…wc1000）和 /c\d+/（c50/c600）
|
||||
// 去掉标记即为原图（页面本身就有无标记的原始 URL）。
|
||||
originalUrlRules: [
|
||||
{ match: /\/wc\d+\//, replace: '/' },
|
||||
{ match: /\/c\d+\//, replace: '/' },
|
||||
// 去掉尺寸段后路径里会有双斜杠（不动 https:// 的 //）
|
||||
{ match: /(?<!:)\/{2,}/g, replace: '/' },
|
||||
// 兼容 query 参数形式的尺寸（?width=200&h=300 逐个剥掉）
|
||||
{ match: /[?&](width|height|size|quality|w|h)=[^&]+/g, replace: '' },
|
||||
],
|
||||
};
|
||||
@@ -0,0 +1,137 @@
|
||||
/**
|
||||
* 淘宝 / 天猫采集配置
|
||||
*
|
||||
* 选择器全部来自真实页面实测（2026-08-11，两个商品页各跑一轮反向探测）：
|
||||
* 天猫 detail.tmall.com/item.htm?id=960057430812
|
||||
* 淘宝 item.taobao.com/item.htm?id=1060253247160
|
||||
* 两站 DOM 完全一致（同一套前端），一份 profile 覆盖。
|
||||
*
|
||||
* 类名是 CSS Modules 的 `语义前缀--哈希` 形式，哈希每次构建都变，
|
||||
* 所以一律用 `[class*="前缀--"]` 前缀匹配。
|
||||
*
|
||||
* 结尾那个 `--` 不能省——它把父容器和子元素区分开：
|
||||
* `generalParamsInfoItem--` 不会误命中 `generalParamsInfoItemTitle--`。
|
||||
*
|
||||
* 实测证据见 docs/extension/selectors-taobao.md
|
||||
*/
|
||||
import type { SiteProfile } from './types';
|
||||
|
||||
export const profileTaobao: SiteProfile = {
|
||||
id: 'taobao',
|
||||
name: '淘宝/天猫',
|
||||
|
||||
urlPatterns: [
|
||||
/^https:\/\/item\.taobao\.com\/item\.htm/,
|
||||
/^https:\/\/detail\.tmall\.com\/item\.htm/,
|
||||
],
|
||||
|
||||
extractItemId: (url) => url.match(/[?&]id=(\d+)/)?.[1] ?? null,
|
||||
|
||||
// 页面上没有 <h1>，别再拿它探活
|
||||
readySelectors: [
|
||||
'[class*="mainTitle--"]',
|
||||
'[class*="picGallery--"]',
|
||||
'#picGalleryEle',
|
||||
],
|
||||
readyTimeoutMs: 10_000,
|
||||
|
||||
// 阿里系 CDN 规则与 1688 相同
|
||||
defaultSrcProps: ['data-lazyload-src', 'data-src', 'currentSrc', 'src'],
|
||||
|
||||
refererOrigin: 'https://www.taobao.com',
|
||||
|
||||
textRules: [
|
||||
{
|
||||
kind: 'title',
|
||||
// mainTitle-- 是纯文本节点（探测里 imgs=0），最干净
|
||||
// ItemTitle-- / MainTitle-- 是外层容器，带图标，作兜底
|
||||
// 注意：属性选择器区分大小写，三个都得写
|
||||
selectors: [
|
||||
'[class*="mainTitle--"]',
|
||||
'[class*="MainTitle--"]',
|
||||
'[class*="ItemTitle--"]',
|
||||
],
|
||||
extract: 'first',
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
kind: 'price',
|
||||
// highlightPrice-- 是当前实际售价，两站一致
|
||||
// priceWrap-- 是外层，会把"优惠前￥36.8"一起带进来，只作兜底
|
||||
selectors: [
|
||||
'[class*="highlightPrice--"]',
|
||||
'[class*="priceWrap--"]',
|
||||
],
|
||||
extract: 'first',
|
||||
},
|
||||
{
|
||||
kind: 'params',
|
||||
// generalParamsInfoItem-- 每项含 Title(键) + SubTitle(值)
|
||||
selectors: ['[class*="generalParamsInfoItem--"]'],
|
||||
extract: 'table',
|
||||
tableKeySelector: '[class*="ParamsInfoItemTitle--"]',
|
||||
tableValueSelector: '[class*="ParamsInfoItemSubTitle--"]',
|
||||
},
|
||||
// desc 故意不采：详情容器 detailInfo-- 里混着用户评价、参数、图文详情，
|
||||
// join 出来是一坨无法使用的字符串。1688/淘宝的中文文案对 Ozon 价值也低
|
||||
// （见 docs/extension/1688-taobao-implementation.md 采集优先级）。
|
||||
],
|
||||
|
||||
imageGroups: [
|
||||
{
|
||||
key: 'main',
|
||||
name: '主图',
|
||||
type: 'img',
|
||||
// picGallery-- 内含大图 + 缩略图，同一张图的两种尺寸
|
||||
// toOriginalUrl() 剥掉尺寸后缀后 dedupeKey 相同，会自动去重
|
||||
selectors: [
|
||||
'[class*="picGallery--"] img',
|
||||
'#picGalleryEle img',
|
||||
'[class*="thumbnailPic--"]',
|
||||
],
|
||||
// 不设 minWidth：缩略图 naturalWidth 只有 60 左右，
|
||||
// 按 200 过滤会把主图全误杀（原图靠 toOriginalUrl 还原）
|
||||
},
|
||||
{
|
||||
key: 'sku',
|
||||
name: 'SKU图片',
|
||||
type: 'img',
|
||||
// ★ 与 1688 不同：淘宝 SKU 是真实 <img>，不是 CSS 背景图
|
||||
// 探测证据：valueItem-- n=22 imgs=22（每项恰含一张 img）
|
||||
// 所以这里不能用 srcProps: ['backgroundImage']
|
||||
selectors: [
|
||||
'[class*="valueItem--"]',
|
||||
'[class*="valueItemImgWrap--"]',
|
||||
],
|
||||
nameSelectors: ['[class*="valueItemText--"]'],
|
||||
minWidth: 20,
|
||||
minHeight: 20,
|
||||
},
|
||||
{
|
||||
key: 'detail',
|
||||
name: '详情图',
|
||||
type: 'img',
|
||||
// 图文详情是懒加载的，需用户点开「图文详情」tab 或滚到底
|
||||
selectors: [
|
||||
'[class*="tabDetailWrap--"] img',
|
||||
'[class*="detailInfo--"] img',
|
||||
],
|
||||
// detailInfo-- 同时包着「用户评价」区，买家晒单图能有 400-800px，
|
||||
// 光靠 minWidth 滤不掉。这些图带水印、质量差，不能采
|
||||
excludeWithin: [
|
||||
'[class*="Comment--"]',
|
||||
'[class*="comments--"]',
|
||||
'[class*="userInfo--"]',
|
||||
'[class*="rate"]',
|
||||
],
|
||||
minWidth: 300,
|
||||
minHeight: 100,
|
||||
},
|
||||
{
|
||||
key: 'video',
|
||||
name: '视频',
|
||||
type: 'video',
|
||||
selectors: ['[class*="picGallery--"] video', 'video'],
|
||||
},
|
||||
],
|
||||
};
|
||||
@@ -0,0 +1,69 @@
|
||||
/**
|
||||
* Site Profile - 平台采集配置（声明式）
|
||||
*
|
||||
* 与 extension-v1 同一套抽象，新增 Ozon 需要的文本类型：
|
||||
* selling_point（卖点 / About this item）、brand（品牌）。
|
||||
*
|
||||
* 采集引擎（collector/）完全通用，加一个新平台只需新增一个 profile。
|
||||
*/
|
||||
|
||||
export type TextKind =
|
||||
| 'title'
|
||||
| 'price'
|
||||
| 'params'
|
||||
| 'selling_point'
|
||||
| 'desc'
|
||||
| 'brand';
|
||||
|
||||
export type ImageGroupKey = 'main' | 'sku' | 'detail' | 'video';
|
||||
|
||||
export type SrcProp =
|
||||
| 'data-lazyload-src'
|
||||
| 'data-src'
|
||||
| 'srcset'
|
||||
| 'currentSrc'
|
||||
| 'src'
|
||||
| 'backgroundImage';
|
||||
|
||||
export interface TextRule {
|
||||
kind: TextKind;
|
||||
/** 多套选择器，逐个尝试直到命中 */
|
||||
selectors: string[];
|
||||
extract: 'join' | 'first' | 'table';
|
||||
/** table 模式的 key/value 子选择器 */
|
||||
tableKeySelector?: string;
|
||||
tableValueSelector?: string;
|
||||
required?: boolean;
|
||||
}
|
||||
|
||||
export interface ImageGroupRule {
|
||||
key: ImageGroupKey;
|
||||
name: string;
|
||||
type: 'img' | 'video';
|
||||
selectors: string[];
|
||||
/** 覆盖 defaultSrcProps */
|
||||
srcProps?: SrcProp[];
|
||||
/** SKU 规格名来源 */
|
||||
nameSelectors?: string[];
|
||||
/** 画廊"当前高亮"元素（排除） */
|
||||
activeSelectors?: string[];
|
||||
/** 位于这些容器内的图片一律跳过（el.closest 判断） */
|
||||
excludeWithin?: string[];
|
||||
minWidth?: number;
|
||||
minHeight?: number;
|
||||
}
|
||||
|
||||
export interface SiteProfile {
|
||||
id: string;
|
||||
name: string;
|
||||
urlPatterns: RegExp[];
|
||||
extractItemId: (url: string) => string | null;
|
||||
readySelectors: string[];
|
||||
readyTimeoutMs?: number;
|
||||
defaultSrcProps: SrcProp[];
|
||||
textRules: TextRule[];
|
||||
imageGroups: ImageGroupRule[];
|
||||
/** 图片 URL 还原原图规则（缺省用通用 CDN 后缀规则） */
|
||||
originalUrlRules?: Array<{ match: RegExp; replace: string }>;
|
||||
refererOrigin?: string;
|
||||
}
|
||||
@@ -0,0 +1,43 @@
|
||||
/**
|
||||
* 服务端设置（上传/生成用）：后端地址 + Bearer Token，持久化到 chrome.storage.local。
|
||||
*/
|
||||
export interface BackendSettings {
|
||||
baseUrl: string;
|
||||
token: string;
|
||||
}
|
||||
|
||||
const KEY = 'suite_backend_settings';
|
||||
|
||||
export const DEFAULT_BASE_URL = 'http://127.0.0.1:3300';
|
||||
|
||||
const DEFAULT: BackendSettings = {
|
||||
baseUrl: DEFAULT_BASE_URL,
|
||||
token: '',
|
||||
};
|
||||
|
||||
/** 历史默认地址 → 当前默认地址（换端口后自动迁移用户已保存的设置） */
|
||||
const MIGRATE: Record<string, string> = {
|
||||
'http://127.0.0.1:8810': DEFAULT_BASE_URL,
|
||||
'http://127.0.0.1:8800': DEFAULT_BASE_URL,
|
||||
'http://127.0.0.1:7000': DEFAULT_BASE_URL,
|
||||
'http://localhost:7000': DEFAULT_BASE_URL,
|
||||
'http://127.0.0.1:7200': DEFAULT_BASE_URL,
|
||||
'http://localhost:7200': DEFAULT_BASE_URL,
|
||||
'http://localhost:3300': DEFAULT_BASE_URL,
|
||||
};
|
||||
|
||||
export async function loadSettings(): Promise<BackendSettings> {
|
||||
const r = await chrome.storage.local.get(KEY);
|
||||
const saved = r[KEY] ?? {};
|
||||
const baseUrl = MIGRATE[saved.baseUrl] ?? saved.baseUrl ?? DEFAULT.baseUrl;
|
||||
const s: BackendSettings = { token: '', ...saved, baseUrl };
|
||||
if (baseUrl !== saved.baseUrl) await chrome.storage.local.set({ [KEY]: s }); // 迁移结果写回
|
||||
return s;
|
||||
}
|
||||
|
||||
export async function saveSettings(s: BackendSettings): Promise<void> {
|
||||
// localhost 会被 Chrome 解析为 IPv6 ::1，若该端口被系统服务（如 macOS AirPlay）占用会 403，
|
||||
// 统一改写为 IPv4 的 127.0.0.1
|
||||
s = { ...s, baseUrl: s.baseUrl.replace('//localhost:', '//127.0.0.1:') };
|
||||
await chrome.storage.local.set({ [KEY]: s });
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
{
|
||||
"extends": "./.wxt/tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"jsx": "react-jsx",
|
||||
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
||||
"noUnusedLocals": true,
|
||||
"noUnusedParameters": true,
|
||||
"noFallthroughCasesInSwitch": true
|
||||
},
|
||||
"exclude": ["node_modules", ".output"]
|
||||
}
|
||||
@@ -0,0 +1,33 @@
|
||||
import { defineConfig } from 'wxt';
|
||||
|
||||
export default defineConfig({
|
||||
manifest: {
|
||||
name: '电商套图工作台',
|
||||
description: '采集 Ozon / 1688 / 淘宝 / 天猫 商品信息与图片，一键生成电商套图并导出',
|
||||
permissions: [
|
||||
'storage',
|
||||
'sidePanel',
|
||||
'activeTab',
|
||||
'scripting' // 执行 content script 函数需要
|
||||
],
|
||||
host_permissions: [
|
||||
// Ozon 商品页 + 图片 CDN
|
||||
'https://*.ozon.ru/*',
|
||||
'https://*.ozon.kz/*',
|
||||
'https://*.ozon.by/*',
|
||||
'https://*.ozonusercontent.com/*',
|
||||
// 1688 / 淘宝 / 天猫 + 阿里 CDN
|
||||
'https://detail.1688.com/*',
|
||||
'https://item.taobao.com/*',
|
||||
'https://detail.tmall.com/*',
|
||||
'https://*.alicdn.com/*',
|
||||
// 本机后端（上传 / 生成套图用）；生产换成你的公网域名
|
||||
'http://127.0.0.1:3300/*',
|
||||
'http://localhost:3300/*'
|
||||
],
|
||||
action: {
|
||||
default_title: '电商套图工作台'
|
||||
}
|
||||
},
|
||||
modules: ['react']
|
||||
});
|
||||
@@ -0,0 +1,166 @@
|
||||
"""采集入库：插件上传文本 + 图片 URL，落库后异步转存。"""
|
||||
from __future__ import annotations
|
||||
|
||||
import re
|
||||
from uuid import UUID
|
||||
|
||||
from fastapi import APIRouter, BackgroundTasks, Depends, HTTPException
|
||||
from sqlalchemy import select
|
||||
from sqlalchemy.ext.asyncio import AsyncSession
|
||||
|
||||
from db import get_db, get_session_factory
|
||||
from models import (
|
||||
Product, ProductAsset,
|
||||
STATUS_PENDING, STATUS_DOWNLOADING, STATUS_OK, STATUS_FAILED, STAGE_COLLECTED,
|
||||
)
|
||||
from schemas import MaterialsRequest, MaterialsResponse, TextMaterial
|
||||
from services import storage
|
||||
|
||||
router = APIRouter(prefix="/api", tags=["collection"])
|
||||
|
||||
|
||||
def _parse_number(text: str | None) -> float | None:
|
||||
"""'1 290 ₽' / '￥36.80' → 1290.0 / 36.8"""
|
||||
if not text:
|
||||
return None
|
||||
m = re.search(r"(\d+(?:[.,]\d+)?)", text.replace(" ", "").replace(",", "."))
|
||||
return float(m.group(1)) if m else None
|
||||
|
||||
|
||||
def _apply_texts(product: Product, texts: list[TextMaterial]) -> None:
|
||||
raw = dict(product.raw or {})
|
||||
raw_texts: list[dict] = list(raw.get("texts") or [])
|
||||
for t in texts:
|
||||
raw_texts.append({"kind": t.kind, "content": t.content, "pairs": t.pairs})
|
||||
if t.kind == "title" and t.content and not product.name:
|
||||
product.name = t.content
|
||||
raw["title"] = t.content
|
||||
elif t.kind == "price":
|
||||
raw["price"] = t.content
|
||||
num = _parse_number(t.content)
|
||||
if num is not None and (product.price is None or product.price == 0):
|
||||
product.price = num
|
||||
elif t.kind == "params" and t.pairs:
|
||||
# 与已有参数按 key 并集合并（跨页追加时同一参数不重复）
|
||||
merged = {p["key"]: p["value"] for p in (raw.get("params") or [])}
|
||||
for p in t.pairs:
|
||||
merged.setdefault(p["key"], p["value"])
|
||||
raw["params"] = [{"key": k, "value": v} for k, v in merged.items()]
|
||||
elif t.kind == "selling_point":
|
||||
raw["sellingPoints"] = t.content
|
||||
elif t.kind == "desc":
|
||||
raw["desc"] = t.content
|
||||
if not product.description:
|
||||
product.description = t.content
|
||||
elif t.kind == "brand":
|
||||
raw["brand"] = t.content
|
||||
raw["texts"] = raw_texts
|
||||
product.raw = raw
|
||||
|
||||
|
||||
async def _get_or_create_product(db: AsyncSession, req: MaterialsRequest) -> Product:
|
||||
if req.product_id:
|
||||
product = await db.get(Product, UUID(req.product_id))
|
||||
if product is None:
|
||||
raise HTTPException(status_code=404, detail="商品不存在")
|
||||
return product
|
||||
product = Product(
|
||||
stage=STAGE_COLLECTED,
|
||||
source_platform=req.source.platform,
|
||||
source_item_id=req.source.itemId,
|
||||
source_url=req.source.url,
|
||||
)
|
||||
db.add(product)
|
||||
await db.flush()
|
||||
return product
|
||||
|
||||
|
||||
@router.post("/materials", response_model=MaterialsResponse)
|
||||
async def create_materials(
|
||||
req: MaterialsRequest,
|
||||
background: BackgroundTasks,
|
||||
db: AsyncSession = Depends(get_db),
|
||||
) -> MaterialsResponse:
|
||||
product = await _get_or_create_product(db, req)
|
||||
_apply_texts(product, req.texts)
|
||||
|
||||
if not product.source_url:
|
||||
product.source_url = req.source.url
|
||||
if not product.source_platform:
|
||||
product.source_platform = req.source.platform
|
||||
|
||||
# 去重 + 建素材
|
||||
existing: set[str] = set()
|
||||
if req.images:
|
||||
rows = (await db.execute(
|
||||
select(ProductAsset.dedupe_key).where(
|
||||
ProductAsset.product_id == product.id,
|
||||
ProductAsset.dedupe_key.isnot(None),
|
||||
)
|
||||
)).scalars().all()
|
||||
existing = {k for k in rows if k}
|
||||
|
||||
queued, skipped = 0, 0
|
||||
for img in req.images:
|
||||
if img.dedupeKey and img.dedupeKey in existing:
|
||||
skipped += 1
|
||||
continue
|
||||
db.add(ProductAsset(
|
||||
product_id=product.id,
|
||||
group_key=img.groupKey,
|
||||
variant_name=img.variantName,
|
||||
sort_order=img.index,
|
||||
type=img.type,
|
||||
source_url=img.url,
|
||||
status=STATUS_PENDING,
|
||||
dedupe_key=img.dedupeKey,
|
||||
))
|
||||
if img.dedupeKey:
|
||||
existing.add(img.dedupeKey)
|
||||
queued += 1
|
||||
|
||||
# 更新分组计数
|
||||
counts: dict = {}
|
||||
for a in await db.scalars(select(ProductAsset).where(ProductAsset.product_id == product.id)):
|
||||
counts[a.group_key] = counts.get(a.group_key, 0) + 1
|
||||
product.asset_counts = counts
|
||||
|
||||
await db.commit()
|
||||
await db.refresh(product)
|
||||
|
||||
if queued:
|
||||
background.add_task(process_product_assets, str(product.id))
|
||||
return MaterialsResponse(product_id=str(product.id), assets_queued=queued, assets_skipped=skipped)
|
||||
|
||||
|
||||
async def process_product_assets(product_id: str) -> None:
|
||||
"""后台：下载 pending 素材 → 转存本地 media。失败逐张标记，不中断。"""
|
||||
async with get_session_factory()() as db:
|
||||
assets = (await db.scalars(
|
||||
select(ProductAsset).where(
|
||||
ProductAsset.product_id == UUID(product_id),
|
||||
ProductAsset.status == STATUS_PENDING,
|
||||
ProductAsset.type == "img",
|
||||
)
|
||||
)).all()
|
||||
for a in assets:
|
||||
a.status = STATUS_DOWNLOADING
|
||||
await db.commit()
|
||||
try:
|
||||
a.stored_url = await storage.save_from_url(a.source_url, key_prefix="assets")
|
||||
a.status = STATUS_OK
|
||||
except Exception as exc: # noqa: BLE001
|
||||
a.status = STATUS_FAILED
|
||||
a.error = str(exc)[:500]
|
||||
await db.commit()
|
||||
|
||||
|
||||
@router.get("/collected")
|
||||
async def is_collected(platform: str, itemId: str, db: AsyncSession = Depends(get_db)):
|
||||
rows = (await db.execute(
|
||||
select(Product.id).where(
|
||||
Product.source_platform == platform,
|
||||
Product.source_item_id == itemId,
|
||||
)
|
||||
)).scalars().all()
|
||||
return {"collected": len(rows) > 0, "count": len(rows)}
|
||||
@@ -0,0 +1,126 @@
|
||||
"""无状态套图生成：请求自带采集数据，不落商品库。"""
|
||||
from __future__ import annotations
|
||||
|
||||
from fastapi import APIRouter, BackgroundTasks, Depends, HTTPException
|
||||
|
||||
from config import get_settings
|
||||
from db import get_db
|
||||
from models import Suite
|
||||
from schemas import (
|
||||
GenerateRequest, PLATFORM_SPECS, SUPPORTED_TYPES, SuiteCreateResponse, TextMaterial,
|
||||
PlanRequest, PlanResponse, PlanItemOut,
|
||||
)
|
||||
from services.generator import run_suite
|
||||
from services.planner import generate_plan
|
||||
from services.prompt import type_name
|
||||
|
||||
router = APIRouter(prefix="/api", tags=["generate"])
|
||||
|
||||
|
||||
def texts_to_raw(texts: list[TextMaterial]) -> dict:
|
||||
"""插件上传的文本素材 → prompt 上下文用的 raw dict（后写的覆盖先写的）。"""
|
||||
raw: dict = {}
|
||||
for t in texts:
|
||||
if t.kind == "title" and t.content:
|
||||
raw["title"] = t.content
|
||||
elif t.kind == "price" and t.content:
|
||||
raw["price"] = t.content
|
||||
elif t.kind == "brand" and t.content:
|
||||
raw["brand"] = t.content
|
||||
elif t.kind == "params" and t.pairs:
|
||||
merged = {p["key"]: p["value"] for p in (raw.get("params") or [])}
|
||||
for p in t.pairs:
|
||||
merged.setdefault(p["key"], p["value"])
|
||||
raw["params"] = [{"key": k, "value": v} for k, v in merged.items()]
|
||||
elif t.kind == "selling_point" and t.content:
|
||||
raw["sellingPoints"] = t.content
|
||||
elif t.kind == "desc" and t.content:
|
||||
raw["desc"] = t.content
|
||||
return raw
|
||||
|
||||
|
||||
@router.post("/generate", response_model=SuiteCreateResponse)
|
||||
async def generate_suite(
|
||||
req: GenerateRequest,
|
||||
background: BackgroundTasks,
|
||||
db=Depends(get_db),
|
||||
) -> SuiteCreateResponse:
|
||||
if not req.images:
|
||||
raise HTTPException(status_code=400, detail="未勾选任何图片，无法生成")
|
||||
|
||||
# 生成任务列表：方案优先；无方案时按 types（空则默认四种）
|
||||
if req.plan:
|
||||
jobs: list[dict] = []
|
||||
for item in req.plan:
|
||||
if item.count <= 0:
|
||||
continue
|
||||
if item.kind not in SUPPORTED_TYPES:
|
||||
raise HTTPException(status_code=400, detail=f"方案项「{item.title}」的图类型不支持: {item.kind}")
|
||||
# 同一项多张 → 展开为多任务，第二张起在标题上加序号
|
||||
for n in range(item.count):
|
||||
jobs.append({
|
||||
"kind": item.kind,
|
||||
"title": item.title if item.count == 1 else f"{item.title}{n + 1}",
|
||||
"detail": item.detail,
|
||||
"prompt_hint": item.prompt_hint,
|
||||
"variant_name": item.variant_name,
|
||||
})
|
||||
if not jobs:
|
||||
raise HTTPException(status_code=400, detail="方案中所有项的数量都是 0")
|
||||
types = list(dict.fromkeys(j["kind"] for j in jobs))
|
||||
else:
|
||||
types = req.types or ["white_bg", "key_features", "lifestyle", "multi_scene"]
|
||||
bad = [t for t in types if t not in SUPPORTED_TYPES]
|
||||
if bad:
|
||||
raise HTTPException(status_code=400, detail=f"不支持的图类型: {bad}")
|
||||
jobs = [{"kind": t, "title": type_name(t), "detail": "", "prompt_hint": "", "variant_name": None} for t in types]
|
||||
|
||||
if req.platform not in PLATFORM_SPECS:
|
||||
raise HTTPException(status_code=400, detail=f"不支持的目标平台: {req.platform}（ozon | wb | cn）")
|
||||
spec = PLATFORM_SPECS[req.platform]
|
||||
|
||||
settings = get_settings()
|
||||
suite = Suite(
|
||||
product_id=None,
|
||||
style_set=req.style_set,
|
||||
platform=req.platform,
|
||||
lang=spec["lang"],
|
||||
ratio=spec["ratio"],
|
||||
types=types,
|
||||
plan=jobs,
|
||||
provider=req.provider or settings.image_provider,
|
||||
context=texts_to_raw(req.texts),
|
||||
# 参考图池：main 组优先，其余组按序补充（variant 绑定靠 variant_name 匹配）
|
||||
ref_images=[
|
||||
{
|
||||
"url": i.url,
|
||||
"group_key": i.group_key,
|
||||
"variant_name": i.variant_name,
|
||||
}
|
||||
for i in sorted(req.images, key=lambda x: 0 if x.group_key == "main" else 1)
|
||||
],
|
||||
)
|
||||
db.add(suite)
|
||||
await db.commit()
|
||||
await db.refresh(suite)
|
||||
|
||||
background.add_task(run_suite, str(suite.id))
|
||||
return SuiteCreateResponse(suite_id=str(suite.id))
|
||||
|
||||
|
||||
@router.post("/plan", response_model=PlanResponse)
|
||||
async def plan_suite(req: PlanRequest) -> PlanResponse:
|
||||
"""DeepSeek 根据商品信息生成出图方案。"""
|
||||
product_info = texts_to_raw(req.texts)
|
||||
if not product_info.get("title"):
|
||||
raise HTTPException(status_code=400, detail="缺少商品标题，无法规划")
|
||||
try:
|
||||
result = await generate_plan(product_info, req.sku_variants, req.image_stats, req.platform)
|
||||
except RuntimeError as exc:
|
||||
raise HTTPException(status_code=502, detail=str(exc)) from exc
|
||||
except Exception as exc: # noqa: BLE001
|
||||
raise HTTPException(status_code=502, detail=f"规划失败: {exc}") from exc
|
||||
return PlanResponse(
|
||||
summary=result["summary"],
|
||||
items=[PlanItemOut(**i) for i in result["items"]],
|
||||
)
|
||||
@@ -0,0 +1,71 @@
|
||||
"""商品查询 API。"""
|
||||
from __future__ import annotations
|
||||
|
||||
from uuid import UUID
|
||||
|
||||
from fastapi import APIRouter, Depends, HTTPException
|
||||
from sqlalchemy import func, select
|
||||
from sqlalchemy.ext.asyncio import AsyncSession
|
||||
|
||||
from db import get_db
|
||||
from models import Product, ProductAsset
|
||||
from schemas import AssetOut, ProductListOut, ProductOut
|
||||
from services import storage
|
||||
|
||||
router = APIRouter(prefix="/api", tags=["products"])
|
||||
|
||||
|
||||
def _asset_out(a: ProductAsset) -> AssetOut:
|
||||
return AssetOut(
|
||||
id=str(a.id),
|
||||
group_key=a.group_key,
|
||||
variant_name=a.variant_name,
|
||||
type=a.type,
|
||||
source_url=a.source_url,
|
||||
url=a.stored_url,
|
||||
status=a.status,
|
||||
)
|
||||
|
||||
|
||||
@router.get("/products", response_model=ProductListOut)
|
||||
async def list_products(
|
||||
q: str = "",
|
||||
page: int = 1,
|
||||
page_size: int = 20,
|
||||
db: AsyncSession = Depends(get_db),
|
||||
):
|
||||
cond = []
|
||||
if q:
|
||||
cond.append(Product.name.contains(q))
|
||||
total = (await db.scalar(select(func.count()).select_from(Product).where(*cond))) or 0
|
||||
rows = (await db.scalars(
|
||||
select(Product).where(*cond).order_by(Product.created_at.desc())
|
||||
.offset((page - 1) * page_size).limit(page_size)
|
||||
)).all()
|
||||
return ProductListOut(total=total, items=[
|
||||
ProductOut(
|
||||
id=str(p.id), stage=p.stage, source_platform=p.source_platform,
|
||||
source_item_id=p.source_item_id, source_url=p.source_url,
|
||||
name=p.name, description=p.description, price=p.price,
|
||||
asset_counts=p.asset_counts,
|
||||
created_at=p.created_at.isoformat() if p.created_at else None,
|
||||
) for p in rows
|
||||
])
|
||||
|
||||
|
||||
@router.get("/products/{product_id}", response_model=ProductOut)
|
||||
async def get_product(product_id: str, db: AsyncSession = Depends(get_db)):
|
||||
p = await db.get(Product, UUID(product_id))
|
||||
if p is None:
|
||||
raise HTTPException(status_code=404, detail="商品不存在")
|
||||
assets = (await db.scalars(
|
||||
select(ProductAsset).where(ProductAsset.product_id == p.id)
|
||||
.order_by(ProductAsset.sort_order)
|
||||
)).all()
|
||||
return ProductOut(
|
||||
id=str(p.id), stage=p.stage, source_platform=p.source_platform,
|
||||
source_item_id=p.source_item_id, source_url=p.source_url,
|
||||
name=p.name, description=p.description, price=p.price,
|
||||
asset_counts=p.asset_counts, assets=[_asset_out(a) for a in assets],
|
||||
created_at=p.created_at.isoformat() if p.created_at else None,
|
||||
)
|
||||
@@ -0,0 +1,54 @@
|
||||
"""图片代理：绕过源站防盗链，供前端 <img> 预览与生图参考使用。
|
||||
|
||||
参考 laowang.putumiao.shop 的 /api/proxy-image?url=... 形式。
|
||||
"""
|
||||
from __future__ import annotations
|
||||
|
||||
from urllib.parse import urlparse
|
||||
|
||||
from fastapi import APIRouter, HTTPException, Query, Response
|
||||
|
||||
from services import storage
|
||||
|
||||
router = APIRouter(prefix="/api", tags=["proxy"])
|
||||
|
||||
# 域名片段 → 防盗链所需 Referer
|
||||
_REFERER_BY_DOMAIN: list[tuple[str, str]] = [
|
||||
("alicdn.com", "https://www.taobao.com"),
|
||||
("taobao.com", "https://www.taobao.com"),
|
||||
("tmall.com", "https://www.tmall.com"),
|
||||
("1688.com", "https://www.1688.com"),
|
||||
("ozon.ru", "https://www.ozon.ru"),
|
||||
("ozon.kz", "https://www.ozon.ru"),
|
||||
("ozon.by", "https://www.ozon.ru"),
|
||||
("ozonusercontent.com", "https://www.ozon.ru"),
|
||||
]
|
||||
|
||||
|
||||
def guess_referer(url: str) -> str | None:
|
||||
host = (urlparse(url).hostname or "").lower()
|
||||
for frag, referer in _REFERER_BY_DOMAIN:
|
||||
if frag in host:
|
||||
return referer
|
||||
return None
|
||||
|
||||
|
||||
@router.get("/proxy-image")
|
||||
async def proxy_image(url: str = Query(..., description="源站图片 URL")):
|
||||
scheme = urlparse(url).scheme
|
||||
if scheme not in ("http", "https"):
|
||||
raise HTTPException(status_code=400, detail="仅支持 http/https URL")
|
||||
try:
|
||||
data, ctype = await storage.download_bytes(url, referer=guess_referer(url))
|
||||
except Exception as exc: # noqa: BLE001
|
||||
raise HTTPException(status_code=502, detail=f"图片拉取失败: {exc}") from exc
|
||||
if not ctype.startswith("image/"):
|
||||
ctype = "image/jpeg"
|
||||
return Response(
|
||||
content=data,
|
||||
media_type=ctype,
|
||||
headers={
|
||||
"Cache-Control": "public, max-age=86400",
|
||||
"Access-Control-Allow-Origin": "*",
|
||||
},
|
||||
)
|
||||
@@ -0,0 +1,141 @@
|
||||
"""套图生成 API：创建任务 / 查询状态 / 导出 ZIP。"""
|
||||
from __future__ import annotations
|
||||
|
||||
import io
|
||||
import zipfile
|
||||
from uuid import UUID
|
||||
|
||||
from fastapi import APIRouter, BackgroundTasks, Depends, HTTPException
|
||||
from fastapi.responses import StreamingResponse
|
||||
from sqlalchemy import select
|
||||
from sqlalchemy.ext.asyncio import AsyncSession
|
||||
|
||||
from config import get_settings
|
||||
from db import get_db
|
||||
from models import Product, ProductAsset, Suite, SuiteImage, STATUS_OK
|
||||
from schemas import PLATFORM_SPECS, SUPPORTED_TYPES, SuiteCreateRequest, SuiteCreateResponse, SuiteImageOut, SuiteOut
|
||||
from services import storage
|
||||
from services.generator import run_suite
|
||||
|
||||
router = APIRouter(prefix="/api", tags=["suites"])
|
||||
|
||||
|
||||
async def _suite_out(db: AsyncSession, suite: Suite) -> SuiteOut:
|
||||
images = (await db.scalars(
|
||||
select(SuiteImage).where(SuiteImage.suite_id == suite.id)
|
||||
.order_by(SuiteImage.created_at)
|
||||
)).all()
|
||||
return SuiteOut(
|
||||
id=str(suite.id),
|
||||
product_id=str(suite.product_id),
|
||||
status=suite.status,
|
||||
style_set=suite.style_set,
|
||||
platform=suite.platform,
|
||||
lang=suite.lang,
|
||||
ratio=suite.ratio,
|
||||
types=list(suite.types or []),
|
||||
provider=suite.provider,
|
||||
images=[
|
||||
SuiteImageOut(
|
||||
type_id=i.type_id, name=i.name, url=i.stored_url or "",
|
||||
status=i.status, error=i.error,
|
||||
) for i in images
|
||||
],
|
||||
error=suite.error,
|
||||
)
|
||||
|
||||
|
||||
@router.post("/products/{product_id}/suites", response_model=SuiteCreateResponse)
|
||||
async def create_suite(
|
||||
product_id: str,
|
||||
req: SuiteCreateRequest,
|
||||
background: BackgroundTasks,
|
||||
db: AsyncSession = Depends(get_db),
|
||||
):
|
||||
product = await db.get(Product, UUID(product_id))
|
||||
if product is None:
|
||||
raise HTTPException(status_code=404, detail="商品不存在")
|
||||
|
||||
# 主图组至少一张图（不要求转存完成：生图可直接用源站 URL 代理解析）
|
||||
ok_assets = (await db.scalars(
|
||||
select(ProductAsset.id).where(
|
||||
ProductAsset.product_id == product.id,
|
||||
ProductAsset.group_key == "main",
|
||||
ProductAsset.type == "img",
|
||||
)
|
||||
)).all()
|
||||
if not ok_assets:
|
||||
raise HTTPException(status_code=400, detail="商品没有主图，无法生成")
|
||||
|
||||
bad = [t for t in req.types if t not in SUPPORTED_TYPES]
|
||||
if bad:
|
||||
raise HTTPException(status_code=400, detail=f"不支持的图类型: {bad}")
|
||||
if req.platform not in PLATFORM_SPECS:
|
||||
raise HTTPException(status_code=400, detail=f"不支持的目标平台: {req.platform}（ozon | wb | cn）")
|
||||
spec = PLATFORM_SPECS[req.platform]
|
||||
|
||||
settings = get_settings()
|
||||
suite = Suite(
|
||||
product_id=product.id,
|
||||
style_set=req.style_set,
|
||||
platform=req.platform,
|
||||
lang=spec["lang"],
|
||||
ratio=spec["ratio"],
|
||||
types=req.types,
|
||||
provider=req.provider or settings.image_provider,
|
||||
)
|
||||
db.add(suite)
|
||||
await db.commit()
|
||||
await db.refresh(suite)
|
||||
|
||||
background.add_task(run_suite, str(suite.id))
|
||||
return SuiteCreateResponse(suite_id=str(suite.id))
|
||||
|
||||
|
||||
@router.get("/suites/{suite_id}", response_model=SuiteOut)
|
||||
async def get_suite(suite_id: str, db: AsyncSession = Depends(get_db)):
|
||||
suite = await db.get(Suite, UUID(suite_id))
|
||||
if suite is None:
|
||||
raise HTTPException(status_code=404, detail="任务不存在")
|
||||
return await _suite_out(db, suite)
|
||||
|
||||
|
||||
@router.get("/products/{product_id}/suites")
|
||||
async def list_suites(product_id: str, db: AsyncSession = Depends(get_db)):
|
||||
suites = (await db.scalars(
|
||||
select(Suite).where(Suite.product_id == UUID(product_id))
|
||||
.order_by(Suite.created_at.desc())
|
||||
)).all()
|
||||
return [await _suite_out(db, s) for s in suites]
|
||||
|
||||
|
||||
@router.get("/suites/{suite_id}/zip")
|
||||
async def download_suite_zip(suite_id: str, db: AsyncSession = Depends(get_db)):
|
||||
"""把任务内所有成功图打包成 ZIP（中文文件名）。"""
|
||||
suite = await db.get(Suite, UUID(suite_id))
|
||||
if suite is None:
|
||||
raise HTTPException(status_code=404, detail="任务不存在")
|
||||
images = (await db.scalars(
|
||||
select(SuiteImage).where(
|
||||
SuiteImage.suite_id == suite.id, SuiteImage.status == STATUS_OK,
|
||||
).order_by(SuiteImage.created_at)
|
||||
)).all()
|
||||
|
||||
buf = io.BytesIO()
|
||||
with zipfile.ZipFile(buf, "w", zipfile.ZIP_DEFLATED) as zf:
|
||||
seen: set[str] = set()
|
||||
for i, img in enumerate(images):
|
||||
path = storage.local_path(img.stored_url or "")
|
||||
if path is None:
|
||||
continue
|
||||
filename = img.name or img.type_id
|
||||
if filename in seen: # 同类型多张时加序号防覆盖
|
||||
filename = f"{filename}-{i + 1}"
|
||||
seen.add(filename)
|
||||
zf.write(path, f"{filename}{path.suffix or '.jpg'}")
|
||||
buf.seek(0)
|
||||
return StreamingResponse(
|
||||
buf,
|
||||
media_type="application/zip",
|
||||
headers={"Content-Disposition": f'attachment; filename="suite-{suite_id}.zip"'},
|
||||
)
|
||||
@@ -0,0 +1,52 @@
|
||||
"""配置：仓库根 .env 或环境变量。"""
|
||||
from __future__ import annotations
|
||||
|
||||
from functools import lru_cache
|
||||
from pathlib import Path
|
||||
|
||||
from pydantic_settings import BaseSettings, SettingsConfigDict
|
||||
|
||||
# 仓库根（server/ 的上一级）
|
||||
ROOT = Path(__file__).resolve().parents[1]
|
||||
|
||||
|
||||
class Settings(BaseSettings):
|
||||
model_config = SettingsConfigDict(
|
||||
env_file=str(ROOT / ".env"),
|
||||
env_file_encoding="utf-8",
|
||||
extra="ignore",
|
||||
)
|
||||
|
||||
# ── 服务 ──
|
||||
# 不要用 5000/7000：macOS 隔空播放接收器占用（IPv6 localhost 会被截走）
|
||||
host: str = "127.0.0.1"
|
||||
port: int = 3300
|
||||
app_base_url: str = "http://127.0.0.1:3300"
|
||||
|
||||
# ── 存储 ──
|
||||
data_dir: str = str(ROOT / "data")
|
||||
|
||||
# ── 图像生成 provider：doubao（火山方舟 Seedream）| tongyi（阿里 DashScope）──
|
||||
image_provider: str = "doubao"
|
||||
request_timeout: int = 300 # 单张生图请求超时（秒）
|
||||
poll_max_wait: int = 600 # 异步任务轮询上限（秒）
|
||||
|
||||
# 豆包 / 火山方舟
|
||||
ark_api_key: str = ""
|
||||
ark_base_url: str = "https://ark.cn-beijing.volces.com/api/v3/images/generations"
|
||||
ark_image_model: str = "doubao-seedream-4-5-251128"
|
||||
|
||||
# 通义 / DashScope
|
||||
dashscope_api_key: str = ""
|
||||
dashscope_base_url: str = "" # 留空按模型自动选择万象异步/千问同步端点
|
||||
dashscope_model: str = "wan2.7-image-pro"
|
||||
|
||||
# DeepSeek（出图方案规划器）
|
||||
deepseek_api_key: str = ""
|
||||
deepseek_base_url: str = "https://api.deepseek.com/v1"
|
||||
deepseek_model: str = "deepseek-v4-flash"
|
||||
|
||||
|
||||
@lru_cache
|
||||
def get_settings() -> Settings:
|
||||
return Settings()
|
||||
@@ -0,0 +1,47 @@
|
||||
"""数据库：SQLite（aiosqlite）+ SQLAlchemy async。"""
|
||||
from __future__ import annotations
|
||||
|
||||
from collections.abc import AsyncGenerator
|
||||
|
||||
from sqlalchemy.ext.asyncio import AsyncSession, async_sessionmaker, create_async_engine
|
||||
from sqlalchemy.orm import DeclarativeBase
|
||||
|
||||
from config import get_settings
|
||||
|
||||
|
||||
class Base(DeclarativeBase):
|
||||
pass
|
||||
|
||||
|
||||
_engine = None
|
||||
_session_factory: async_sessionmaker[AsyncSession] | None = None
|
||||
|
||||
|
||||
def get_engine():
|
||||
global _engine, _session_factory
|
||||
if _engine is None:
|
||||
settings = get_settings()
|
||||
db_path = f"{settings.data_dir}/app.db"
|
||||
_engine = create_async_engine(f"sqlite+aiosqlite:///{db_path}", echo=False)
|
||||
_session_factory = async_sessionmaker(_engine, expire_on_commit=False)
|
||||
return _engine
|
||||
|
||||
|
||||
def get_session_factory() -> async_sessionmaker[AsyncSession]:
|
||||
get_engine()
|
||||
assert _session_factory is not None
|
||||
return _session_factory
|
||||
|
||||
|
||||
async def get_db() -> AsyncGenerator[AsyncSession, None]:
|
||||
async with get_session_factory()() as session:
|
||||
yield session
|
||||
|
||||
|
||||
async def init_db() -> None:
|
||||
"""启动时建表（MVP 不引 Alembic，模型变更删库重建即可）。"""
|
||||
import models # noqa: F401 确保模型注册
|
||||
|
||||
engine = get_engine()
|
||||
async with engine.begin() as conn:
|
||||
await conn.run_sync(Base.metadata.create_all)
|
||||
@@ -0,0 +1,59 @@
|
||||
"""电商套图工作台 - FastAPI 入口。"""
|
||||
from __future__ import annotations
|
||||
|
||||
import logging
|
||||
from contextlib import asynccontextmanager
|
||||
|
||||
from fastapi import FastAPI
|
||||
from fastapi.middleware.cors import CORSMiddleware
|
||||
from fastapi.staticfiles import StaticFiles
|
||||
|
||||
from api import collection, generate, products, proxy, suites
|
||||
from config import get_settings
|
||||
from db import init_db
|
||||
from services.storage import media_root
|
||||
|
||||
logging.basicConfig(level=logging.INFO, format="%(asctime)s %(levelname)s %(name)s: %(message)s")
|
||||
|
||||
|
||||
@asynccontextmanager
|
||||
async def lifespan(app: FastAPI):
|
||||
await init_db()
|
||||
yield
|
||||
|
||||
|
||||
app = FastAPI(title="电商套图工作台", version="0.1.0", lifespan=lifespan)
|
||||
|
||||
app.add_middleware(
|
||||
CORSMiddleware,
|
||||
allow_origins=["*"], # 插件 background 无 CORS 限制，这里兜底
|
||||
allow_methods=["*"],
|
||||
allow_headers=["*"],
|
||||
)
|
||||
|
||||
app.include_router(collection.router)
|
||||
app.include_router(products.router)
|
||||
app.include_router(suites.router)
|
||||
app.include_router(generate.router)
|
||||
app.include_router(proxy.router)
|
||||
|
||||
# 静态托管生成的图片/转存素材
|
||||
app.mount("/media", StaticFiles(directory=str(media_root())), name="media")
|
||||
|
||||
|
||||
@app.get("/api/health")
|
||||
async def health():
|
||||
settings = get_settings()
|
||||
return {
|
||||
"ok": True,
|
||||
"provider": settings.image_provider,
|
||||
"ark_configured": bool(settings.ark_api_key),
|
||||
"dashscope_configured": bool(settings.dashscope_api_key),
|
||||
}
|
||||
|
||||
|
||||
if __name__ == "__main__":
|
||||
import uvicorn
|
||||
|
||||
settings = get_settings()
|
||||
uvicorn.run("main:app", host=settings.host, port=settings.port, reload=False)
|
||||
@@ -0,0 +1,116 @@
|
||||
"""数据模型：Product（商品）/ ProductAsset（采集素材）/ Suite（套图任务）/ SuiteImage（生成图）。"""
|
||||
from __future__ import annotations
|
||||
|
||||
import uuid
|
||||
from datetime import datetime
|
||||
|
||||
from sqlalchemy import DateTime, Float, ForeignKey, Integer, JSON, String, Text, Uuid, func
|
||||
from sqlalchemy.orm import Mapped, mapped_column
|
||||
|
||||
from db import Base
|
||||
|
||||
# 产品阶段
|
||||
STAGE_COLLECTED = "collected"
|
||||
STAGE_GENERATED = "generated"
|
||||
|
||||
# 素材/生成图状态
|
||||
STATUS_PENDING = "pending"
|
||||
STATUS_DOWNLOADING = "downloading"
|
||||
STATUS_OK = "ok"
|
||||
STATUS_FAILED = "failed"
|
||||
|
||||
# 套图任务状态
|
||||
SUITE_PENDING = "pending"
|
||||
SUITE_RUNNING = "running"
|
||||
SUITE_DONE = "done"
|
||||
SUITE_PARTIAL = "partial"
|
||||
SUITE_FAILED = "failed"
|
||||
|
||||
|
||||
class Product(Base):
|
||||
__tablename__ = "products"
|
||||
|
||||
id: Mapped[uuid.UUID] = mapped_column(Uuid(as_uuid=True), primary_key=True, default=uuid.uuid4)
|
||||
stage: Mapped[str] = mapped_column(String(16), default=STAGE_COLLECTED, index=True)
|
||||
|
||||
# 采集溯源
|
||||
source_platform: Mapped[str | None] = mapped_column(String(16), nullable=True) # ozon | 1688 | taobao
|
||||
source_item_id: Mapped[str | None] = mapped_column(String(64), nullable=True, index=True)
|
||||
source_url: Mapped[str | None] = mapped_column(Text, nullable=True)
|
||||
|
||||
name: Mapped[str] = mapped_column(Text, default="")
|
||||
description: Mapped[str] = mapped_column(Text, default="")
|
||||
price: Mapped[float | None] = mapped_column(Float, nullable=True)
|
||||
|
||||
# 采集原文：{title, price, brand, params: [...], sellingPoints, desc, texts: [...]}
|
||||
raw: Mapped[dict | None] = mapped_column(JSON, nullable=True)
|
||||
asset_counts: Mapped[dict | None] = mapped_column(JSON, nullable=True)
|
||||
|
||||
created_at: Mapped[datetime] = mapped_column(DateTime(timezone=True), server_default=func.now())
|
||||
updated_at: Mapped[datetime] = mapped_column(
|
||||
DateTime(timezone=True), server_default=func.now(), onupdate=func.now(), index=True
|
||||
)
|
||||
|
||||
|
||||
class ProductAsset(Base):
|
||||
"""采集素材（源站图片，转存到本地 media）。"""
|
||||
|
||||
__tablename__ = "product_assets"
|
||||
|
||||
id: Mapped[uuid.UUID] = mapped_column(Uuid(as_uuid=True), primary_key=True, default=uuid.uuid4)
|
||||
product_id: Mapped[uuid.UUID] = mapped_column(
|
||||
Uuid(as_uuid=True), ForeignKey("products.id", ondelete="CASCADE"), index=True
|
||||
)
|
||||
group_key: Mapped[str] = mapped_column(String(16), default="main") # main/sku/detail/video
|
||||
variant_name: Mapped[str | None] = mapped_column(String(128), nullable=True)
|
||||
sort_order: Mapped[int] = mapped_column(Integer, default=0)
|
||||
type: Mapped[str] = mapped_column(String(8), default="img") # img / video
|
||||
source_url: Mapped[str] = mapped_column(Text, default="")
|
||||
stored_url: Mapped[str | None] = mapped_column(Text, nullable=True) # 本地 media key 或公网 URL
|
||||
status: Mapped[str] = mapped_column(String(16), default=STATUS_PENDING, index=True)
|
||||
dedupe_key: Mapped[str | None] = mapped_column(String(512), nullable=True, index=True)
|
||||
error: Mapped[str | None] = mapped_column(Text, nullable=True)
|
||||
created_at: Mapped[datetime] = mapped_column(DateTime(timezone=True), server_default=func.now())
|
||||
|
||||
|
||||
class Suite(Base):
|
||||
"""一次套图生成任务（无状态：直接携带采集数据，不依赖商品库）。"""
|
||||
|
||||
__tablename__ = "suites"
|
||||
|
||||
id: Mapped[uuid.UUID] = mapped_column(Uuid(as_uuid=True), primary_key=True, default=uuid.uuid4)
|
||||
# 兼容旧的商品挂载路径；工具化流程为空
|
||||
product_id: Mapped[uuid.UUID | None] = mapped_column(
|
||||
Uuid(as_uuid=True), ForeignKey("products.id", ondelete="CASCADE"), nullable=True, index=True
|
||||
)
|
||||
status: Mapped[str] = mapped_column(String(16), default=SUITE_PENDING, index=True)
|
||||
style_set: Mapped[int] = mapped_column(Integer, default=1) # 风格模板 1-5
|
||||
platform: Mapped[str] = mapped_column(String(8), default="cn") # 目标平台 ozon | wb | cn
|
||||
lang: Mapped[str] = mapped_column(String(4), default="zh") # ru / zh（由平台推导）
|
||||
ratio: Mapped[str] = mapped_column(String(8), default="1:1") # 图片比例（由平台推导）
|
||||
types: Mapped[list | None] = mapped_column(JSON, nullable=True) # 图类型 id 列表（旧）
|
||||
plan: Mapped[list | None] = mapped_column(JSON, nullable=True) # 出图方案（展开后的逐张任务）
|
||||
provider: Mapped[str] = mapped_column(String(16), default="doubao")
|
||||
# 工具化流程：请求自带的数据（生图上下文 + 参考图 URL 列表）
|
||||
context: Mapped[dict | None] = mapped_column(JSON, nullable=True)
|
||||
ref_images: Mapped[list | None] = mapped_column(JSON, nullable=True)
|
||||
error: Mapped[str | None] = mapped_column(Text, nullable=True)
|
||||
created_at: Mapped[datetime] = mapped_column(DateTime(timezone=True), server_default=func.now())
|
||||
finished_at: Mapped[datetime | None] = mapped_column(DateTime(timezone=True), nullable=True)
|
||||
|
||||
|
||||
class SuiteImage(Base):
|
||||
"""任务里单张生成图。"""
|
||||
|
||||
__tablename__ = "suite_images"
|
||||
|
||||
id: Mapped[uuid.UUID] = mapped_column(Uuid(as_uuid=True), primary_key=True, default=uuid.uuid4)
|
||||
suite_id: Mapped[uuid.UUID] = mapped_column(
|
||||
Uuid(as_uuid=True), ForeignKey("suites.id", ondelete="CASCADE"), index=True
|
||||
)
|
||||
type_id: Mapped[str] = mapped_column(String(32)) # white_bg / key_features / ...
|
||||
name: Mapped[str] = mapped_column(String(64), default="") # 中文名（文件名）
|
||||
stored_url: Mapped[str | None] = mapped_column(Text, nullable=True)
|
||||
status: Mapped[str] = mapped_column(String(16), default=STATUS_PENDING)
|
||||
error: Mapped[str | None] = mapped_column(Text, nullable=True)
|
||||
created_at: Mapped[datetime] = mapped_column(DateTime(timezone=True), server_default=func.now())
|
||||
@@ -0,0 +1,8 @@
|
||||
fastapi>=0.110
|
||||
uvicorn[standard]>=0.29
|
||||
sqlalchemy[asyncio]>=2.0
|
||||
aiosqlite>=0.20
|
||||
pydantic>=2.6
|
||||
pydantic-settings>=2.2
|
||||
httpx>=0.27
|
||||
python-multipart>=0.0.9
|
||||
@@ -0,0 +1,174 @@
|
||||
"""Pydantic 契约（插件 ↔ 服务端）。"""
|
||||
from __future__ import annotations
|
||||
|
||||
from pydantic import BaseModel, Field
|
||||
|
||||
SUPPORTED_TYPES = [
|
||||
"white_bg", "key_features", "selling_pt", "material",
|
||||
"lifestyle", "multi_scene", "ecommerce_detail",
|
||||
"size_chart", "sku_collection", "custom",
|
||||
]
|
||||
|
||||
|
||||
# ── 采集上传 ──
|
||||
|
||||
class SourceInfo(BaseModel):
|
||||
platform: str = Field(..., description="ozon | 1688 | taobao")
|
||||
itemId: str | None = None
|
||||
url: str = ""
|
||||
collectedAt: int | None = None # epoch 毫秒
|
||||
|
||||
|
||||
class TextMaterial(BaseModel):
|
||||
kind: str = Field(..., description="title | params | selling_point | desc | price | brand")
|
||||
content: str = ""
|
||||
pairs: list[dict] | None = None # [{key, value}]
|
||||
|
||||
|
||||
class ImageMaterial(BaseModel):
|
||||
groupKey: str = Field(..., description="main | sku | detail | video")
|
||||
groupName: str = ""
|
||||
variantName: str | None = None
|
||||
url: str = Field(..., description="源站原图 URL")
|
||||
index: int = 0
|
||||
type: str = "img"
|
||||
dedupeKey: str | None = None
|
||||
|
||||
|
||||
class MaterialsRequest(BaseModel):
|
||||
product_id: str | None = Field(default=None, description="传了=追加到已有商品")
|
||||
source: SourceInfo
|
||||
texts: list[TextMaterial] = Field(default_factory=list)
|
||||
images: list[ImageMaterial] = Field(default_factory=list)
|
||||
refererOrigin: str | None = None
|
||||
|
||||
|
||||
class MaterialsResponse(BaseModel):
|
||||
product_id: str
|
||||
assets_queued: int
|
||||
assets_skipped: int = 0
|
||||
|
||||
|
||||
# ── 套图生成 ──
|
||||
|
||||
# 目标平台 → 文案语言 + 图片比例（平台决定规格，不再单独选语言）
|
||||
PLATFORM_SPECS: dict[str, dict] = {
|
||||
"ozon": {"lang": "ru", "ratio": "3:4", "label": "Ozon"},
|
||||
"wb": {"lang": "ru", "ratio": "3:4", "label": "Wildberries"},
|
||||
"cn": {"lang": "zh", "ratio": "1:1", "label": "中文（国内平台）"},
|
||||
}
|
||||
|
||||
|
||||
class SuiteCreateRequest(BaseModel):
|
||||
style_set: int = Field(default=1, ge=1, le=5, description="风格模板 1-5")
|
||||
types: list[str] = Field(default_factory=lambda: ["white_bg", "key_features", "lifestyle", "multi_scene"])
|
||||
platform: str = Field(default="cn", description="目标平台：ozon | wb | cn")
|
||||
provider: str | None = Field(default=None, description="覆盖默认 provider（doubao | tongyi）")
|
||||
|
||||
|
||||
# ── 无状态套图生成（工具流程：请求自带采集数据）──
|
||||
|
||||
class GenerateImageItem(BaseModel):
|
||||
url: str = Field(..., description="勾选的图片 URL（源站原图）")
|
||||
group_key: str = Field(default="main", description="main | sku | detail")
|
||||
variant_name: str | None = Field(default=None, description="SKU 规格名（方案绑定用）")
|
||||
|
||||
|
||||
class PlanItem(BaseModel):
|
||||
"""出图方案项：一类图 × 数量，可绑定 SKU 规格。"""
|
||||
kind: str = Field(default="custom", description="图类型（SUPPORTED_TYPES 之一）")
|
||||
title: str = Field(..., description="方案标题，如「主图·粉色」")
|
||||
detail: str = Field(default="", description="这张图展示什么（中文）")
|
||||
prompt_hint: str = Field(default="", description="构图提示（英文，进生图 prompt）")
|
||||
count: int = Field(default=1, ge=0, le=5)
|
||||
variant_name: str | None = Field(default=None, description="绑定的 SKU 规格名")
|
||||
|
||||
|
||||
class GenerateRequest(BaseModel):
|
||||
texts: list[TextMaterial] = Field(default_factory=list, description="采集的文本素材")
|
||||
images: list[GenerateImageItem] = Field(default_factory=list, description="勾选的参考图")
|
||||
style_set: int = Field(default=1, ge=1, le=5)
|
||||
types: list[str] = Field(default_factory=list, description="旧参数：无方案时按类型生成")
|
||||
plan: list[PlanItem] | None = Field(default=None, description="出图方案（优先于 types）")
|
||||
platform: str = Field(default="cn", description="目标平台：ozon | wb | cn")
|
||||
provider: str | None = Field(default=None, description="覆盖默认 provider（doubao | tongyi）")
|
||||
|
||||
|
||||
# ── 出图方案规划（DeepSeek）──
|
||||
|
||||
class PlanRequest(BaseModel):
|
||||
texts: list[TextMaterial] = Field(default_factory=list)
|
||||
sku_variants: list[str] = Field(default_factory=list, description="带图的 SKU 规格名")
|
||||
image_stats: dict = Field(default_factory=dict, description="分组图片数量统计")
|
||||
platform: str = Field(default="cn")
|
||||
|
||||
|
||||
class PlanItemOut(BaseModel):
|
||||
kind: str
|
||||
title: str
|
||||
detail: str = ""
|
||||
prompt_hint: str = ""
|
||||
count: int = 1
|
||||
variant_name: str | None = None
|
||||
|
||||
|
||||
class PlanResponse(BaseModel):
|
||||
summary: str = ""
|
||||
items: list[PlanItemOut]
|
||||
|
||||
|
||||
class SuiteCreateResponse(BaseModel):
|
||||
suite_id: str
|
||||
|
||||
|
||||
class SuiteImageOut(BaseModel):
|
||||
type_id: str
|
||||
name: str
|
||||
url: str
|
||||
status: str
|
||||
error: str | None = None
|
||||
|
||||
|
||||
class SuiteOut(BaseModel):
|
||||
id: str
|
||||
product_id: str
|
||||
status: str
|
||||
style_set: int
|
||||
platform: str
|
||||
lang: str
|
||||
ratio: str
|
||||
types: list[str]
|
||||
provider: str
|
||||
images: list[SuiteImageOut]
|
||||
error: str | None = None
|
||||
|
||||
|
||||
# ── 商品 ──
|
||||
|
||||
class AssetOut(BaseModel):
|
||||
id: str
|
||||
group_key: str
|
||||
variant_name: str | None = None
|
||||
type: str
|
||||
source_url: str
|
||||
url: str | None = None
|
||||
status: str
|
||||
|
||||
|
||||
class ProductOut(BaseModel):
|
||||
id: str
|
||||
stage: str
|
||||
source_platform: str | None = None
|
||||
source_item_id: str | None = None
|
||||
source_url: str | None = None
|
||||
name: str
|
||||
description: str
|
||||
price: float | None = None
|
||||
asset_counts: dict | None = None
|
||||
assets: list[AssetOut] = Field(default_factory=list)
|
||||
created_at: str | None = None
|
||||
|
||||
|
||||
class ProductListOut(BaseModel):
|
||||
total: int
|
||||
items: list[ProductOut]
|
||||
@@ -0,0 +1,316 @@
|
||||
"""套图生成服务：图像 provider（豆包 Seedream / 通义万相）+ 任务执行器。
|
||||
|
||||
Provider 调用方式移植自 ecommerce-image-suite/scripts/generate.py：
|
||||
- doubao：火山方舟 images/generations，同步返回 URL；参考图走 image 字段（data URI）
|
||||
- tongyi：wan* 万象模型走异步任务轮询；qwen* 走同步 multimodal-generation
|
||||
"""
|
||||
from __future__ import annotations
|
||||
|
||||
import asyncio
|
||||
import base64
|
||||
import logging
|
||||
import mimetypes
|
||||
from uuid import UUID
|
||||
|
||||
import httpx
|
||||
from sqlalchemy import select
|
||||
|
||||
from config import get_settings
|
||||
from db import get_session_factory
|
||||
from models import Product, ProductAsset, Suite, SuiteImage, SUITE_RUNNING, SUITE_DONE, SUITE_PARTIAL, SUITE_FAILED, STATUS_OK, STATUS_FAILED
|
||||
from services import storage
|
||||
from services.prompt import build_prompt, build_context, type_name
|
||||
|
||||
log = logging.getLogger("suite.generator")
|
||||
|
||||
# 参考图选择：material 用第 2 张（背面/细节），其余用第 1 张（正面）
|
||||
TYPE_REF_INDEX = {
|
||||
"material": 1,
|
||||
}
|
||||
DEFAULT_REF_COUNT = 2 # 每次生图最多带的参考图数（正面 1 张 + 背面/细节 1 张）
|
||||
|
||||
|
||||
def _image_size(provider: str, ratio: str, is_wan: bool = True) -> str:
|
||||
"""平台比例 → provider 尺寸参数。3:4 竖版（Ozon/WB），1:1 方图（国内）。"""
|
||||
if provider == "doubao":
|
||||
return "1536x2048" if ratio == "3:4" else "2048x2048"
|
||||
# tongyi：万象与千问的 size 语法相同（* 分隔），档位不同
|
||||
if ratio == "3:4":
|
||||
return "1536*2048" if is_wan else "768*1024"
|
||||
return "2048*2048" if is_wan else "1024*1024"
|
||||
|
||||
_DOUBAO_ANTI_AI = (
|
||||
"authentic real-world photography, natural imperfections, genuine texture, "
|
||||
"no synthetic look, no CGI quality, no heavy post-processing"
|
||||
)
|
||||
|
||||
DEFAULT_NEGATIVE_PROMPT = (
|
||||
"AI-generated look, artificial, CGI quality, 3D render, synthetic texture, "
|
||||
"plastic skin, mannequin-like, too perfect, oversaturated, HDR, heavy vignette, "
|
||||
"low resolution, blurry, deformed, bad anatomy, overexposed, underexposed, grainy, "
|
||||
"watermark, text distortion, bad typography, overlapping text, cheap look, cartoon"
|
||||
)
|
||||
|
||||
|
||||
# ── 参考图解析 ────────────────────────────────────────────────────────────
|
||||
|
||||
def _bytes_to_data_uri(data: bytes, mime: str) -> str:
|
||||
return f"data:{mime};base64,{base64.b64encode(data).decode()}"
|
||||
|
||||
|
||||
async def _resolve_ref(url: str) -> str:
|
||||
"""参考图 URL → data URI。本地 media 文件直读磁盘；远程 URL 带 Referer 下载。
|
||||
|
||||
生图 API 的服务器无法访问 127.0.0.1，代理 URL 也不能直接透传，
|
||||
所以统一在本地解析成 base64 data URI 再进请求体。
|
||||
"""
|
||||
if url.startswith("data:"):
|
||||
return url
|
||||
path = storage.local_path(url)
|
||||
if path is not None:
|
||||
mime = mimetypes.guess_type(path.name)[0] or "image/jpeg"
|
||||
return _bytes_to_data_uri(path.read_bytes(), mime)
|
||||
if url.startswith(("http://", "https://")):
|
||||
from api.proxy import guess_referer
|
||||
data, ctype = await storage.download_bytes(url, referer=guess_referer(url))
|
||||
if not ctype.startswith("image/"):
|
||||
ctype = "image/jpeg"
|
||||
return _bytes_to_data_uri(data, ctype)
|
||||
raise FileNotFoundError(f"无法解析参考图: {url}")
|
||||
|
||||
|
||||
# ── Provider：豆包 Seedream（火山方舟）────────────────────────────────────
|
||||
|
||||
async def generate_doubao(prompt: str, ref_images: list[str], size: str = "2048x2048") -> bytes:
|
||||
s = get_settings()
|
||||
if not s.ark_api_key:
|
||||
raise RuntimeError("未配置 ARK_API_KEY（.env）")
|
||||
body = {
|
||||
"model": s.ark_image_model,
|
||||
"prompt": prompt.rstrip(". ") + ". " + _DOUBAO_ANTI_AI,
|
||||
"size": size,
|
||||
"response_format": "url",
|
||||
"watermark": False,
|
||||
"n": 1,
|
||||
}
|
||||
if ref_images:
|
||||
body["image"] = [await _resolve_ref(u) for u in ref_images]
|
||||
async with httpx.AsyncClient(timeout=s.request_timeout, verify=False) as client:
|
||||
resp = await client.post(
|
||||
s.ark_base_url,
|
||||
headers={"Authorization": f"Bearer {s.ark_api_key}", "Content-Type": "application/json"},
|
||||
json=body,
|
||||
)
|
||||
resp.raise_for_status()
|
||||
img_url = resp.json()["data"][0]["url"]
|
||||
dl = await client.get(img_url, timeout=s.request_timeout)
|
||||
dl.raise_for_status()
|
||||
return dl.content
|
||||
|
||||
|
||||
# ── Provider：通义万相 / 千问（DashScope）────────────────────────────────
|
||||
|
||||
def _is_wan_model(model: str) -> bool:
|
||||
return model.lower().startswith("wan")
|
||||
|
||||
|
||||
async def _tongyi_poll_task(client: httpx.AsyncClient, key: str, task_id: str, max_wait: int) -> str:
|
||||
poll_url = "https://dashscope.aliyuncs.com/api/v1/tasks/" + task_id
|
||||
elapsed, interval = 0, 3
|
||||
while elapsed < max_wait:
|
||||
resp = await client.get(poll_url, headers={"Authorization": f"Bearer {key}"}, timeout=30)
|
||||
resp.raise_for_status()
|
||||
result = resp.json()
|
||||
status = result.get("output", {}).get("task_status", "")
|
||||
if status == "SUCCEEDED":
|
||||
choices = result["output"].get("choices", [])
|
||||
if choices:
|
||||
content = choices[0].get("message", {}).get("content", [])
|
||||
if content:
|
||||
return content[0].get("image", "")
|
||||
results = result["output"].get("results", [])
|
||||
if results:
|
||||
return results[0].get("url") or results[0].get("b64_image", "")
|
||||
raise RuntimeError(f"通义任务成功但无结果: {result}")
|
||||
if status in ("FAILED", "UNKNOWN"):
|
||||
raise RuntimeError(f"通义任务失败: {result}")
|
||||
await asyncio.sleep(interval)
|
||||
elapsed += interval
|
||||
interval = min(interval + 2, 10)
|
||||
raise TimeoutError(f"通义异步任务超时 ({max_wait}s): task_id={task_id}")
|
||||
|
||||
|
||||
async def generate_tongyi(prompt: str, ref_images: list[str], size: str = "2048*2048") -> bytes:
|
||||
s = get_settings()
|
||||
if not s.dashscope_api_key:
|
||||
raise RuntimeError("未配置 DASHSCOPE_API_KEY（.env）")
|
||||
is_wan = _is_wan_model(s.dashscope_model)
|
||||
url = s.dashscope_base_url or (
|
||||
"https://dashscope.aliyuncs.com/api/v1/services/aigc/image-generation/generation"
|
||||
if is_wan
|
||||
else "https://dashscope.aliyuncs.com/api/v1/services/aigc/multimodal-generation/generation"
|
||||
)
|
||||
|
||||
content: list[dict] = [{"image": await _resolve_ref(u)} for u in ref_images]
|
||||
content.append({"text": prompt})
|
||||
|
||||
params = {"size": size, "n": 1, "watermark": False}
|
||||
if not is_wan:
|
||||
params["prompt_extend"] = False
|
||||
params["negative_prompt"] = DEFAULT_NEGATIVE_PROMPT[:500]
|
||||
|
||||
headers = {"Authorization": f"Bearer {s.dashscope_api_key}", "Content-Type": "application/json"}
|
||||
if is_wan:
|
||||
headers["X-DashScope-Async"] = "enable"
|
||||
|
||||
body = {"model": s.dashscope_model, "input": {"messages": [{"role": "user", "content": content}]}, "parameters": params}
|
||||
|
||||
async with httpx.AsyncClient(timeout=s.request_timeout, verify=False) as client:
|
||||
resp = await client.post(url, headers=headers, json=body)
|
||||
resp.raise_for_status()
|
||||
data = resp.json()
|
||||
if is_wan:
|
||||
task_id = data.get("output", {}).get("task_id", "")
|
||||
if not task_id:
|
||||
raise RuntimeError(f"通义万象未返回 task_id: {data}")
|
||||
img_url = await _tongyi_poll_task(client, s.dashscope_api_key, task_id, s.poll_max_wait)
|
||||
if img_url.startswith("data:") or len(img_url) > 500:
|
||||
return base64.b64decode(img_url.split(",", 1)[-1] if "," in img_url else img_url)
|
||||
dl = await client.get(img_url, timeout=s.request_timeout)
|
||||
dl.raise_for_status()
|
||||
return dl.content
|
||||
img_url = data["output"]["choices"][0]["message"]["content"][0]["image"]
|
||||
dl = await client.get(img_url, timeout=s.request_timeout)
|
||||
dl.raise_for_status()
|
||||
return dl.content
|
||||
|
||||
|
||||
GENERATORS = {"doubao": generate_doubao, "tongyi": generate_tongyi}
|
||||
|
||||
|
||||
# ── 任务执行器 ────────────────────────────────────────────────────────────
|
||||
|
||||
def _order_refs(refs: list[str], type_id: str) -> list[str]:
|
||||
"""参考图槽位选择 + 截断：material 偏好第 2 张，其余用第 1 张。"""
|
||||
preferred = TYPE_REF_INDEX.get(type_id)
|
||||
if preferred is not None and len(refs) > preferred:
|
||||
refs = [refs[preferred]] + [r for i, r in enumerate(refs) if i != preferred]
|
||||
return refs[:DEFAULT_REF_COUNT]
|
||||
|
||||
|
||||
def _refs_for_job(images: list[dict], job: dict) -> list[str]:
|
||||
"""无状态路径：按方案项选参考图。
|
||||
|
||||
优先 variant_name 精确匹配（「主图·粉色」用粉色那张 SKU 图）；
|
||||
匹配不到则回退 main 组第一张（再退到任意第一张）。
|
||||
"""
|
||||
variant = job.get("variant_name")
|
||||
if variant:
|
||||
matched = [i["url"] for i in images if i.get("variant_name") == variant]
|
||||
if matched:
|
||||
return matched[:DEFAULT_REF_COUNT]
|
||||
mains = [i["url"] for i in images if i.get("group_key") == "main"]
|
||||
others = [i["url"] for i in images if i.get("group_key") != "main"]
|
||||
pool = mains or others or [i["url"] for i in images]
|
||||
if not pool:
|
||||
raise RuntimeError("任务没有参考图")
|
||||
return _order_refs(pool, job.get("kind", ""))
|
||||
|
||||
|
||||
async def _select_ref_images(db, product_id: UUID, type_id: str) -> list[str]:
|
||||
"""商品路径：主图组前几张。转存完成的用本地文件，未完成的直接用源站 URL。"""
|
||||
assets = (await db.scalars(
|
||||
select(ProductAsset).where(
|
||||
ProductAsset.product_id == product_id,
|
||||
ProductAsset.group_key == "main",
|
||||
ProductAsset.type == "img",
|
||||
).order_by(ProductAsset.sort_order)
|
||||
)).all()
|
||||
refs = [a.stored_url or a.source_url for a in assets if (a.stored_url or a.source_url)]
|
||||
if not refs:
|
||||
raise RuntimeError("商品没有可用参考图（未采集主图）")
|
||||
return _order_refs(refs, type_id)
|
||||
|
||||
|
||||
async def run_suite(suite_id: str) -> None:
|
||||
"""后台执行套图任务：逐张生成 → 落盘 → 记录；单张失败不中断。
|
||||
|
||||
两条路径：
|
||||
- 无状态（product_id 为空）：上下文与参考图来自请求自带的 context / ref_images
|
||||
- 商品路径（兼容旧流程）：从 product + product_assets 取
|
||||
"""
|
||||
settings = get_settings()
|
||||
async with get_session_factory()() as db:
|
||||
suite = await db.get(Suite, UUID(suite_id))
|
||||
if suite is None:
|
||||
return
|
||||
|
||||
product = None
|
||||
if suite.product_id:
|
||||
product = await db.get(Product, suite.product_id)
|
||||
if product is None:
|
||||
suite.status = SUITE_FAILED
|
||||
suite.error = "商品不存在"
|
||||
await db.commit()
|
||||
return
|
||||
|
||||
suite.status = SUITE_RUNNING
|
||||
await db.commit()
|
||||
|
||||
provider_name = suite.provider or settings.image_provider
|
||||
generator = GENERATORS.get(provider_name)
|
||||
if generator is None:
|
||||
suite.status = SUITE_FAILED
|
||||
suite.error = f"未知 provider: {provider_name}"
|
||||
await db.commit()
|
||||
return
|
||||
|
||||
raw = suite.context if not product else (product.raw or {})
|
||||
ctx = build_context(raw or {}, fallback_name=product.name if product else "")
|
||||
size = _image_size(provider_name, suite.ratio, is_wan=_is_wan_model(settings.dashscope_model))
|
||||
|
||||
# 任务列表：方案（逐张）优先，旧路径按 types
|
||||
if suite.plan:
|
||||
jobs = [dict(j) for j in suite.plan]
|
||||
else:
|
||||
jobs = [
|
||||
{"kind": t, "title": type_name(t), "detail": "", "prompt_hint": "", "variant_name": None}
|
||||
for t in (suite.types or [])
|
||||
]
|
||||
|
||||
ok, failed = 0, 0
|
||||
for job in jobs:
|
||||
type_id = job["kind"]
|
||||
image_row = SuiteImage(
|
||||
suite_id=suite.id,
|
||||
type_id=type_id,
|
||||
name=job.get("title") or type_name(type_id),
|
||||
status=STATUS_FAILED,
|
||||
)
|
||||
db.add(image_row)
|
||||
await db.flush()
|
||||
try:
|
||||
prompt = build_prompt(type_id, ctx, suite.style_set, suite.lang, extra=job)
|
||||
if product:
|
||||
refs = await _select_ref_images(db, product.id, type_id)
|
||||
else:
|
||||
refs = _refs_for_job(list(suite.ref_images or []), job)
|
||||
data = await generator(prompt, refs, size=size)
|
||||
key = storage.write_bytes(data, key_prefix=f"suites/{suite.id}", ext=".jpg")
|
||||
image_row.stored_url = storage.public_url(key)
|
||||
image_row.status = STATUS_OK
|
||||
ok += 1
|
||||
except Exception as exc: # noqa: BLE001
|
||||
log.exception("套图 %s 类型 %s 生成失败", suite_id, type_id)
|
||||
image_row.error = str(exc)[:500]
|
||||
failed += 1
|
||||
await db.commit()
|
||||
|
||||
suite.status = SUITE_DONE if failed == 0 else (SUITE_PARTIAL if ok > 0 else SUITE_FAILED)
|
||||
if failed and not ok:
|
||||
suite.error = "全部生成失败，请检查 API Key / 参考图"
|
||||
from datetime import datetime, timezone
|
||||
suite.finished_at = datetime.now(timezone.utc)
|
||||
if product:
|
||||
product.stage = "generated" # 商品路径才有的阶段升级
|
||||
await db.commit()
|
||||
@@ -0,0 +1,134 @@
|
||||
"""出图方案规划器：DeepSeek 根据采集的商品信息生成套图方案。
|
||||
|
||||
方案每项 = 一类图（标题 + 说明 + 生图提示 + 张数 + 可选 SKU 绑定），
|
||||
生成时按方案逐张出图；参考图可按 variant_name 精确绑定到对应 SKU 图。
|
||||
"""
|
||||
from __future__ import annotations
|
||||
|
||||
import json
|
||||
import logging
|
||||
|
||||
import httpx
|
||||
|
||||
from config import get_settings
|
||||
|
||||
log = logging.getLogger("suite.planner")
|
||||
|
||||
# 规划器可选用的图类型（与 prompt.py 的 builder 对应）
|
||||
ALLOWED_KINDS = [
|
||||
"white_bg", "key_features", "selling_pt", "material",
|
||||
"lifestyle", "multi_scene", "ecommerce_detail",
|
||||
"size_chart", "sku_collection", "custom",
|
||||
]
|
||||
|
||||
SYSTEM_PROMPT = """你是一名资深电商视觉策划。根据商品信息规划一套电商详情页/主图套图的出图方案。
|
||||
|
||||
## 规划规则
|
||||
1. SKU 主图：商品有多个带图 SKU（颜色/款式）时，每个 SKU 出 1 张独立主图（kind=white_bg），
|
||||
并在 variant_name 里填对应的 SKU 规格名（必须来自「SKU规格」列表，原样照抄）；
|
||||
单 SKU 商品出 1 张主图即可（variant_name 留空）。
|
||||
2. 场景图（kind=lifestyle）：按商品的核心使用场景出 2-4 张，每张聚焦一个场景，场景从描述/参数里提取。
|
||||
3. 细节图（kind=material 或 custom）：按商品的关键细节/材质/结构出 2-3 张，每张聚焦一个卖点细节。
|
||||
4. 尺寸标注图（kind=size_chart）：参数里有长宽高/尺寸数据时出 1 张。
|
||||
5. SKU 合集图（kind=sku_collection）：SKU 数量 >1 时出 1 张，同款多色整齐排列。
|
||||
6. 可用 kind 枚举：white_bg / key_features / selling_pt / material / lifestyle / multi_scene /
|
||||
ecommerce_detail / size_chart / sku_collection / custom。其他创意图用 custom。
|
||||
7. 总张数控制在 8-15 张；每项 count 为 1-3。
|
||||
8. title 用中文短语（≤8字，如「主图·粉色」「浴室壁挂场景」）；detail 用中文说明这张图要展示什么（≤40字）；
|
||||
prompt_hint 用英文描述构图（角度/布局/光线要点，≤60 words），供生图模型使用。
|
||||
|
||||
## 输出格式（严格 JSON，不要多余文字）
|
||||
{
|
||||
"summary": "整体思路一句话",
|
||||
"items": [
|
||||
{"kind": "white_bg", "title": "主图·粉色", "detail": "粉色SKU白底主视觉", "prompt_hint": "front view on pure white background", "count": 1, "variant_name": "粉色"}
|
||||
]
|
||||
}"""
|
||||
|
||||
|
||||
def _normalize_items(raw_items: list, sku_variants: list[str]) -> list[dict]:
|
||||
"""清洗模型输出：kind 白名单、count 钳制、variant 必须真实存在。"""
|
||||
items: list[dict] = []
|
||||
for it in raw_items:
|
||||
if not isinstance(it, dict):
|
||||
continue
|
||||
kind = str(it.get("kind") or "custom")
|
||||
if kind not in ALLOWED_KINDS:
|
||||
kind = "custom"
|
||||
title = str(it.get("title") or "").strip()[:20]
|
||||
if not title:
|
||||
continue
|
||||
try:
|
||||
count = max(0, min(3, int(it.get("count", 1))))
|
||||
except (TypeError, ValueError):
|
||||
count = 1
|
||||
variant = str(it.get("variant_name") or "").strip() or None
|
||||
if variant and variant not in sku_variants:
|
||||
variant = None # 幻觉规格：丢弃绑定，回退主图
|
||||
items.append({
|
||||
"kind": kind,
|
||||
"title": title,
|
||||
"detail": str(it.get("detail") or "").strip()[:80],
|
||||
"prompt_hint": str(it.get("prompt_hint") or "").strip()[:300],
|
||||
"count": count,
|
||||
"variant_name": variant,
|
||||
})
|
||||
return items
|
||||
|
||||
|
||||
async def generate_plan(
|
||||
product_info: dict,
|
||||
sku_variants: list[str],
|
||||
image_stats: dict,
|
||||
platform: str,
|
||||
) -> dict:
|
||||
"""调用 DeepSeek 生成方案。返回 {summary, items}。"""
|
||||
s = get_settings()
|
||||
if not s.deepseek_api_key:
|
||||
raise RuntimeError("未配置 DEEPSEEK_API_KEY（.env）")
|
||||
|
||||
user_content = json.dumps({
|
||||
"商品信息": product_info, # {title, desc, params:[{key,value}], sellingPoints, price}
|
||||
"SKU规格": sku_variants, # 带图的 SKU 规格名（variant_name 只能从中选）
|
||||
"图片统计": image_stats, # {main: n, sku: n, detail: n}
|
||||
"目标平台": platform, # ozon/wb/cn（决定图内文案语言）
|
||||
}, ensure_ascii=False)
|
||||
|
||||
async with httpx.AsyncClient(timeout=60, verify=False) as client:
|
||||
resp = await client.post(
|
||||
f"{s.deepseek_base_url.rstrip('/')}/chat/completions",
|
||||
headers={"Authorization": f"Bearer {s.deepseek_api_key}", "Content-Type": "application/json"},
|
||||
json={
|
||||
"model": s.deepseek_model,
|
||||
"messages": [
|
||||
{"role": "system", "content": SYSTEM_PROMPT},
|
||||
{"role": "user", "content": user_content},
|
||||
],
|
||||
"response_format": {"type": "json_object"},
|
||||
"temperature": 0.3,
|
||||
"max_tokens": 2000,
|
||||
},
|
||||
)
|
||||
resp.raise_for_status()
|
||||
content = resp.json()["choices"][0]["message"]["content"]
|
||||
|
||||
try:
|
||||
data = json.loads(content)
|
||||
except json.JSONDecodeError as exc:
|
||||
log.error("规划器输出不是合法 JSON: %s", content[:200])
|
||||
raise RuntimeError("规划器输出解析失败") from exc
|
||||
|
||||
items = _normalize_items(data.get("items") or [], sku_variants)
|
||||
if not items:
|
||||
raise RuntimeError("规划器未返回有效方案项")
|
||||
# 总量保护：超过 18 张时按比例截断
|
||||
total = sum(i["count"] for i in items)
|
||||
while total > 18 and items:
|
||||
last = items[-1]
|
||||
if last["count"] > 1:
|
||||
last["count"] -= 1
|
||||
else:
|
||||
items.pop()
|
||||
total = sum(i["count"] for i in items)
|
||||
|
||||
return {"summary": str(data.get("summary") or "").strip()[:100], "items": items}
|
||||
@@ -0,0 +1,290 @@
|
||||
"""套图 Prompt 引擎。
|
||||
|
||||
借鉴 ecommerce-image-suite 的动态 Prompt 架构，浓缩为：
|
||||
- 7 种图类型 × 5 套视觉风格模板
|
||||
- 公共组件：QUALITY（画质）/ PRODUCT_REF_LOCK（商品一致性锁）/ TEXT_RENDER（图内文案规范）
|
||||
- 卖点从采集的参数表/卖点文本自动提炼
|
||||
|
||||
核心原则：所有图严格保持商品一致性（same silhouette, same print, same color），
|
||||
只允许改变背景 / 角度 / 光线 / 排版。
|
||||
"""
|
||||
from __future__ import annotations
|
||||
|
||||
import re
|
||||
|
||||
# ── 风格模板（与插件端 STYLE_SET_OPTIONS 对应）─────────────────────────────
|
||||
|
||||
STYLE_SETS: dict[int, dict] = {
|
||||
1: {
|
||||
"name": "经典商拍",
|
||||
"tone": "premium commercial e-commerce photography, clean soft studio lighting, "
|
||||
"gentle gradient background, catalog-grade presentation, refined and trustworthy",
|
||||
"bg": "light neutral studio backdrop with soft vignette",
|
||||
},
|
||||
2: {
|
||||
"name": "生活杂志",
|
||||
"tone": "editorial lifestyle magazine aesthetic, natural window light, "
|
||||
"cozy lived-in atmosphere, muted film tones, candid storytelling",
|
||||
"bg": "warm lifestyle home setting with plants and textured fabrics",
|
||||
},
|
||||
3: {
|
||||
"name": "极简高冷",
|
||||
"tone": "minimalist high-end aesthetic, vast negative space, single directional light, "
|
||||
"cool grey palette, architectural calm, quiet luxury",
|
||||
"bg": "seamless light grey studio background with subtle shadow",
|
||||
},
|
||||
4: {
|
||||
"name": "活力爆款",
|
||||
"tone": "vibrant high-conversion e-commerce style, punchy saturated accents, "
|
||||
"energetic composition, bold contrast, promotional poster energy",
|
||||
"bg": "bright colorful gradient backdrop with dynamic geometric shapes",
|
||||
},
|
||||
5: {
|
||||
"name": "暗调质感",
|
||||
"tone": "dark moody premium product photography, dramatic rim lighting, "
|
||||
"deep charcoal background, rich texture detail, luxurious atmosphere",
|
||||
"bg": "matte black background with soft spotlight and subtle smoke haze",
|
||||
},
|
||||
}
|
||||
|
||||
# ── 图类型中文名（导出文件名用）───────────────────────────────────────────
|
||||
|
||||
TYPE_NAMES_ZH: dict[str, str] = {
|
||||
"white_bg": "白底主图",
|
||||
"key_features": "核心卖点图",
|
||||
"selling_pt": "卖点图",
|
||||
"material": "材质图",
|
||||
"lifestyle": "场景展示图",
|
||||
"multi_scene": "多场景拼图",
|
||||
"ecommerce_detail": "电商详情图",
|
||||
"size_chart": "尺寸标注图",
|
||||
"sku_collection": "SKU合集图",
|
||||
"custom": "创意图",
|
||||
}
|
||||
|
||||
# ── 公共组件 ──────────────────────────────────────────────────────────────
|
||||
|
||||
QUALITY = (
|
||||
"Shot on Sony A7R V with 85mm lens at f/2.0, ultra-detailed, photorealistic, "
|
||||
"8K commercial image quality, professional retouching."
|
||||
)
|
||||
|
||||
PRODUCT_REF_LOCK = (
|
||||
"CRITICAL: The product must look EXACTLY the same as in the reference image — "
|
||||
"identical silhouette, proportions, colors, print pattern, stitching and every design detail. "
|
||||
"Only the background, camera angle, lighting and styling may change. "
|
||||
"Do not redesign, add or remove any element of the product."
|
||||
)
|
||||
|
||||
TEXT_RENDER = {
|
||||
"zh": (
|
||||
"Render concise Chinese marketing text inside the image: main headline max 8 Chinese characters, "
|
||||
"sub-lines max 12 characters each, font is modern clean sans-serif (Source Han Sans style), "
|
||||
"high legibility, tasteful typography layout, colors harmonized with the composition. "
|
||||
"No spelling errors, no garbled characters."
|
||||
),
|
||||
"en": (
|
||||
"Render concise English marketing text inside the image: headline max 5 words, "
|
||||
"sub-lines max 8 words each, Helvetica Neue style sans-serif, high legibility, "
|
||||
"tasteful typography layout, colors harmonized with the composition. No spelling errors."
|
||||
),
|
||||
"ru": (
|
||||
"Render concise Russian marketing text inside the image: headline max 4 words, "
|
||||
"sub-lines max 6 words each, modern clean sans-serif (Inter / PT Sans style), "
|
||||
"proper Cyrillic typography, high legibility, tasteful layout, colors harmonized with the composition. "
|
||||
"No spelling errors, no mixed latin/cyrillic gibberish."
|
||||
),
|
||||
}
|
||||
|
||||
DEFAULT_NEGATIVE_INTENT = (
|
||||
"no AI-generated look, no CGI quality, no plastic appearance, no watermark, "
|
||||
"no distorted text, no deformed product, no extra limbs, no blurry areas"
|
||||
)
|
||||
|
||||
# ── 商品上下文提炼 ────────────────────────────────────────────────────────
|
||||
|
||||
def _shorten(text: str, n: int) -> str:
|
||||
text = re.sub(r"\s+", " ", (text or "")).strip()
|
||||
return text[:n]
|
||||
|
||||
def _clean_title(title: str) -> str:
|
||||
"""去掉常见堆砌词，让标题更可读。"""
|
||||
t = _shorten(title, 60)
|
||||
return re.sub(r"[【【】】\\[\\]|/]", " ", t).strip()
|
||||
|
||||
def build_context(raw: dict, fallback_name: str = "", fallback_desc: str = "") -> dict:
|
||||
"""从采集数据提炼生图上下文：标题、描述行、卖点列表、参数行。
|
||||
|
||||
raw: {title, desc, price, params: [{key, value}], sellingPoints}
|
||||
"""
|
||||
title = _clean_title(raw.get("title") or fallback_name or "product")
|
||||
desc = _shorten(raw.get("desc") or fallback_desc or "", 200)
|
||||
|
||||
# 卖点：优先显式卖点文本；否则从参数表里挑短而有信息量的键值对
|
||||
selling_points: list[dict] = []
|
||||
sp_text = raw.get("sellingPoints") or ""
|
||||
if sp_text:
|
||||
for chunk in re.split(r"[；;\n·]+|(?<!\d)\.(?!\d)", sp_text):
|
||||
c = _shorten(chunk, 20)
|
||||
if c and len(selling_points) < 5:
|
||||
selling_points.append({"zh": c, "en": c})
|
||||
if not selling_points:
|
||||
for p in (raw.get("params") or [])[:12]:
|
||||
k, v = _shorten(p.get("key", ""), 10), _shorten(str(p.get("value", "")), 16)
|
||||
if k and v and k.lower() not in {"货号", "sku", "isbn", "上架时间"}:
|
||||
selling_points.append({"zh": f"{k} {v}", "en": f"{k} {v}"})
|
||||
if len(selling_points) >= 5:
|
||||
break
|
||||
|
||||
params_line = "; ".join(
|
||||
f"{p.get('key')}: {p.get('value')}" for p in (raw.get("params") or [])[:8]
|
||||
)
|
||||
return {
|
||||
"title": title,
|
||||
"title_en": title, # 采集源多为中文标题，英文场景直接用原词避免乱翻译
|
||||
"desc": desc,
|
||||
"selling_points": selling_points[:3],
|
||||
"params_line": params_line,
|
||||
"price": raw.get("price") or "",
|
||||
}
|
||||
|
||||
def _sp_lines(ctx: dict, lang: str, max_n: int = 3) -> str:
|
||||
sps = ctx["selling_points"][:max_n]
|
||||
if not sps:
|
||||
return ""
|
||||
key = "zh" if lang == "zh" else "en"
|
||||
return "; ".join(s[key] for s in sps if s.get(key))
|
||||
|
||||
# ── 各图类型 Prompt ───────────────────────────────────────────────────────
|
||||
|
||||
def _prompt_white_bg(ctx: dict, style: dict, lang: str) -> str:
|
||||
return (
|
||||
f"E-commerce main product image on pure white background (RGB 255,255,255), "
|
||||
f"product \"{ctx['title']}\" centered and filling about 85% of the frame, "
|
||||
f"front view, even shadowless studio lighting with a faint natural contact shadow, "
|
||||
f"{style['tone']}. No text, no props, no background elements. {QUALITY} {PRODUCT_REF_LOCK}"
|
||||
)
|
||||
|
||||
def _prompt_key_features(ctx: dict, style: dict, lang: str) -> str:
|
||||
sp = _sp_lines(ctx, lang) or ctx["title"]
|
||||
return (
|
||||
f"E-commerce key-features infographic for product \"{ctx['title']}\", square layout: "
|
||||
f"product on the left two-thirds ({style['bg']}), right column lists 3 feature callouts "
|
||||
f"with minimal line icons, thin leader lines pointing to product details. "
|
||||
f"Feature callouts: {sp}. {style['tone']}. {TEXT_RENDER[lang]} {QUALITY} {PRODUCT_REF_LOCK}"
|
||||
)
|
||||
|
||||
def _prompt_selling_pt(ctx: dict, style: dict, lang: str) -> str:
|
||||
sp = _sp_lines(ctx, lang, 1) or ctx["title"]
|
||||
return (
|
||||
f"Single-selling-point e-commerce poster for product \"{ctx['title']}\": "
|
||||
f"hero product close-up at dynamic angle ({style['bg']}), one large bold headline "
|
||||
f"about \"{sp}\", generous negative space, one small magnified detail circle "
|
||||
f"highlighting material or craft. {style['tone']}. {TEXT_RENDER[lang]} {QUALITY} {PRODUCT_REF_LOCK}"
|
||||
)
|
||||
|
||||
def _prompt_material(ctx: dict, style: dict, lang: str) -> str:
|
||||
return (
|
||||
f"Macro material close-up of product \"{ctx['title']}\": extreme detail shot revealing "
|
||||
f"fabric weave / surface texture / stitching / finish, shallow depth of field, "
|
||||
f"raking light across the surface, {style['tone']}. Small caption label in corner. "
|
||||
f"{TEXT_RENDER[lang]} {QUALITY} {PRODUCT_REF_LOCK}"
|
||||
)
|
||||
|
||||
def _prompt_lifestyle(ctx: dict, style: dict, lang: str) -> str:
|
||||
return (
|
||||
f"Lifestyle in-context scene for product \"{ctx['title']}\": the product is naturally "
|
||||
f"used / placed in a real environment ({style['bg']}), realistic human-scale surroundings, "
|
||||
f"soft daylight, authentic candid mood, product remains the clear visual focus. "
|
||||
f"{style['tone']}. {TEXT_RENDER[lang]} {QUALITY} {PRODUCT_REF_LOCK}"
|
||||
)
|
||||
|
||||
def _prompt_multi_scene(ctx: dict, style: dict, lang: str) -> str:
|
||||
sp = _sp_lines(ctx, lang)
|
||||
return (
|
||||
f"Triptych multi-scene e-commerce image for product \"{ctx['title']}\": three vertical panels "
|
||||
f"separated by thin gutters, each panel shows the SAME product in a different usage scene "
|
||||
f"(e.g. home interior / outdoor street / office desk), consistent color grading across panels. "
|
||||
f"Panel captions: {sp}. {style['tone']}. {TEXT_RENDER[lang]} {QUALITY} {PRODUCT_REF_LOCK}"
|
||||
)
|
||||
|
||||
def _prompt_ecommerce_detail(ctx: dict, style: dict, lang: str) -> str:
|
||||
sp = _sp_lines(ctx, lang) or ctx["title"]
|
||||
params = ctx["params_line"]
|
||||
return (
|
||||
f"E-commerce detail-page hero section for product \"{ctx['title']}\", square layout: "
|
||||
f"top half is a hero banner with the product at a 3/4 angle ({style['bg']}); "
|
||||
f"bottom half is a clean spec card listing 3 feature rows with line icons"
|
||||
+ (f" (specs: {params})" if params else "")
|
||||
+ f" and one highlighted row: {sp}. {style['tone']}. {TEXT_RENDER[lang]} {QUALITY} {PRODUCT_REF_LOCK}"
|
||||
)
|
||||
|
||||
def _prompt_size_chart(ctx: dict, style: dict, lang: str) -> str:
|
||||
dims = ctx["params_line"]
|
||||
return (
|
||||
f"Product size chart infographic for \"{ctx['title']}\": product shown in clean front and side views "
|
||||
f"on light background, with thin measurement annotation lines (arrows) marking length, width and height, "
|
||||
f"measurement values rendered next to each line"
|
||||
+ (f" (known specs: {dims})" if dims else "")
|
||||
+ f", small caption row, precise technical drawing aesthetic. {style['tone']}. "
|
||||
f"{TEXT_RENDER[lang]} {QUALITY} {PRODUCT_REF_LOCK}"
|
||||
)
|
||||
|
||||
def _prompt_sku_collection(ctx: dict, style: dict, lang: str) -> str:
|
||||
return (
|
||||
f"Colorway collection image for product \"{ctx['title']}\": the SAME product in all its color/variant "
|
||||
f"options arranged in a neat equal grid (2-4 items per row), each colorway with a small label chip below it, "
|
||||
f"consistent lighting and scale across all items, clean e-commerce presentation. "
|
||||
f"{style['tone']}. {TEXT_RENDER[lang]} {QUALITY} {PRODUCT_REF_LOCK}"
|
||||
)
|
||||
|
||||
def _prompt_custom(ctx: dict, style: dict, lang: str, extra: dict) -> str:
|
||||
hint = (extra.get("prompt_hint") or "").strip()
|
||||
purpose = extra.get("title") or ""
|
||||
detail = extra.get("detail") or ""
|
||||
composed = (
|
||||
f"E-commerce marketing image for product \"{ctx['title']}\""
|
||||
+ (f" — {purpose}" if purpose else "")
|
||||
+ (f": {detail}" if detail else "")
|
||||
+ "."
|
||||
)
|
||||
if hint:
|
||||
composed += f" Composition: {hint}."
|
||||
return f"{composed} {style['tone']}. {style['bg']} as environment. {TEXT_RENDER[lang]} {QUALITY} {PRODUCT_REF_LOCK}"
|
||||
|
||||
_PROMPT_BUILDERS = {
|
||||
"white_bg": _prompt_white_bg,
|
||||
"key_features": _prompt_key_features,
|
||||
"selling_pt": _prompt_selling_pt,
|
||||
"material": _prompt_material,
|
||||
"lifestyle": _prompt_lifestyle,
|
||||
"multi_scene": _prompt_multi_scene,
|
||||
"ecommerce_detail": _prompt_ecommerce_detail,
|
||||
"size_chart": _prompt_size_chart,
|
||||
"sku_collection": _prompt_sku_collection,
|
||||
}
|
||||
|
||||
|
||||
def build_prompt(type_id: str, ctx: dict, style_set: int, lang: str, extra: dict | None = None) -> str:
|
||||
"""构造指定图类型的完整生图 prompt。
|
||||
|
||||
extra: 方案项信息 {title, detail, prompt_hint}——custom 类型必需，
|
||||
预设类型也会把 prompt_hint 作为构图补充注入。
|
||||
"""
|
||||
style = STYLE_SETS.get(style_set, STYLE_SETS[1])
|
||||
extra = extra or {}
|
||||
if type_id == "custom":
|
||||
prompt = _prompt_custom(ctx, style, lang, extra)
|
||||
else:
|
||||
builder = _PROMPT_BUILDERS.get(type_id)
|
||||
if builder is None:
|
||||
raise ValueError(f"未知图类型: {type_id}")
|
||||
prompt = builder(ctx, style, lang)
|
||||
hint = (extra.get("prompt_hint") or "").strip()
|
||||
if hint:
|
||||
prompt = prompt.rstrip(".") + f". Additional composition guidance: {hint}."
|
||||
return prompt + ". " + DEFAULT_NEGATIVE_INTENT
|
||||
|
||||
|
||||
def type_name(type_id: str) -> str:
|
||||
return TYPE_NAMES_ZH.get(type_id, type_id)
|
||||
@@ -0,0 +1,70 @@
|
||||
"""本地文件存储：落 data/media/，由 FastAPI /media 静态托管。"""
|
||||
from __future__ import annotations
|
||||
|
||||
import mimetypes
|
||||
import uuid
|
||||
from pathlib import Path
|
||||
|
||||
import httpx
|
||||
|
||||
from config import get_settings
|
||||
|
||||
|
||||
def media_root() -> Path:
|
||||
root = Path(get_settings().data_dir) / "media"
|
||||
root.mkdir(parents=True, exist_ok=True)
|
||||
return root
|
||||
|
||||
|
||||
def public_url(key: str) -> str:
|
||||
"""media key → 可访问 URL。"""
|
||||
settings = get_settings()
|
||||
return f"{settings.app_base_url.rstrip('/')}/media/{key}"
|
||||
|
||||
|
||||
def _ext_from_url_or_type(hint: str, content_type: str = "") -> str:
|
||||
if content_type:
|
||||
ctype = content_type.split(";")[0].strip().lower()
|
||||
mapping = {
|
||||
"image/jpeg": ".jpg", "image/png": ".png", "image/webp": ".webp",
|
||||
"image/gif": ".gif", "image/bmp": ".bmp", "video/mp4": ".mp4",
|
||||
}
|
||||
if ctype in mapping:
|
||||
return mapping[ctype]
|
||||
ext = mimetypes.guess_extension(hint.split("?")[0].lower()) or ".jpg"
|
||||
return ".jpg" if ext == ".jpe" else ext
|
||||
|
||||
|
||||
def write_bytes(data: bytes, key_prefix: str = "", ext: str = ".jpg") -> str:
|
||||
"""写文件，返回 media key（相对 media 根的路径）。"""
|
||||
key = f"{key_prefix + '/' if key_prefix else ''}{uuid.uuid4().hex}{ext}"
|
||||
path = media_root() / key
|
||||
path.parent.mkdir(parents=True, exist_ok=True)
|
||||
path.write_bytes(data)
|
||||
return key
|
||||
|
||||
|
||||
async def download_bytes(url: str, referer: str | None = None, timeout: float = 60.0) -> tuple[bytes, str]:
|
||||
"""下载远程字节。返回 (bytes, content_type)。"""
|
||||
headers = {"Referer": referer} if referer else {}
|
||||
headers.setdefault("User-Agent", "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7)")
|
||||
async with httpx.AsyncClient(timeout=timeout, follow_redirects=True, verify=False) as client:
|
||||
resp = await client.get(url, headers=headers)
|
||||
resp.raise_for_status()
|
||||
ctype = (resp.headers.get("content-type") or "application/octet-stream").split(";")[0].strip()
|
||||
return resp.content, ctype
|
||||
|
||||
|
||||
async def save_from_url(url: str, key_prefix: str = "", referer: str | None = None) -> str:
|
||||
data, ctype = await download_bytes(url, referer)
|
||||
key = write_bytes(data, key_prefix, _ext_from_url_or_type(url, ctype))
|
||||
return public_url(key)
|
||||
|
||||
|
||||
def local_path(stored_url_or_key: str) -> Path | None:
|
||||
"""stored_url（http.../media/xxx）或 key → 本地文件路径。"""
|
||||
s = stored_url_or_key
|
||||
if "/media/" in s:
|
||||
s = s.split("/media/", 1)[1]
|
||||
p = media_root() / s
|
||||
return p if p.exists() else None
|
||||
Reference in New Issue
Block a user