module "QtNetwork" is not installed

Question

Here is the complete content of my .pro file (I have specified to add the network module):

QT += quick virtualkeyboard network

# You can make your code fail to compile if it uses deprecated APIs.
# In order to do so, uncomment the following line.
#DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000    # disables all the APIs deprecated before Qt 6.0.0

CONFIG += c++14

SOURCES += \
        main.cpp

RESOURCES += qml.qrc \
    resources/icon.qrc

# Additional import path used to resolve QML modules in Qt Creator's code model
QML_IMPORT_PATH =

# Additional import path used to resolve QML modules just for Qt Quick Designer
QML_DESIGNER_IMPORT_PATH =

# Default rules for deployment.
qnx: target.path = /tmp/$${TARGET}/bin
else: unix:!android: target.path = /opt/$${TARGET}/bin
!isEmpty(target.path): INSTALLS += target

However, when I use the QNetwork module in my QML file like this:

import QtNetwork 2.15

I am pointed out with the issue:

QML module not found (QNetwork)
Import paths:E:/Qt/5.15.2/msvc2019/qml
For qmake projects, use the QML_IMPORT_PATH variable to add import paths.
For Qbs projects, declare and set a qmllmportPaths property in your product to add import paths.
For qmlproject projects, use the importPaths property to add import paths.
For CMake projects, make sure QML_IMPORT_PATH variable is in CMakeCache.txt.
For qmlRegister.. calls, make sure that you define the Module URl as a string literal.

I checked folder 'E:\Qt\5.15.2\msvc2019', and indeed, I did not find any files related to the QNetwork module.

enter image description here

What is going on? How should I use this module?

I have tried various solutions found online, but many of them are aimed at Visual Studio IDE. In reality, I am using Windows 10 22H2 with QT 5.15, MSVC2019 32bit compiler, and my Integrated Development Environment (IDE) is QT Creator.

2024.3.29 Update

After encountering the issue, I have updated QT to the latest version and checked the installation status of the related components. Below is the installation status of QT:

enter image description here

Answer 1

First, let's tackle one issue at a time. For the "module 'QtNetwork' is not installed" issue, I found that it indeed does not exist in QML (at least not for my QT environment). If you want to use the network module, you should use the XMLHttpRequest QML Type. According to the official documentation, you should add the following code:

import QtQml

After that, you can use the network module like this(The following example demonstrates how to send a request and read the response):

import QtQuick
import QtQuick.Layouts
import QtQuick.Controls
import "request.js" as XHR

ApplicationWindow {
      width: 640
      height: 640
      visible: true

      ColumnLayout {
           anchors.fill: parent

           RowLayout {
               Layout.fillWidth: true

               TextField {
                   id: urlTextField
                   text: "https://www.example.com/index.html"
                   Layout.fillWidth: true
               }
               Button {
                   text: qsTr("Send!")
                   onClicked: XHR.sendRequest(urlTextField.text, function(response) {
                       statusTextField.text = response.status;
                       let isPlainText = response.contentType.length === 0

                       contentTypeTextField.text = isPlainText ? "text" : response.contentType;

                       if (isPlainText)
                           contentTextArea.text = response.content;
                   });
               }
           }

           GridLayout {
               columns: 2

               Layout.fillWidth: true

               Label {
                   text: qsTr("Status code")

                   Layout.fillWidth: true
               }
               Label {
                   text: qsTr("Response type")

                   Layout.fillWidth: true
               }
               TextField {
                    id: statusTextField

                    Layout.fillWidth: true
               }
               TextField {
                    id: contentTypeTextField

                    Layout.fillWidth: true
               }
           }
           Flickable {
               clip: true
               contentWidth: contentTextArea.width
               contentHeight: contentTextArea.height
               Text {
                    id: contentTextArea
               }

               Layout.fillWidth: true
               Layout.fillHeight: true
               ScrollBar.vertical: ScrollBar {}
               ScrollBar.horizontal: ScrollBar {}
           }
      }
}

The earlier snippet connects the button's clicked signal to an external sendRequest function. A resource URL is passed as the first argument, and a callback function to handle UI updates is passed as the second. The sendRequest function, which exists in an external request.js file, can be implemented like this:

function sendRequest(url, callback)
{
    let request = new XMLHttpRequest();

    request.onreadystatechange = function() {
        if (request.readyState === XMLHttpRequest.DONE) {
            let response = {
                status : request.status,
                headers : request.getAllResponseHeaders(),
                contentType : request.responseType,
                content : request.response
            };

            callback(response);
        }
    }

    request.open("GET", url);
    request.send();
}

The second issue is even simpler; you just need to change the https:// in the link to http://. For more information, you should look here.