介绍

每个人都熟悉HTTP，无论他们是否知道。作为Web开发人员，我们知道它是一种用于从客户端向服务器发送和接收请求的互联网协议。典型的交换看起来像这样：

请注意，我们的协议URL现在是“ws”而不是“http”。这将告诉我们的服务器用户正在尝试建立WebSocket。

在中App.js，我们希望客户端向我们的ChatChannel发出订阅请求。感谢@rails/actioncable我们还可以描述当我们连接时我们想要发生什么，以及当我们接收数据时（如果我们的连接已建立）。

从我们的后端，我们可以通过查看我们的终端来查看请求是否成功。

当我们向后端发出发布请求时，我们的消息控制器将我们的消息广播到“聊天”流。

当它广播时，我们的客户被设置为setMessages使用接收到的信息。

您可以通过在隐身窗口中打开应用程序来查看实时更新。您会注意到，每当对方发送消息时，两者都会更新。

结论

WebSocket是允许用户进行交互式通信的好工具。一开始我很难真正掌握其中的一些示例，所以我希望这提供了一个非常基本的说明，说明如何使用ReactFrontend应用程序设置ActionCable。我没有涉及连接请求的管理或说明多流的使用，但我认为这展示了如何让聊天室运行的基础知识。让我知道是否有任何我遗漏的内容或任何您希望我介绍的内容！

举报/反馈

未经允许不得转载：头条资讯网_今日热点_娱乐才是你关心的时事新闻 » ActionCable 和 React 初学者