如何在Wix CLI嵌入式脚本中获取Instance ID对接PHP后端？

两种靠谱的实现方式 #

方式一：直接从嵌入上下文提取（最便捷） #

Wix将嵌入式组件加载到站点时，会自动把Instance ID传入初始化参数，无需额外调用SDK。

React组件示例（CLI生成默认结构）

export default function MyEmbeddedComponent(props) {
  // 从props中直接获取instanceId
  const instanceId = props.wix?.instanceId;

  if (instanceId) {
    // 向PHP后端发送请求并携带instanceId
    fetch('https://你的后端地址.com/获取站点数据', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ instanceId })
    })
    .then(res => res.json())
    .then(siteData => {
      // 处理后端返回的站点专属数据
      console.log('站点专属数据:', siteData);
    });
  }

  return <div>加载中...</div>;
}

纯JS组件写法

// 等待页面加载完成后读取上下文
document.addEventListener('DOMContentLoaded', () => {
  const instanceId = window.wixEmbeddingContext?.instanceId;
  if (instanceId) {
    // 这里调用你的PHP后端接口
  }
});

方式二：修正@wix/sdk调用姿势（解决之前的失败问题） #

你之前使用SDK未成功，大概率是未配置嵌入式模式的授权策略。

步骤说明

1. 确保依赖安装正确：

npm install @wix/sdk @wix/auth

2. 正确初始化客户端并获取Instance ID：

import { createClient } from '@wix/sdk';
import { auth } from '@wix/auth';

// 初始化客户端时指定嵌入式模式
const wixClient = createClient({
  modules: { auth },
  auth: auth.authStrategy({
    mode: 'embedded',
    getInstance: () => window.wixEmbeddingContext?.instanceId
  })
});

// 异步获取Instance ID
async function fetchInstanceId() {
  try {
    const instanceInfo = await wixClient.auth.getInstance();
    const instanceId = instanceInfo.instanceId;
    // 拿到ID后调用PHP后端接口
  } catch (err) {
    console.error('获取Instance ID失败:', err);
  }
}

// 组件初始化时执行
fetchInstanceId();

注意事项 #

• 本地直接运行脚本无法获取Instance ID，必须将组件嵌入到真实Wix站点中测试。
• 向PHP后端传递Instance ID时，建议添加参数校验，避免恶意请求。

内容的提问来源于stack exchange，提问作者Razmik Karapetyan