Qt WebEngine模块使用（开发环境安装和程序开发）

news2025/1/16 17:01:58

一、Qt WebEngine

Qt WebEngine_hitzsf的博客-CSDN博客

Qt WebEngine模块提供了一个Web浏览器引擎，可以轻松地将万维网上的内容嵌入到没有本机Web引擎的平台上的Qt应用程序中。Qt WebEngine提供了用于渲染HTML，XHTML和SVG文档的C ++类和QML类型，它们使用级联样式表（CSS）进行样式设置并使用JavaScript编写脚本。 用户可以通过使用HTML元素上的contenteditable属性，使HTML文档完全可编辑。

1、Qt WebEngine架构

Qt WebEngine中的功能分为以下模块：

  1. Qt WebEngine Widgets，用于创建基于Widget的Web应用程序
  2. Qt WebEngine，用于创建基于Qt Quick的Web应用程序
  3. Qt WebEngine Core，用于与Chromium交互
  4. Qt WebEngine Process模块，页面渲染和JavaScript执行从GUI流程分离到Qt WebEngine Process中。 如果将Qt库捆绑到应用程序中，则该库必须随应用程序一起提供。

2、瑞芯微带Qt WebEngine的SDK编译

详见如下链接

有道云笔记

3、Qt WebEngine 类介绍

Qt QWebEngine 加载网页及交互，实现C++与JS 相互调用_qt5 加载网页-CSDN博客

Qt WebEngine（04）：QWebEngineView 类【官翻】-CSDN博客

4、官方demo程序

下面这两个是比较好的学习示例，simplebrowser是使用的QT Widget，quicknanobrowser是使用的 QT Quick

D:\QT5.12.10\install\Examples\Qt-5.12.10\webenginewidgets\simplebrowser

D:\QT5.12.10\install\Examples\Qt-5.12.10\webengine\quicknanobrowser

二、开发环境安装

QtWebengine模块作为Qt的子模块同样支持跨平台，可以安装在Windows、Linux、MacOS系统上，我这里安装在了windows和Ubuntu下。为了在RK3568平台上运行QT Web程序，所以还需要安装ARM64的交叉编译环境（只支持在Ubuntu下编译）

1、Windows桌面版本

在Windows上，Qt5.12.10版本中的Qt WebEngine仅在MSVC 2017或MSVC2019下可用，所以在按照QT之前，需要先安装VS2017。

注：我这里想选用的5.12.10版本，可以下载安装其他版本的也可以，比如5.12.2，在ubuntu下就是安装的这个版本

1、VS2017环境安装

Visual Studio 2017下载及安装_vs2017下载_枫蓝驿的博客-CSDN博客

2、QT Creator安装

QT下载链接：Index of /archive/qt/5.12/5.12.10

选择安装组件，需要勾选上MSVC2017 和 Qt WebEngine

2、Ubuntu桌面版本

2.1、安装前需要先安装下面的库

sudo apt-get install libxcb-xinerama0

sudo apt-get install libxcb-cursor0

2.2、下载安装

1、下载

Index of /archive/online_installers/4.6

2、安装

在线安装 Qt，加入参数--mirror qt安装包下载_开源镜像站-阿里云 这样指定镜像源。备用镜像源地址，若镜像源不可用时我们还有备用的镜像源地址

https://mirror.nju.edu.cn/qt // 南京大学源
http://mirrors.ustc.edu.cn/qtproject // 中科大源
https://mirrors.cnnic.cn/qt // 开源软件源
https://download.qt.io // Qt 官方源

使用 sudo 权限来安装，默认会安装在/opt/Qt 这个路径

chmod +x qt-unified-linux-x64-4.6.0-online.run
sudo ./qt-unified-linux-x64-4.6.0-online.run --mirror https://mirrors.aliyun.com/qt

3、组件选择

这里为与瑞芯微SDK保持一致，所以选择的是Qt5.15.2，Android跟sources不需要可以不选择，不然会占用很多磁盘空间

2.3、遇到的问题

Linux下使用Qt的一些问题及解决方法_:-1: error: /opt/qt/5.15.2/gcc_64/lib/libqt5webeng-CSDN博客

