柴_笔记 2024-10-21 15:06 采纳率: 15.4%
浏览 3
已结题

QWebEngineView

QWebEngineView加载网页时：通过runJavaScript运行脚本将网页中的按钮ID回传到Qt；

要求：直接拿测试案例演示
好处：费用可谈

有实际经验的，留言，V联系，

  • 写回答

5条回答 默认 最新

  • 专家-皆知 2024-10-21 15:07
    关注

    参考免费微信小程序：皆我百晓生 作答，经由专家-皆知整理回复，如问题解决，望采纳；如仍有疑问，请评论回复。

    为了解决您的问题，我们将通过一个简单的Qt应用程序示例来展示如何使用QWebEngineView加载网页，并通过runJavaScript执行JavaScript代码来获取网页中按钮的ID，然后将这个ID传递回Qt。这里我们假设您想要获取的是网页中第一个按钮的ID。

    首先，确保您的Qt环境已经配置了Qt WebEngine模块。接下来，是一个简单的Qt5项目示例代码：

    1. 创建Qt Widgets Application，选择适当的项目名称，例如WebViewButtonID.

    2. mainwindow.cpp 文件的修改如下（假设您使用的是Qt Creator自动生成的项目结构）:

    #include "mainwindow.h"
#include "ui_mainwindow.h"
#include <QWebEngineView>
#include <QWebChannel>
#include <QJsonObject>

class WebBridge : public QObject {
    Q_OBJECT
public:
    explicit WebBridge(QObject *parent = nullptr) : QObject(parent) {}

public slots:
    void buttonIdReceived(const QString &id) {
        emit buttonIdGot(id);
    }

signals:
    void buttonIdGot(const QString &id);
};

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

    QWebEngineView *view = new QWebEngineView(this);
    ui->centralWidget->setWidget(view);

    QWebEnginePage *page = view->page();
    WebBridge *webBridge = new WebBridge(this);
    connect(webBridge, &WebBridge::buttonIdGot, this, &MainWindow::onButtonIdReceived);

    // 使用QWebChannel让JavaScript可以调用C++
    QWebChannel *channel = new QWebChannel(this);
    channel->registerObject(QStringLiteral("webBridge"), webBridge);
    page->setWebChannel(channel);

    // 加载测试HTML
    view->load(QUrl(QStringLiteral("qrc:///index.html")));

    // JavaScript代码，用于获取按钮ID并发送回Qt
    QString jsCode = R"(
        var buttonId = document.querySelector('button').id;
        console.log('Button ID:', buttonId);
        window.webBridge.buttonIdReceived(buttonId);
    )";

    // 确保页面加载完成后执行JavaScript代码
    page->loadFinished.connect([=](bool ok) {
        if (ok) {
            page->runJavaScript(jsCode);
        }
    });
}

void MainWindow::onButtonIdReceived(const QString &id) {
    QMessageBox::information(this, tr("Button ID"), tr("The Button ID is: ") + id);
}

MainWindow::~MainWindow() {
    delete ui;
}
    1. 创建一个简单的HTML文件 (index.html) 放在项目的资源文件夹中（通常是在resources或者直接放在构建目录并正确设置资源路径）。这个HTML文件将包含一个按钮以便我们能获取其ID。
    <!DOCTYPE html>
<html>
<head>
    <title>Button ID Test</title>
</head>
<body>
    <button id="myButton">Click me</button>
    <script>
        // 这里原本的逻辑会被QWebChannel的通信替代
    </script>
</body>
</html>
    1. 在Qt项目文件(.pro) 中添加HTML文件作为资源：
    QT += webenginewidgets
RESOURCES += resources.qrc

# 添加index.html到资源
resources.qrc:
    <file alias="index.html">path/to/your/index.html</file>

    确保将index.html的实际路径替换为文件的实际位置，或者将其直接放在项目目录下并通过资源系统正确引用。

    这段代码演示了如何通过QWebEngineView加载一个包含按钮的简单网页，使用JavaScript获取该按钮的ID，并通过QWebChannel将其发送回Qt应用程序，最终显示在一个消息框中。这满足了您提出的要求。请注意，实际应用中可能需要更复杂的错误处理和兼容性考虑。

    评论

