构建与
SPREEAI.

Shopify 应用

当商店在 Shopify 上运行并且不需要自定义后端时，请使用托管应用程序。目前的入职流程是在协议和订阅之后连接商店；它不需要将 API 密钥复制到设置屏幕中。

1. 安装官方 SPREEAI 应用程序并完成托管同意流程。
2. 同步初始产品目录组并审核产品准备状态。
3. 在重复的主题中自定义位置和样式。
4. 验证合格的产品、变体、移动行为和添加到购物车。
5. 仅在品牌和质量检查批准后发布。

打开官方 Shopify 入职指南

Web SDK 快速入门

使用 @spreeai/web-sdk 用于自定义放置、样式、事件、尺寸和购物车行为。

npm install @spreeai/web-sdk@3.0.0

import { init } from "@spreeai/web-sdk";
import "@spreeai/web-sdk/dist/web-sdk.css";

// Add <div id="spreeai-try-on"></div> to the product page first.
const sdk = await init({ clientId: "your-client-id" });

if (sdk) {
  await sdk.renderTryOnButton({
    elementId: "spreeai-try-on",
    garments: [{ garmentId: "your-garment-id" }],
    enableAddToCart: true,
  });
}

初始化一次，仅呈现符合条件的产品，并将记录的客户端回调连接到您现有的分析。确认当前界面 官方Web SDK API参考

API访问

仅将公共 Swagger 参考用于入职期间批准的服务器端工作流程。在您的服务器上保密，单独的测试和生产访问，并将凭据范围限制在所需的最低环境中。

在合作伙伴工程部门确认之前，批准的公共参考中不存在的直接 REST 端点、Webhook 或身份验证行为应被视为不可用。

打开已批准的公共 API 参考

服装资产基线

• JPEG 或 PNG；最小 2,000 × 2,000 像素，最好约为 4K。
• 每张图像一件衣服，以清晰的边缘和中性、均匀的灯光为中心。
• 需要正面图；启用该体验时建议使用后视图。
• 文件名和目录记录中包含稳定的 SKU、款式或服装 ID。
• 没有手、衣架、造型道具、水印或不相关的衣服遮挡该物品。
• 在启用体验之前检查变体映射。

质量检查和发布

• 在当前的移动和桌面浏览器上测试完整的客户旅程。
• 验证产品和变体映射、服装准备情况和购物车行为。
• 检查键盘访问、焦点顺序、可访问名称和后备行为。
• 测量启用 SPREEAI 之前和之后的产品页面性能。
• 练习加载、空、不可用、超时和重试状态。
• 确认同意语言并批准对客户图像的处理。
• 在生产前获得工程、商务、质量保证和品牌认可。

故障排除

按钮未显示

确认 SDK 初始化、客户端标识符、主机元素 ID、产品资格、服装准备情况和变体映射。然后检查浏览器控制台和网络错误而不共享令牌。

出现错误的产品或变体

将店面产品和款式 ID 与发送到 SPREEAI 的记录进行比较。确认当购物者更改款式时，呈现的请求也会发生变化。

体验缓慢或不可用

测试已知可用的产品，验证运行环境，检查被阻止的请求，并与干净的浏览器会话进行比较。记录时间戳和可重现的故障序列，以便技术支持。

获得开发者支持

电子邮件 support@spreeai.com 包括环境、产品或服装 ID、浏览器或设备、大致时间戳、预期行为和再现步骤。请勿包含秘密或客户图像。