1、在Ubuntu下编译qt程序时, 报如下错误

libQt5WebEngineCore.so: .dynsym local symbol at index 3 (>= sh_info of 3)
libQt5WebEngineCore.so: .dynsym local symbol at index 4 (>= sh_info of 3)
libQt5WebEngineCore.so: .dynsym local symbol at index 5 (>= sh_info of 3)
libQt5WebEngineCore.so: .dynsym local symbol at index 6 (>= sh_info of 3)

解决办法如下:

Ubuntu下编译qt程序libQtWebEngineCore报错_libqt5webenginecore.so: .dynsym local symbol at in-CSDN博客

[QTBUG-80964] Warnings when linking against WebEngine on Ubuntu 19.10 - Qt Bug Tracker

sudo apt-get install lld
sudo ln -sf /usr/bin/x86_64-linux-gnu-ld.gold /usr/bin/ld

2、qt编译时报错GL/gl.h: No such file or directory

解决办法：

ubuntu16.04下qt5.14报错：/home/zhangfakai/Qt5.14.1/5.14.1/gcc_64/include/QtGui/qopengl.h:141: error: GL/ - 码农教程 (manongjc.com)

【Qt】错误GL/gl.h: No such file or directory的解决方法（以及cannot find -lGL解决方法）-CSDN博客

sudo apt-get install mesa-common-dev
sudo apt-get install libgl1-mesa-dev libglu1-mesa-dev
sudo ln -s /usr/lib/x86_64-linux-gnu/mesa/libGL.so.1.2.0 /usr/lib/libGL.so

3、交叉编译环境

我这里使用的是正点原子通过SDK编译出来的交叉编译工具链 atk-dlrk3568-toolchain-arm-buildroot-linux-gnueabihf-x86_64.run

1、交叉编译器安装

将该工具拷贝到ubuntu下后，执行进行安装，默认安装在的 /opt/atk-dlrk356x-toolchain/ 路径下

chmod 777 atk-dlrk3568-toolchain-arm-buildroot-linux-gnueabihf-x86_64.run
./atk-dlrk3568-toolchain-arm-buildroot-linux-gnueabihf-x86_64.run

2、导出环境变量

在 /etc/profile 文件最后添加如下命令，默认导出编译器环境

Add the path of arm-linux compiler to ENV
if [ -d  /opt/atk-dlrk356x-toolchain/bin ]; then
export PATH=$PATH:/opt/atk-dlrk356x-toolchain/bin
fi

3、配置构建套件（kit）

三、无头浏览器

无头浏览器（Headless Browser）是一种没有图形用户界面（GUI）的浏览器。它通过在内存中渲染页面，然后将结果发送回请求它的用户或程序来实现对网页的访问，而不会在屏幕上显示网页。这种方式使得无头浏览器不仅适用于网络爬虫和测试等自动化任务，而且还能够更安全地进行网页浏览，因为它不会在屏幕上显示您的活动。

常见的无头浏览器包括Chrome Headless、PhantomJS、Puppeteer等，常见的这些无头浏览器都属于互联网前后端开发相关的东西，与Qt技术栈相关的比较少

1、基于QWebEnginePage实现无头浏览器

QWebEngine有两种实现方式，一个QWidget框架下的QWebEngineView，另一种是QML框架下的WebEngineView，其中QWebEngineView包含QWebEnginePage的功能，QWebEnginePage提供页面加载相关的功能，QWebEngineView用于page的显示，基于QWebEnginePage就可实现无头浏览器。

auto page = new QWebEnginePage(this);
page->setUrl(QUrl("https://www.qt.io/"));
connect(page, &QWebEnginePage::loadFinished, this, [=](bool ok){
    qDebug() << __FUNCTION__ << "song" << "load is ok" << ok;
});

使用QWebEnginePage加载页面，页面加载成功后就可以做一些操作，如网络截图、爬虫、数据采集等。

QWebEnginePage支持QWebEngine内嵌浏览器相关的功能，具体可查看相关接口

1、获取网页相关信息

2、注入javascript

3、打印pdf

QML的WebEngineView没有像QWebEngineView把page的功能分开，所以WebEngineView不能实现无头浏览器的效果。

