React Native Websocket JSON 通信

Question

我正在尝试设置一个通过 JSON 与网络服务器通信的 Websocket 客户端。我在网上没有找到任何好的例子。

我只在网上找到了这段代码：

var ws = new WebSocket('ws://host.com/path');

ws.onopen = () => {
  // connection opened
  ws.send('something'); // send a message
};

ws.onmessage = (e) => {
  // a message was received
  console.log(e.data);
};

ws.onerror = (e) => {
  // an error occurred
  console.log(e.message);
};

ws.onclose = (e) => {
  // connection closed
  console.log(e.code, e.reason);
};

我不知道如何将此代码集成到我的应用程序代码中才能运行。 我需要为它安装一些软件包吗？ 我正在为我的学习做一个项目，最后我应该有一个测验应用程序，它连接到服务器以获取游戏的问题和答案。

感谢您的帮助！

Answer 1

在 react-native（或任何相对较新的 JS 环境 for that matter）中使用 WebSocket 不需要任何其他东西。您找到的示例几乎涵盖了入门所需的所有内容。下一步是将其绑定到您的 React 逻辑。例如，您可以创建一个看起来像这样（省略细节）的WebSocketController 组件

class WebSocketController extends React.Component {
  componentDidMount(){
    this.ws = new WebSocket('ws://host.com/path');
    this.ws.onmessage = this.handleMessage.bind(this);
    this.ws.onerror = //...
  }
  handleMessage(e){
    // dispatch event (á la redux, flux), or do something else
  }
  componentWillUnmount(){
    // close WS
  }
}

在你的 React 层次结构中渲染它，它将沿着你的其余组件启动。如果您需要更具体的内容，请告诉我们。