react-native - 世博会应用程序中的 Pusher chatKit onMessage 挂钩失败

Question

我在 Expo 中使用 React Native，我可以创建用户 + 房间并使用以下代码向他们发送消息：

const hooks = {
  onMessage: message => {
    console.log("message", message);
    this.setState({
      messages: [...this.state.messages, message]
    });
  },
  onUserStartedTyping: user => {
    this.setState({
      usersWhoAreTyping: [...this.state.usersWhoAreTyping, user.name]
    });
  },
  onUserStoppedTyping: user => {
    this.setState({
      usersWhoAreTyping: this.state.usersWhoAreTyping.filter(
        username => username !== user.name
      )
    });
  },
  onPresenceChange: () => this.forceUpdate()
};

class SetupChatKit extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      chatManager: null,
      currentUser: {},
      currentRoom: {},
      messages: [],
      usersWhoAreTyping: []
    };
  }

  componentDidMount() {
    const { userId, name } = this.props;
    this.instantiateChatManager(userId);
    this.createChatKitUser({ userId, name });
  }

  joinOrCreateChatKitRoom = (mode, chatKitRoomId, title) => {
    const { chatManager } = this.state;
    return chatManager
      .connect()
      .then(currentUser => {
        this.setState({ currentUser });
        if (mode === "join") {
          return currentUser.joinRoom({ roomId: chatKitRoomId, hooks });
        }
        return currentUser.createRoom({
          name: title,
          private: false,
          hooks
        });
      })
      .then(currentRoom => {
        this.setState({ currentRoom });
        return currentRoom.id;
      })
      .catch(error => console.error("error", error));
  };

  instantiateChatManager = userId => {
    const chatManager = new Chatkit.ChatManager({
      instanceLocator: "v1:us1:9c8d8a28-7103-40cf-bbe4-727eb1a2b598",
      userId,
      tokenProvider: new Chatkit.TokenProvider({
        url: `http://${baseUrl}:3000/api/authenticate`
      })
    });
    this.setState({ chatManager });
  };

我的问题是console.log("message", message);永远不会被调用，即使我通过在线控制面板手动向房间添加消息。

我已经尝试从 chatManager 进行日志记录，如下所示：

标签： react-nativeexpopusher

Answer 1

从文档中可以看出，onMessage钩子需要附加在subscribeRoom上，而不是在加入房间时。

https://docs.pusher.com/chatkit/reference/javascript#connection-hooks

因此，可能会在您的方法subscribeToRoom()中的第一个成功承诺之后添加。joinOrCreateChatKitRoom()