最后，需要注意的是，如果是在控制台程序中运行QWebEnginePage，main函数的应用程序类型必须是QApplication，使用QCoreApplication无法启动QWebEnginePage。

2、示例程序

mywebengineview.c

#include "mywebengineview.h"
#include <QDebug>

MyWebEngineView::MyWebEngineView(QWidget *parent) : QWebEngineView(parent)
{
    connect(this->page(),&QWebEnginePage::linkHovered,this,&MyWebEngineView::linkHovered);
    connect(&lessHeadPage,&QWebEnginePage::loadFinished,this,&MyWebEngineView::lessheadPagePrintfToPdf);
}

//这个函数应该是由底层的QWebEnginePage发起调用的，如果不想新建QWebEngineView，在这儿覆写。
QWebEngineView *MyWebEngineView::createWindow(QWebEnginePage::WebWindowType type)
{
    Q_UNUSED(type)

    //识别要无头浏览输出pdf
    if (newUrl.toString() == "https://www.baidu.com/s?wd=小米汽车&sa=fyb_n_homepage&rsv_dl=fyb_n_homepage&from=super&cl=3&tn=baidutop10&fr=top1000&rsv_idx=2&hisfilter=1" ||
        newUrl.toString() == "https://www.baidu.com/s?wd=国风浩荡+文脉赓续&sa=fyb_n_homepage&rsv_dl=fyb_n_homepage&from=super&cl=3&tn=baidutop10&fr=top1000&rsv_idx=2&hisfilter=1")
    {
        lessHeadPage.load(newUrl);
    }
    else
    {
        this->load(newUrl);
    }

    qDebug() << "createWindow url is :" <<this->url();

    return 0;
}

void MyWebEngineView::linkHovered(QString url)
{
    qDebug() << "linkHovered url is :" <<url;

    newUrl = QUrl(url);
}

//实现无头浏览输出pdf
void MyWebEngineView::lessheadPagePrintfToPdf(bool ok)
{
    Q_UNUSED(ok)
    lessHeadPage.printToPdf(QString("test.pdf"));
}

mywebengineview.h

#ifndef MYWEBENGINEVIEW_H
#define MYWEBENGINEVIEW_H
#include <QtWebEngineWidgets>

class MyWebEngineView : public QWebEngineView
{
    Q_OBJECT
public:
    explicit MyWebEngineView(QWidget *parent = nullptr);

    QWebEngineView * createWindow(QWebEnginePage::WebWindowType type) override;
    void linkHovered(QString url);
    void lessheadPagePrintfToPdf(bool ok);

private:
    QUrl newUrl;
    QWebEnginePage lessHeadPage;
};

#endif // MYWEBENGINEVIEW_H

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/1416689.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

服务端开发小记02——Maven

服务端开发小记02——Maven

这里写目录标题 Maven简介Maven在Linux下的安装Maven常用命令 Maven简介 Apache Maven Project是一个apache的开源项目&#xff0c;是用于构建和管理Java项目的工具包。 用Maven可以方便地创建项目&#xff0c;基于archetype可以创建多种类型的java项目&#xff1b;Maven仓库…
阅读更多...
带libc源码gdb动态调试（导入glibc库使得可执行文件动态调试时可看见调用库函数源码）

带libc源码gdb动态调试（导入glibc库使得可执行文件动态调试时可看见调用库函数源码）

文章目录 查看源码是否编译时有-g调试信息和符号表在 gdb 中加载 debug 文件/符号表将 debug 文件放入 ".debug" 文件夹通过 gdb 命令 set debug-file-directory directories GCC的gcc和g区别指定gcc/g&#xff0c;glibc的版本进行编译指定gcc/g的版本指定glibc的和l…
阅读更多...
最新计算机软件毕业设计选题大全

最新计算机软件毕业设计选题大全

最新计算机软件毕业设计选题大全 1、毕业设计选题 博主介绍&#xff1a;✌️大厂码农|毕设布道师&#xff0c;阿里云开发社区乘风者计划专家博主&#xff0c;CSDN平台Java领域优质创作者&#xff0c;专注于大学生项目实战开发、讲解和毕业答疑辅导。✌️ 主要项目&#xff1a;小…
阅读更多...
ppt背景图片怎么设置？让你的演示更加出彩！

