Qt/C++ - Урок 036. QWebView – Як зробити простий браузер на Qt

браузер, QWebView, webkit, Qt, ssl

Увага: Урок є застарілим. З версії Qt5.6 потрібно використовувати WebEngine

Ну, хто з нас не хоче написати свій браузер? Та гаразд, не відпирайтеся думки про браузер, як були. Так ось, Qt має клас QWebView, який дозволяє працювати з браузерним двигуном webkit, на якому написаний chromium, а відповідно і chrome та багато інших браузери. Тому, практично використавши десяток рядків коду, можна зробити програму, яка зможе відобразити сторінку веб-сайту.

Отже, програма буде наступною. Є адресний рядок QLineEdit та віджет QWebView. При вводі адреси сайту в адресний рядок та натисканні клавіші Enter запускатиметься отримання сторінки сайту і відображення її в QWebView. При натисканні на посилання на сторінці адреса посилання відображатиметься в адресному рядку і завантажуватиметься нова сторінка у віджеті.

Структура проекту для роботи з QWebView

• QWebViewExample.pro - профайл проекту;
• main.cpp - основний файл вихідних кодів проекту;
• mainwindow.h - заголовний файл головного вікна програми;
• mainwindow.cpp - файл вихідних кодів головного вікна програми;
• mainwindow.ui - форма головного вікна програми.

QWebViewExample.pro

Для роботи з QWebView необхідно підключити два модулі: webkit та webkitwidgets.

#-------------------------------------------------
#
# Project created by QtCreator 2015-12-18T20:10:57
#
#-------------------------------------------------

QT       += core gui webkit webkitwidgets

greaterThan(QT_MAJOR_VERSION, 4): QT += widgets

TARGET = QWebViewExample
TEMPLATE = app


SOURCES += main.cpp\
        mainwindow.cpp

HEADERS  += mainwindow.h

FORMS    += mainwindow.ui

mainwindow.h

У заголовному файлі необхідно оголосити два слоти:

slotEnter() - для обробки натискання клавіші Enter в адресному рядку браузера;
slotLinkClicked(QUrl url) - для обробки кліка за посиланням на сторінці браузера.

Також необхідно підключити бібліотеки QWebView та QUrl.

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>
#include <QtWebKitWidgets/QWebView>
#include <QUrl>
#include <QDebug>

namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    explicit MainWindow(QWidget *parent = 0);
    ~MainWindow();

private:
    Ui::MainWindow *ui;

private slots:
    void slotEnter();       // Слот для обработки нажатия клавиши Enter
    void slotLinkClicked(QUrl url); // Слот для клика по ссылке на странице
};

#endif // MAINWINDOW_H

mainwindow.cpp

Для правильної обробки кліка за посиланням необхідно встановити ручну обробку даної події методом setLinkDelegationPolicy та підключити відповідний слот до сигналу linkClicked().

#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);

    // Устанавливаем ручную обработку клика по ссылке
    ui->webView->page()->setLinkDelegationPolicy(QWebPage::DelegateAllLinks);

    // Подключаем сигнал нажатия "Enter" в поле lineEdit
    connect(ui->lineEdit, &QLineEdit::returnPressed, this, &MainWindow::slotEnter);
    // Подключиаем сигнала клика по ссылке к обработчику
    connect(ui->webView, &QWebView::linkClicked, this, &MainWindow::slotLinkClicked);
}

MainWindow::~MainWindow()
{
    delete ui;
}

void MainWindow::slotEnter()
{
    // Загружаем страницу по заданном URL в поле lineEdit
    ui->webView->load(QUrl(ui->lineEdit->text()));
}

void MainWindow::slotLinkClicked(QUrl url)
{
    // При клике по ссылке помещаем адрес в поле lineEdit
    ui->lineEdit->setText(url.toString());
    ui->webView->load(url);     // Загружаем страницу по этой ссылке
}

Виправлення помилок з SSL

Швидше за все, у Вас виникнуть помилки наступного виду при складанні проекту:

qt.network.ssl: QSslSocket: cannot call unresolved function SSLv23_client_method
qt.network.ssl: QSslSocket: cannot call unresolved function SSL_CTX_new
qt.network.ssl: QSslSocket: cannot call unresolved function SSL_library_init
qt.network.ssl: QSslSocket: cannot call unresolved function ERR_get_error

Вирішення цієї проблеми полягає в тому, щоб підкинути потрібні бібліотеки в папку, де розташовуються бібліотеки Qt5Network.dll та Qt5Networkd.dll. Цими бібліотеками є libeay32.dll та ssleay32.dll.

Для цього:

1. Ідемо на наступний сайт
2. Шукаємо там light складання OpenSSL
3. І качаємо потрібну версію 32 або 64 біти (у випадку з mingw качаємо 32-х розрядне складання).
4. Далі встановлюємо OpenSSL у похідну папку відзначивши пункт "The OpenSSL binaries (\bin) directory"
5. Після чого шукаємо бібліотеки libeay32.dll та ssleay32.dll та перекидаємо їх у папку з Qt до бібліотек Qt5Network.dll та Qt5Networkd.dll.

Після цього вищезазначені помилки зникнуть.

Підсумок

В результаті виконаної роботи Ви зможете відкрити сторінку сайту у своєму власному додатку, як показано на наступному рисунку. Також демонстрацію роботи програми з уроку Ви можете побачити у Відеоуроці.

Посилання на завантаження проекту в zip-архіві: qwebviewexample.zip

Відеоурок