凭据和环境#
为您的店铺前台配置 Visualizer SDK 凭据，如需使用还可为 Product Import API 配置。阅读公开文档不会创建凭据或授予店铺访问权限。
哪些凭据属于哪里？#
| 集成 | 凭据 | 归属位置 |
|---|---|---|
| 店铺前台 SDK | Shop ID 和 Publishable Key | 店铺前台 SDK 脚本属性 |
| Product Import API | Client ID 和 Client Secret | 您的后端或安全的服务器端任务 |
Publishable Key 专用于浏览器环境。Client Secret 必须保留在您的服务器上。切勿将它们粘贴到主题文件、公开 Markdown、客户端打包文件或支持截图里。
获取并配置凭据#
打开 商家工作台，选择正确的店铺并查看 SDK Integration 和 Settings。按照入驻说明获取 Client ID 和 Client Secret。
配置 Allowed Origins (CORS)#
在测试或发布 SDK 之前，打开正确店铺的 Dashboard → Settings，找到 Allowed Origins (CORS)。
- 输入将加载 SDK 的店铺前台来源，用逗号分隔。例如：
https://example.com, https://www.example.com, https://shop.example.com。 - 使用协议和主机名，加上适用时的端口，不包含页面路径、查询字符串或片段标识符。如果在该处测试 SDK，也请添加您的预览或预发来源；仅当
http://localhost:3000是实际本地测试来源时才使用它。 - 点击 Save，然后重新加载店铺前台，再次测试 SDK。
检查顾客实际访问的 URL：https://example.com 和 https://www.example.com 是不同的来源。本地或预览测试通过并不代表已配置发布来源。
替换示例值#
示例使用 <SHOP_ID>、<PUBLISHABLE_KEY> 和 <YOUR_CLIENT_SECRET> 等占位符。仅在预期的环境中替换它们。HTML 示例可能将尖括号编码为 < 和 >；替换整个占位符，包括该编码。
SDK 和产品导入环境#
浏览器使用来自同一店铺的 Shop ID 和 Publishable Key 加载 https://sdk.ideal.house/sdk.js。Product Import API 继续使用 https://sdkapi.ideal.house，附带其文档化的服务端认证。
如上所述，分别配置预览和生产店铺前台的来源。在发布前使用准备好的测试商品，然后完成 上线检查清单。