ppt背景图片怎么设置？让你的演示更加出彩！

PowerPoint是一款广泛应用于演示文稿制作的软件&#xff0c;而背景图片是演示文稿中不可或缺的一部分。一个好的背景图片能够提升演示文稿的整体效果&#xff0c;使观众更加关注你的演示内容。可是ppt背景图片怎么设置呢&#xff1f;本文将介绍ppt背景图片设置的三个方法&#…
阅读更多...
JavaScript DOM属性和方法之event事件对象

JavaScript DOM属性和方法之event事件对象

event对象代表事件的状态&#xff0c;比如事件在其中发生的元素&#xff0c;键盘按键的状态、鼠标的位置、鼠标按钮的状态&#xff0c;事件通常与函数结合使用&#xff0c;函数不会在事件发生前被执行&#xff0c;只有当事件被触发的时候才会执行函数。 一、句柄事件 1、oncl…
阅读更多...
免费且安全的SSL证书：JoySSL为您的网站安全保驾护航

免费且安全的SSL证书：JoySSL为您的网站安全保驾护航

在当今这个数字化飞速发展的时代&#xff0c;网络安全问题日益凸显&#xff0c;特别是对于网站所有者而言&#xff0c;如何保障用户数据的安全传输显得尤为重要。SSL&#xff08;安全套接层&#xff09;证书作为一种有效的加密工具&#xff0c;被广泛应用于各类网站中。那么&am…
阅读更多...
【计算机网络】深入掌握计算机网络的核心要点

【计算机网络】深入掌握计算机网络的核心要点

写在前面 前言四层模型网络地址管理Linux下设置ipARP请求包总结 前言 计算机网络是指将分散的计算机设备通过通信线路连接起来&#xff0c;形成一个统一的网络。为了使得各个计算机之间能够相互通信&#xff0c;需要遵循一定的协议和规范。OSI参考模型和TCP/IP参考模型是计算机…
阅读更多...
专业133总分400+上海交通大学819考研经验分享上交819电子信息与通信工程

专业133总分400+上海交通大学819考研经验分享上交819电子信息与通信工程

今年专业819信号系统与信号处理133&#xff0c;总分400&#xff0c;如愿考上梦中上海交通大学&#xff0c;通过自己将近一年的复习&#xff0c;实现了人生中目前为止最大的逆袭&#xff08;自己本科学校很普通&#xff09;&#xff0c;总结自己的复习经历&#xff0c;希望可以给…
阅读更多...
解决 Git：ssh: connect to host github.com port 22: Connection timed out 问题的三种方案

解决 Git：ssh: connect to host github.com port 22: Connection timed out 问题的三种方案

1、问题描述&#xff1a; 其一、整体提示为&#xff1a; ssh: connect to host github.com port 22: Connection timed out fatal: Could not read from remote repository. 中文为&#xff1a; ssh&#xff1a;连接到主机 github.com 端口 22&#xff1a;连接超时 fatal&a…
阅读更多...
【C++】对外接口封装以及导出动态链接库DLL

【C++】对外接口封装以及导出动态链接库DLL

VS 使用C编写对外接口并封装成DLL 一、接口的封装二、VS设置三、查看生成的DLL接口 一、接口的封装 首先创建头文件&#xff0c;包含我们所依赖的库的头文件名称&#xff0c;并且申明我们要对外封装的接口名称&#xff0c;示例&#xff1a; 头文件&#xff1a; #pragma once …
阅读更多...
VMware 虚拟机环境下的ubuntu 上安装mysql,并能远程访问数据库

VMware 虚拟机环境下的ubuntu 上安装mysql,并能远程访问数据库

需求&#xff1a;为了实现在linux上模拟服务器跑代码&#xff0c;并存储在mysql上&#xff0c;通过远程可视化mysql数据库软件查看linux上mysql数据库数据的实时动态。 1. 虚拟机和ubuntu的安装 这里我选择的是VMware workstation-v14, ubuntu-18.04.1。至于体流程网上很多&a…
阅读更多...
常量和C预处理器

常量和C预处理器

