First attempt to use Qt networking on QML apps

[qcoderpro]

Hi all,
As my first attempt to successfully use Qt networking, I created two simple QML apps as follows, one as the server offering IP and port number and the other as client to firstly connect to the server using those IP and port number and then send messages to it. I tried to keep them as simple as possible merely to do the job.
The server part:
server.h:

class Server : public QObject
{
    Q_OBJECT
public:
    explicit Server(QObject *parent = nullptr);

public slots:
    QString initServer();
    void setMessage();
    QString getMessage() const;
    void onNewConnection();

private:
    QTcpServer* tcpServer { nullptr };
    QDataStream in;
    QString message;
};

server.cpp:

Server::Server(QObject *parent)
    : QObject{parent}
    , tcpServer(new QTcpServer(this))
{
    initServer();
    connect(tcpServer, &QTcpServer::newConnection, this, &Server::onNewConnection);
}

QString Server::initServer() {
//.. Provide the IP address and port number for the client
}

void Server::onNewConnection()
{
    QTcpSocket *clientConnection = tcpServer->nextPendingConnection();
    connect(clientConnection, &QAbstractSocket::disconnected,
            clientConnection, &QObject::deleteLater);
    in.setDevice(clientConnection);
    in.setVersion(QDataStream::Qt_4_0);
    connect(clientConnection, &QAbstractSocket::readyRead, this, &Server::setMessage);
}

void Server::setMessage()
{
    in.startTransaction();
    QString msg;
    in >> msg;

    if (!in.commitTransaction())
        message = "commitTransaction error" ;
    else
        message = msg;
}

QString Server::getMessage() const
{
    return message;
}

server's qml file:

 ColumnLayout {
        anchors.fill: parent

        Label {
            text: myObj.initServer()
        }

        Label {
            id: msgLabel
            text: myObj.getMessage()
        }
    }

    ServerClass{
        id: myObj
    }

The client part:

client.h:

class Client : public QObject
{
    Q_OBJECT

public:
    explicit Client(QObject *parent = nullptr);

public slots:
    void sendAddress(QString, QString);
    void sendMessage(const QString&);

private:
    QTcpSocket* tcpSocket { nullptr };
    QDataStream out;
};

client.cpp:

Client::Client(QObject *parent)
    : QObject{parent}
    , tcpSocket(new QTcpSocket(this))
{
    out.setDevice(tcpSocket);
    out.setVersion(QDataStream::Qt_4_0);
}

void Client::sendAddress(QString ip, QString port)
{
    tcpSocket->abort();
    tcpSocket->connectToHost(ip, port.toInt());
}

void Client::sendMessage(const QString& message)
{
    out.startTransaction();
    out << message;

    if (!out.commitTransaction())
        return ;
}

client's qml file:

 ColumnLayout {
        anchors.fill: parent

        TextField {
            id: ipAddrs
        }
        TextField {
                id: portNum
            }
        Button {
            text: "Send Address"
            onClicked: myObj.sendAddress(ipAddrs.text.toString(), portNum.text.toString())
        }

        RowLayout {
            Layout.alignment: Qt.AlignBottom

            TextField {
                id: txtField
                Layout.fillWidth: true
            }
            Button {
                text: qsTr("Send")
                onClicked: myObj.sendMessage(txtField.text)
            }
        }
    }

    ClientClass{
        id: myObj
    }
}

After running both projects on the same machine, and typing the IP address and port number (given by the server UI) on the client UI and writing a text message there I click on the Send button, but nothing is shown on the server UI.
I think there's a problem with the connection.
Could you please help out?
Thanks in advance.

[dheerendra]

@qcoderpro said in First attempt to use Qt networking on QML apps:

void Server::onNewConnection()

Just have some qDebug in this slot & see if connection request has arrived. This should help if the connection is established or not.

[qcoderpro]

@dheerendra

I already tested it, and no, not connection arrives! I don't know where the problem is! :(

[GrecKo]

Maybe you are using the wrong ip and/or port

[qcoderpro]

@GrecKo
The client's sendAddress slot sends the IP and port number as a string and int respectively, based on this version.

[GrecKo]

What I am saying is that the server can be providing an unreachable IP and port.

QString Server::initServer() {
//.. Provide the IP address and port number for the client
}

Doesn't tell us much.

[qcoderpro]