报告相同问题？

  • qt+vue 混合编程的一个例子
    2023-03-31 11:06
    在IT领域，混合编程是一种常见的技术实践，它结合了多种技术栈的优点，以构建功能丰富的应用。本案例中，我们探讨的是"qt+vue"的混合编程，即使用C++的Qt框架与JavaScript的Vue.js库相结合，创建一个Windows桌面应用...
  • QWebEngineView异步获取加载图片的尺寸
    2020-04-10 10:57
    caochuanlin0123的博客 最近因为工作需要，QT版本升级到了5.12.4，原先的QWebView不能用了，改用新的QWebEngineView来显示气泡弹框。 思路描述 QWebEngineView的使用方式改为了异步，这点跟以前有很大不同。所以不能再通过以前的接口获取...
  • QWebEngineView简单使用，QWebEngineView显示网页点击链接无法跳转，Qt利用QWebEngine与网页混合编程，JS同步调用Qt获取数据，Qt调用JS函数
    2022-05-14 11:46
    唯独失去了从容的博客 QWebEngineView的使用 1、简单的QWebEngieView 使用 CccTestWebView.h #ifndef CCCTESTWEBVIEW_H #define CCCTESTWEBVIEW_H #include <QWidget> class QWebEngineView; class CccTestWebView : public ...
  • QWebEngineView 修改原始网页内容，布局等
    2017-05-25 11:32
    在IT领域，尤其是在桌面应用程序开发中，`QWebEngineView`是Qt库提供的一种非常重要的组件，用于在C++或Python等编程语言中嵌入Web内容。`QWebEngineView`是Qt WebEngine模块的一部分，它允许开发者在本地应用程序中...
  • qt 、html混合编程
    2019-02-13 11:59
    HTML则是一种标记语言，常用于创建网页和富互联网应用程序。将Qt与HTML混合编程，可以利用Qt的强大功能来构建用户界面，同时利用HTML的灵活性和丰富的样式效果，为用户提供更友好的体验。 在本项目"qtforhtml_login...
  • Qt开发 | Qt Web混合编程 | VS2019 CMake编译CEF与QCefView| QWebEngineView的基本用法 | Qt与html js交互 | Qt与ECharts
    2024-07-06 20:21
    嵌入式_晚风的博客 大多数web技术都是基于chrome，例如：CEF、QCefView、QWebEngineView，这些都是在native界面里用来显示html网页，并且可以与web交互，例如：常见的登陆窗口、优酷的视频区域、WPS的稻城商城，这些都是用web技术实现...
  • 《C++ GUI Qt4编程（第二版）》Qt5源码
    2018-04-25 20:31
    这本书主要关注的是使用C++语言与Qt4框架进行GUI编程，但源码已经更新，以适应Qt5的新特性。Qt是一个功能强大的跨平台应用程序开发框架，广泛应用于桌面、移动和嵌入式系统中。它提供了丰富的API，使得开发者能够...
  • Blockly 集成 到 Python 中的Demo
    2022-05-24 10:22
    这种可视化编程方式特别适合初学者和教育领域，使得编程变得更加直观和易懂。在这个Demo中，我们将看到如何将Blockly与Python环境相结合，利用PyQT创建用户界面，并通过QWebEngine展示Blockly。 首先，我们需要了解...
  • 基于Python和PyQt5实现访问Web应用程序或网页
    2022-04-16 22:34
    PyQt5不仅支持传统的GUI编程，还包含了QtWebEngineWidgets模块，这使得我们能够将Web浏览器的功能集成到桌面应用中。 在标题"基于Python和PyQt5实现访问Web应用程序或网页"中，关键点在于使用PyQt5的Qt...
  • QT GUI编程常用控件学习
    2024-02-25 20:15
    卓学电子的博客 1 GUI编程应该学什么 2 QT常用模块结构 QtCore: 包含了核心的非GUI的功能。主要和时间、文件与文件夹、各种数据、流、URLs、mime类文件、进程与线程一起使用 QtGui: 包含了窗口系统、事件处理、2D图像、基本绘画、...
  • QT加载地图百度地图离线加载
    2022-05-06 21:26
    在IT行业中，开发一款应用程序以实现地图的离线加载...这个过程涉及到C++编程、QT框架、Web技术以及地图数据处理等多个领域，需要开发者具备多方面的技能。在实际开发中，还可能根据具体需求进行更多的定制和功能扩展。
  • QT5使用百度地图实现经典经纬度查询
    2022-04-03 10:34
    2. **C++编程**：作为QT的主要开发语言，C++用于编写应用程序的逻辑代码。QT框架提供了许多C++类和接口，使得开发者能够方便地创建和管理UI元素、处理事件、进行网络通信等。 3. **网络通信**：在实现经纬度查询时...
  • qt编写的地图综合地图应用
    2022-03-22 22:56
    Qt是一种跨平台的应用程序开发框架，主要由 Trolltech（现为 Nokia 和 Digia 所有）开发，使用C++语言编写。它广泛应用于图形用户界面（GUI）应用程序，但也可以用于非GUI程序，如服务器应用、嵌入式系统等。在"qt...
  • python下利用pyside2写了一个网址收藏器，稍微改改可做成自己的浏览器了
    2021-06-23 11:47
    wave12_mp的博客 1、QWebEngineView如何创建新窗口 2、python下读写json数据，包括修改其中某个节点 3、QTabWidget控件的样式优化 4、状态栏、工具栏的引入，看起来像一个完整的软件主窗体界面 完整的效果： 初学python界面...
  • 【QT进阶】Qt Web混合编程之实现ECharts数据交互动态修改
    2024-04-19 21:41
    不吃~香菜的博客 【QT进阶】Qt Web混合编程之实现ECharts数据交互动态修改
  • Qt.rar_QT编程_Qt Reference chm_qt webframe_qt documentation chm_q
    2022-09-22 17:17
    Qt是一个跨平台的应用程序开发框架，主要用C++语言编写，广泛应用于桌面、移动和嵌入式设备的软件开发。Qt库提供了丰富的API，使得开发者能够快速构建用户界面和应用程序，同时支持多种操作系统，包括Windows、Linux...
  • Python+HTML+PyQT5进行桌面开发应用
    2020-04-09 14:26
    Python，作为一个多用途且强大的编程语言，结合HTML和PyQT5库，可以创建出功能丰富的桌面应用。PyQT5是Python的一个图形用户界面工具包，它提供了QWebEngineView组件，允许开发者将网页技术融入到桌面应用中，同时...
  • Qt案例之利用network相关类实现简单网页浏览器.zip
    2022-01-24 21:48
    通过以上知识点的学习和实践，开发者能够构建一个基本的网页浏览器，理解Qt的网络编程模型，同时提升C++编程技能。这个案例是一个很好的起点，进一步深入，还可以实现更多高级功能，如支持HTTPS、cookies、网页内...
  • 基于Python中PyQt5实现简易浏览器
    2022-06-01 20:22
    `QApplication` 是应用程序的核心，`QMainWindow` 用于创建主窗口，`QWidget` 是所有GUI元素的基础类，`QPushButton` 和 `QLineEdit` 分别用于创建按钮和输入框，而 `QWebView` 或 `QWebEngineView`（取决于你使用的...
  • Qt 嵌入浏览器 QWebEngineView实现浏览器基本功能
    2022-12-28 15:26
    十年编程老舅的博客 Qt 嵌入浏览器 QWebEngineView实现浏览器基本功能
  • 没有解决我的问题, 去提问

问题事件

  • 已结题 （查看结题原因） 10月21日
  • 创建了问题 10月21日