本文参考C Primer Plus第四章 文章目录 符号常量printf()函数和scanf()函数 printf()函数使用printf()printf()的转换说明修饰符 1.符号常量 C头文件limits.h和float.h分别提供了与整数类型和浮点类型大小限制相关的详细信息。头文件都定义了一系列供实现使用的符号常量。例如&…
阅读更多...
可解释性人工智能（XAI）概述

可解释性人工智能（XAI）概述

文章目录 每日一句正能量前言可解释性人工智能&#xff08;XAI&#xff09;定义研究的作用应用领域XAI的目标后记 每日一句正能量 一个人若想拥有聪明才智&#xff0c;便需要不断地学习积累。 前言 人工智能&#xff08;AI&#xff09;的发展速度迅猛&#xff0c;并在许多领域…
阅读更多...
C++：类 的简单介绍（一）

C++：类 的简单介绍（一）

目录 类的引用&#xff1a; 类的定义&#xff1a; 类的两种定义方式&#xff1a; 成员变量命名规则的建议&#xff1a; 类的访问限定符及封装&#xff1a; 访问限定符 【访问限定符说明】 封装 class与struct的区别&#xff1a; 类的作用域&#xff1a; 类的实例化…
阅读更多...
Scikit-learn (sklearn)速通 -【莫凡Python学习笔记】

Scikit-learn (sklearn)速通 -【莫凡Python学习笔记】

视频教程链接&#xff1a;【莫烦Python】Scikit-learn (sklearn) 优雅地学会机器学习 视频教程代码 scikit-learn官网 莫烦官网学习链接 本人matplotlib、numpy、pandas笔记 1 为什么学习 Scikit learn 也简称 sklearn, 是机器学习领域当中最知名的 python 模块之一. Sk…
阅读更多...
解决Android Studio gradle下载超时和缓慢问题(win10)

解决Android Studio gradle下载超时和缓慢问题(win10)

解决超时问题 一般配置阿里云代理就可以解决。 具体配置方法&#xff0c;参考&#xff1a;https://blog.csdn.net/zhangjin1120/article/details/121739782 解决下载缓慢问题 直接去腾讯云镜像下载&#xff1a; https://mirrors.cloud.tencent.com/gradle/ 下载好了之后&…
阅读更多...
docker 部署及命令

docker 部署及命令

一、容器概述 1、为什么要用到容器&#xff1f; ①容器可以屏蔽底层操作系统的差异性&#xff0c;让业务应用不管在哪里都是使用容器的环境运行&#xff0c;从而保证开发测试环境与生产环境的一致性 ②容器部署起来非常便捷和迅速&#xff0c;缩短开发测试部署的周期时间 2…
阅读更多...
MySQL8 窗口函数 →_→ 专治GROUP BY后组内元素

MySQL8 窗口函数 →_→ 专治GROUP BY后组内元素

前言 假设你有一张表&#xff0c;里面记录了各个城市的销售数据&#xff0c;包括城市、销售日期和销售额。你可能会使用GROUP BY来按城市对数据进行分组&#xff0c;这样就可以知道每个城市的总销售额了。但是&#xff0c;有时候你可能还会希望对每个城市的销售数据进行更细致…
阅读更多...
不可错过的欧几里得几何：探索数学世界的奇迹应用

不可错过的欧几里得几何：探索数学世界的奇迹应用

不可错过的欧几里得几何&#xff1a;探索数学世界的奇迹应用 一、引言二、欧几里得几何的起源与发展三、欧几里得几何的基本概念3.1、点、直线、平面的定义3.2、全等3.3、平行与垂直3.4、角度、三角形、四边形等基本图形的性质 四、欧几里得几何的公理五、欧几里得几何的应用总…
阅读更多...
国考省考行测：分析推理，形式逻辑，集合推理，真假推理

国考省考行测：分析推理，形式逻辑，集合推理，真假推理

国考省考行测&#xff1a;分析推理&#xff0c;形式逻辑 2022找工作是学历、能力和运气的超强结合体! 公务员特招重点就是专业技能&#xff0c;附带行测和申论&#xff0c;而常规国考省考最重要的还是申论和行测&#xff0c;所以大家认真准备吧&#xff0c;我讲一起屡屡申论和…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023