如何使用 Qt 嵌入基本 HTML 页面?
How to embed basic HTML page using Qt?
我正在使用 PySide2.QtWebEngineWidgets.QWebEngineView() 对其进行设置Html以显示如下所示的基本页面。
此 html 文件在浏览器中运行良好,因为它的所有文件都位于与 html 文件相关的同一文件夹中。
将Html设置为以下文件后,出现此异常:
Qt 错误:
Uncaught ReferenceError: require is not defined
这是否与 Qt 不像常规浏览器那样找不到相关文件有关?或者还有什么我应该做的吗?还是 QWebEngineView 不够先进,无法执行 javascript?如果可以,我应该使用什么?
我只想创建一个网页小部件并加载我的 Html,如下所示。其他一切都由 Html 代码完成。
重现:
- 将下面的 html 代码保存为 html 文件
- 运行 这段代码:
from PySide2 import QtCore, QtWidgets, QtGui
from PySide2.QtWebEngineWidgets import QWebEngineView
editor = QWebEngineView()
htmlfile = 'C:/myHtmlFile.html'
with open(htmlfile, 'r') as f:
html = f.read()
editor.setHtml(html)
editor.show()
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
</head>
<body>
<div id="container" style="width:800px;height:600px;border:1px solid grey"></div>
<script src="monaco-editor/min/vs/loader.js"></script>
<script>
require.config({ paths: { 'vs': 'monaco-editor/min/vs' }});
require(['vs/editor/editor.main'], function() {
var editor = monaco.editor.create(document.getElementById('container'), {
value: [
'function x() {',
'\tconsole.log("Hello world!");',
'}'
].join('\n'),
language: 'javascript',
fontFamily:"Verdana",
theme: "vs-dark"
});
});
</script>
</body>
</html>
(免责声明:我不是 javascript 方面的专家)
require 命令需要文件系统信息,因此您不能使用 HTML 字符串,但您需要创建一个 HTML 文件并使用 load():
加载它
import os
from PySide2 import QtCore, QtWidgets, QtWebEngineWidgets
CURRENT_DIR = os.path.dirname(os.path.realpath(__file__))
if __name__ == "__main__":
import sys
app = QtWidgets.QApplication(sys.argv)
view = QtWebEngineWidgets.QWebEngineView()
filename = os.path.join(CURRENT_DIR, "index.html")
view.load(QtCore.QUrl.fromLocalFile(filename))
view.show()
sys.exit(app.exec_())
├── index.html
├── main.py
└── monaco-editor
├── CHANGELOG.md
├── dev
├── esm
├── LICENSE
├── min
├── min-maps
├── monaco.d.ts
├── package.json
├── README.md
└── ThirdPartyNotices.txt
我正在使用 PySide2.QtWebEngineWidgets.QWebEngineView() 对其进行设置Html以显示如下所示的基本页面。
此 html 文件在浏览器中运行良好,因为它的所有文件都位于与 html 文件相关的同一文件夹中。
将Html设置为以下文件后,出现此异常:
Qt 错误:
Uncaught ReferenceError: require is not defined
这是否与 Qt 不像常规浏览器那样找不到相关文件有关?或者还有什么我应该做的吗?还是 QWebEngineView 不够先进,无法执行 javascript?如果可以,我应该使用什么?
我只想创建一个网页小部件并加载我的 Html,如下所示。其他一切都由 Html 代码完成。
重现:
- 将下面的 html 代码保存为 html 文件
- 运行 这段代码:
from PySide2 import QtCore, QtWidgets, QtGui
from PySide2.QtWebEngineWidgets import QWebEngineView
editor = QWebEngineView()
htmlfile = 'C:/myHtmlFile.html'
with open(htmlfile, 'r') as f:
html = f.read()
editor.setHtml(html)
editor.show()
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
</head>
<body>
<div id="container" style="width:800px;height:600px;border:1px solid grey"></div>
<script src="monaco-editor/min/vs/loader.js"></script>
<script>
require.config({ paths: { 'vs': 'monaco-editor/min/vs' }});
require(['vs/editor/editor.main'], function() {
var editor = monaco.editor.create(document.getElementById('container'), {
value: [
'function x() {',
'\tconsole.log("Hello world!");',
'}'
].join('\n'),
language: 'javascript',
fontFamily:"Verdana",
theme: "vs-dark"
});
});
</script>
</body>
</html>
(免责声明:我不是 javascript 方面的专家)
require 命令需要文件系统信息,因此您不能使用 HTML 字符串,但您需要创建一个 HTML 文件并使用 load():
加载它import os
from PySide2 import QtCore, QtWidgets, QtWebEngineWidgets
CURRENT_DIR = os.path.dirname(os.path.realpath(__file__))
if __name__ == "__main__":
import sys
app = QtWidgets.QApplication(sys.argv)
view = QtWebEngineWidgets.QWebEngineView()
filename = os.path.join(CURRENT_DIR, "index.html")
view.load(QtCore.QUrl.fromLocalFile(filename))
view.show()
sys.exit(app.exec_())
├── index.html
├── main.py
└── monaco-editor
├── CHANGELOG.md
├── dev
├── esm
├── LICENSE
├── min
├── min-maps
├── monaco.d.ts
├── package.json
├── README.md
└── ThirdPartyNotices.txt