@GrecKo

The code for that is:

QString Server::initServer() {

    tcpServer = new QTcpServer(this);
    if(!tcpServer->listen())
        return "Server Unable to start the server: " +
                tcpServer->errorString();

    QString ipAddress;
    QList<QHostAddress> ipAddressesList = QNetworkInterface::allAddresses();

    // use the first non-local IPv4 address
    for(int i=0; i<ipAddressesList.size(); ++i)
        if(ipAddressesList.at(i) != QHostAddress::LocalHost &&
                ipAddressesList.at(i).toIPv4Address()) {
            ipAddress = ipAddressesList.at(i).toString();
            break;
        }

    // if we did not find one, use IPv4 localhost
    if(ipAddress.isEmpty())
        ipAddress = QHostAddress(QHostAddress::LocalHost).toString();

    return " The server is running on\n\n IP: " +
            ipAddress + "\n port: " + QString::number(tcpServer->serverPort())
            + "\n\n Run the Client example now.";
}

[GrecKo]

You are calling initServer() twice, once in c++ and once in QML, thus creating 2 QTcpServer. You are connecting yout onNewConnection only to the first one but displaying the ip and port of the second one in your UI.

Your initServer function does too much stuff. It shouldn't return the text like you are doing. Expose the ip and port of your server as properties and display them properly in your QML. Don't call initServer from QML.

[qcoderpro]

@GrecKo
Yes, you're right. I removed the call from the constructor (in C++) but still nothing different in result. As for setting IP and port as properties on the QML side, that's not hard but I don't think there's a problem with exposing them inside a string to be shown on the server's UI. But if you think setting them as properties will solve the issue with the connection, OK I do that.

[GrecKo]

@qcoderpro I don't think that will solve the problem, I just think that's the proper and sane way to do it.

Are you connecting the newConnection signal in the QTcpServer created in the initServer() called from QML?

[qcoderpro]

@GrecKo

Are you connecting the newConnection signal in the QTcpServer created in the initServer() called from QML?

What did you mean, please? I didn't get this completely.
The connection:
connect(tcpServer, &QTcpServer::newConnection, this, &Server::onNewConnection); is defined in the serve's constructor. And I guess that signal (newConnection) is emitted when there's a connection coming from the client app (for example in the sendAddress slot there). That is, I guess when that slot in the client is called, the tcpSocket connects to host successfully, and on the other side, the server is that way notified with a new connection signal to it in turn calls the onNewConnection slot. Is it wrong to you?

[GrecKo]

The connection: connect(tcpServer, &QTcpServer::newConnection, this, &Server::onNewConnection); is defined in the serve's constructor.

but

I removed the call [to initServer] from the constructor (in C++) but still nothing different in result

You are connecting to a null tcpServer, so it can't work.

[qcoderpro]

@GrecKo
This is server's qml file:

ColumnLayout {
        anchors.fill: parent

        Label {
            text: myObj.initServer()
        }

        Label {
            id: msgLabel
            text: myObj.getMessage()
        }
    }

    ServerClass{
        id: myObj
    }

If I comment out the label's text text: myObj.initServer(), nothing will be shown on its UI. But by uncommenting it, the IP address and port are shown on the UI. then I manually write them on the client's UI and click on Send address there.

It's the only time the initServer is called and I'm using its output on the client's text fields, so why a null tcpServer, please?
The send button calls the sendAddress slot:

void Client::sendAddress(QString ip, QString port)
{
    tcpSocket->abort();
    tcpSocket->connectToHost(ip, port.toInt());

    connect(tcpSocket, &QAbstractSocket::connected, []() {
        qDebug() << "Connected to the host";
    });
}

Here, too, qDebug in the lambda prints the message. So there's been a proper connection seemingly, otherwise I'm missing something that makes the projects not work properly! :|

[GrecKo]

As I said, you are not connecting to your QTcpServer newConnection signal.
The connection you are trying to do in the constructor is too soon because you don't have any QTcpServer yet.

[qcoderpro]

@GrecKo

As I said, you are not connecting to your QTcpServer newConnection signal.

Yes, that's right and I know it but don't know how to solve it! :|

The connection you are trying to do in the constructor is too soon because you don't have any QTcpServer yet.

Yea, that makes sense. So I cut that connection there and pasted it in the initServer(). Still theonNewConnectionis not called! :|

