QT百度地图应用项目实现

使用 Qt 和 QWebEngine 在 C++ 和 HTML 之间传递信息的项目实现

在现代应用程序中，将 C++ 和 JavaScript 集成以实现复杂的功能是一个常见的需求。本文将介绍如何使用 Qt 和 QWebEngine 结合 QWebChannel，在 C++ 端和 HTML 页面之间传递信息，实现在网页上显示和传递导航信息并保存到本地文件。

1、项目简介

本项目的目标是构建一个基于 Qt 的应用程序，该程序可以加载百度地图的 HTML 页面，接收 JavaScript 的信息传递到 Qt 主程序，并将导航信息写入本地文件（写入本地文件主要是为了跨进程信息交换）。

  1.1 核心功能

1. 在 Qt 中嵌入 QWebEngineView 显示 HTML 页面。
2. 使用 QWebChannel 实现 C++ 与 HTML 之间的双向通信。
3. 从 JavaScript 端接收导航信息，并在 C++ 中进行处理和保存。

2、项目结构

• Widget 类：主窗口类，负责初始化 QWebEngineView 和加载 HTML 页面。
• WebInfoTransf 类：用于在 C++ 和 HTML 之间传递信息的单例类。
• HTML 页面：加载百度地图 API 并使用 JavaScript 将数据发送到 Qt 程序。

1. WebInfoTransf 类

该类用于接收和传递来自 HTML 的信息。

1.1 WebInfoTransf.h

#ifndef WEBINFOTRANSF_H
#define WEBINFOTRANSF_H

#include <QObject>
#include <QWebChannel>
class WebInfoTransf : public QObject//web信息传递类
{
    Q_OBJECT
public:
    static WebInfoTransf &getInstance();//单列对象
public slots:
    //在HTML端的JavaScript中调用，在qt端显示
    void receiveText(const QString &text);
signals:
    void textReceived(const QString &text);
private:
    explicit WebInfoTransf(QObject *parent = nullptr);
};

#endif // WEBINFOTRANSF_H

1.2 WebInfoTransf.cpp

#include "webinfotransf.h"

WebInfoTransf::WebInfoTransf(QObject *parent)
    : QObject{parent}
{

}

WebInfoTransf &WebInfoTransf::getInstance()
{
    static WebInfoTransf instance;
    return instance;
}

void WebInfoTransf::receiveText(const QString &text)
{
    emit textReceived(text);//发送给主界面
}

2. Widget 类实现

1.1 Widget.h

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QWebEngineView>
#include <QWebEngineSettings>
#include <QWebChannel>
#include <QWebEnginePage>
#include "webinfotransf.h"

class CustomWebEnginePage : public QWebEnginePage {// 自定义页面，该页面用于处理页面请求，本例中用于处理定位权限请求
    Q_OBJECT
public:
    using QWebEnginePage::QWebEnginePage;

protected:
    void featurePermissionRequested(const QUrl &securityOrigin, Feature feature);
};

//Widegt主类
QT_BEGIN_NAMESPACE
namespace Ui {
class Widget;
}
QT_END_NAMESPACE

class Widget : public QWidget
{
    Q_OBJECT

public:
    Widget(QWidget *parent = nullptr);
    ~Widget();

private slots:
    void on_btn_Search_clicked();// 槽函数，用于处理搜索按钮点击事件
private:
    Ui::Widget *ui;
    QWebEngineView *webEngineView;// QWebEngineView对象
    CustomWebEnginePage *customPage;// 自定义页面
    QWebChannel *m_webChannel;// QWebChannel对象
};

#end