Vue3+组合式API调用getStream报错：userToken无user_id或不匹配

我在Vue3项目里用组合式API集成GetStream Chat，调用connectUser时遇到这个报错：

Error: userToken does not have a user_id or is not matching with user.id

后端接口返回的是GetStream生成的token，但无法正常建立连接。以下是相关代码：

获取Token的逻辑 #

onMounted(async () => {
 try {
  const data = await $fetch(`${config.public.apiBase}/v1/chat/token`, 
 {
  headers: {"authorization": "Bearer " + user.value.token},
 });

    if (data) {
      userToken.value = data.token;
    }

 } catch (error) {
  console.error(error);
 }

 await setupChat();
});

初始化Chat客户端的逻辑 #

const setupChat = async () => {
 if (!userToken.value) {
  console.error("User token is not available.");
  return;
 }

 try {
  if(!chatClient.user){
   console.log(userToken.value, 'userToken')
    await chatClient.connectUser(
  {
    id: user.value.id,
    name: user.value.name,
  },
   userToken.value,
  );
 }

    console.log(chatClient.user, 'chatClient.user')
    
    showOnline.value = true; // Display user online upon connection

 } catch (error) {
  console.error(error)
 }

};

有没有人遇到过同样的问题？

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