[qcoderpro]

No further help! :(

[jsulm]

@qcoderpro said in First attempt to use Qt networking on QML apps:

So I cut that connection there and pasted it in the initServer(). Still theonNewConnectionis not called!

Please show your current code

[qcoderpro]

@jsulm

This is code for server.cpp:

#include "server.h"
#include <QtNetwork>
#include <QtCore>

Server::Server(QObject *parent) : QObject{parent}
    , tcpServer(new QTcpServer(this)) { }

QString Server::initServer() {
    // Called from the front-end

    tcpServer = new QTcpServer(this);
    if(!tcpServer->listen())
        return "Server Unable to start the server: " +
                tcpServer->errorString();

    QString ipAddress;
    QList<QHostAddress> ipAddressesList = QNetworkInterface::allAddresses();

    // use the first non-local IPv4 address
    for(int i=0; i<ipAddressesList.size(); ++i)
        if(ipAddressesList.at(i) != QHostAddress::LocalHost &&
                ipAddressesList.at(i).toIPv4Address()) {
            ipAddress = ipAddressesList.at(i).toString();
            break;
        }

    // if we did not find one, use IPv4 localhost
    if(ipAddress.isEmpty())
        ipAddress = QHostAddress(QHostAddress::LocalHost).toString();

    return " The server is running on\n\n IP: " +
            ipAddress + "\n port: " + QString::number(tcpServer->serverPort())
            + "\n\n Run the Client example now.";
    connect(tcpServer, &QTcpServer::newConnection, this, &Server::onNewConnection);
}

void Server::onNewConnection()
{
    qDebug() << "OnNewConnection was called!\n";

    QTcpSocket *clientConnection = tcpServer->nextPendingConnection();
    connect(clientConnection, &QAbstractSocket::disconnected,
            clientConnection, &QObject::deleteLater);
    in.setDevice(clientConnection);
    in.setVersion(QDataStream::Qt_4_0);
    connect(clientConnection, &QAbstractSocket::readyRead, this, &Server::setMessage);
}

void Server::setMessage()
{
    in.startTransaction();

    QString msg;
    in >> msg;

    if (!in.commitTransaction())
        message = "commitTransaction error" ;
    else
        message = msg;
}

QString Server::getMessage() const
{
    return message;
}

Totally there're 6 files as follows:
server.h, server.cpp, server qml file, client.h, client.cpp and client qml file

If you like I can pack them all in a zip file and send it to a global resource for freely downloading and consideration.

[jsulm]

@qcoderpro said in First attempt to use Qt networking on QML apps:

ipAddress = ipAddressesList.at(i).toString();

What is ipAddress used for? You are not using it when you call listen().

But the actuall issue is that you have a return just before connect(), so connect() is never called...

[qcoderpro]

@jsulm

What is ipAddress used for? You are not using it when you call listen().

ipAddress is used to store the list of local/non-local IP addresses. But I didn't understand the part "You are not using it when you call listen()".

But the actuall issue is that you have a return just before connect(), so connect() is never called..

Right. I moved the connect() to the part right after the listen(). Now the onNewConnection() slot is successfully called and it prints the message "OnNewConnection was called" in Application Output window as expected.

Now there's still a problem remaining!
This is client.cpp:

#include "client.h"
#include <QtNetwork>

Client::Client(QObject *parent)
    : QObject{parent}
    , tcpSocket(new QTcpSocket(this))
{
    out.setDevice(tcpSocket);
    out.setVersion(QDataStream::Qt_4_0);
}

void Client::sendAddress(QString ip, QString port)
{
    tcpSocket->abort();
    tcpSocket->connectToHost(ip, port.toInt());

    connect(tcpSocket, &QAbstractSocket::connected, []() {
        qDebug() << "Connected to the host";
    });
}

void Client::sendMessage(const QString& message)
//called from front-end
{
    QByteArray block;
    QDataStream out(&block, QIODevice::WriteOnly);
    out.setVersion(QDataStream::Qt_5_10);
    out << message;
    tcpSocket->write(block);
}

The sendAddress slot prints the message of the lambda in output ("Connected to the host") so by that I assume the connection between the client and server the way above is properly established. The remaining problem is that the sendMessage slot still doesn't send its message (its string parameter) to the sever! :(