Qt WebChannel ChatClient QML Application

QML 客户端通信通过 WebSocket 采用 QWebChannel 服务器。

ChatClient QML 提供简单 QWebChannel 客户端,实现使用 JavaScript 和 QML。

Implementing a Web Channel Client in QML

This example shows how you can use the basic elements with the client JavaScript implementation of QWebChannel ,像连接到信号 ( newMessage ),调用槽 ( sendMessage ),及处理特性改变 ( userList ).

客户端初始化 WebSocket connection to the chat server at port 12345 on localhost. When the WebSocket opens, a WebChannel object is created, taking the WebSocket as first argument and a callback function as the second argument. When the callback is called, the client receives an object named chatserver , containing all the necessary signals, slots, and properties for implementing a chat client. The callback function connects userListChanged , newMessage ,和 keepAlive chatserver object with separate functions handling those signals, and then it calls show on loginWindow .

The Window with loginWindow as id handles the login procedure. It contains a LoginForm defined in LoginForm.ui.qml. When you press the button, it calls the login function on the chatserver object with the login name and and a callback function as arguments. This callback function handles both if the login succeeds or fails.

After login, the client uses a MainForm , defined in MainForm.ui.qml, with mainUi as id, to post messages using the sendMessage slot, read messages using the newMessage signal, and to view the names of all connected users using the userList property. Also, the client responds to the server's keepAlive signal in order for the server to detect disconnected clients and remove them from the userList 特性。

客户端能够工作于 Qt WebChannel ChatServer 范例 .

范例工程 @ code.qt.io

另请参阅 Qt WebChannel ChatServer 范例 and Qt WebChannel ChatClient HTML 范例 .