Shopware 6.5中如何通过JavaScript访问Store API接口？原客户端已删除

核心变化说明 #

Shopware 6.5 移除了旧版的 store-api-client.service.js，官方现在推荐使用内置的 HttpClient（基于 Fetch API 封装的服务）来发起 Store API 请求，它会自动处理 Shopware 所需的认证头和请求逻辑。

你的 6.4 代码改写示例 #

以下是适配 6.5 版本的代码实现，直接替换原有逻辑即可：

export default class YourPlugin extends Plugin {
    init() {
        // 从插件容器中获取 HttpClient 服务
        this._httpClient = this.container.get('httpClient');
        // 调用业务方法
        this.initiateChat();
    }

    initiateChat() {
        return new Promise((resolve, reject) => {
            this._httpClient.get('/store-api/script/modigChatApp/initiate-chat')
                .then(response => response.json())
                .then(data => {
                    if (!data.subscriberToken) {
                        reject(data);
                        return;
                    }
                    resolve(data.subscriberToken);
                })
                .catch(error => reject(error));
        });
    }
}

关键注意事项 #

• 依赖注入：必须通过插件容器获取 httpClient，它会自动携带 sw-context-token 等必要认证头，无需手动配置。
• 响应处理：HttpClient 的请求方法返回 Promise，调用 response.json() 即可直接获取解析后的 JSON 数据，无需手动执行 JSON.parse()。
• 错误捕获：务必通过 .catch() 处理请求失败场景，比如网络错误、API 返回的错误状态码等。

替代方案：原生 Fetch API #

如果不想依赖内置的 HttpClient，也可以直接使用原生 Fetch API，但需要手动添加认证头：

fetch('/store-api/script/modigChatApp/initiate-chat', {
    headers: {
        'sw-context-token': window.Shopware.Context.api.contextToken,
        'Content-Type': 'application/json'
    }
})
.then(response => response.json())
.then(data => {
    if (data.subscriberToken) {
        // 处理成功逻辑
    } else {
        // 处理无 token 情况
    }
})
.catch(error => {
    // 处理请求错误
});

不过更推荐使用 HttpClient，它已经封装了 Shopware 特有的请求逻辑，能避免手动配置头信息的遗漏问题。

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