Как получить данные из python в js с помощью QWebChannel?

Я пытаюсь заставить свое приложение PyQt взаимодействовать с JS, но не могу получить значения из python. У меня есть два слота на стороне питона для получения и печати данных. В этом примере int передается из JS в python, python добавляет к нему 5 и передает его обратно, затем JS вызывает другой слот для печати нового значения.

var backend = null;
var x = 15;
new QWebChannel(qt.webChannelTransport, function (channel) {
    backend = channel.objects.backend;
    backend.getRef(x, function(pyval){
        backend.printRef(pyval)
    });
});

@pyqtSlot(int)
def getRef(self, x):
    print('inside getRef', x)
    return x + 5

@pyqtSlot(int)
def printRef(self, ref):
    print('inside printRef', ref)

Выход:

inside getRef 15
Could not convert argument QJsonValue(null) to target type int .

Ожидается:

inside getRef 15
inside printRef 20

Я не могу понять, почему возвращаемое значение равно нулю. Как мне сохранить этот pyval в переменной на стороне js, чтобы использовать ее позже?

Источник

1 ответ

Решение

В C++, чтобы метод мог возвращать значение, он должен быть объявлен как Q_INVOKABLE и эквивалент в PyQt - использовать result в @pyqtSlot декоратор:

├── index.html
└── main.py

main.py

from PyQt5 import QtCore, QtWidgets, QtWebEngineWidgets, QtWebChannel


class Backend(QtCore.QObject):
    @QtCore.pyqtSlot(int, result=int)
    def getRef(self, x):
        print("inside getRef", x)
        return x + 5

    @QtCore.pyqtSlot(int)
    def printRef(self, ref):
        print("inside printRef", ref)


if __name__ == "__main__":
    import os
    import sys

    app = QtWidgets.QApplication(sys.argv)

    backend = Backend()

    view = QtWebEngineWidgets.QWebEngineView()

    channel = QtWebChannel.QWebChannel()
    view.page().setWebChannel(channel)
    channel.registerObject("backend", backend)

    current_dir = os.path.dirname(os.path.realpath(__file__))
    filename = os.path.join(current_dir, "index.html")
    url = QtCore.QUrl.fromLocalFile(filename)
    view.load(url)

    view.resize(640, 480)
    view.show()
    sys.exit(app.exec_())

index.html

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script type="text/javascript" src="qrc:///qtwebchannel/qwebchannel.js"></script>
        <script type="text/javascript">
            var backend = null;
            var x = 5;
            window.onload = function()
            {
                new QWebChannel(qt.webChannelTransport, function(channel) {
                    backend = channel.objects.backend;
                    backend.getRef(x, function(pyval) {
                        backend.printRef(pyval);
                    });
                });
            }
        </script>
    </head>
</html>

Обновить:

В общем, QtWebChannel может передавать только информацию, которая может быть преобразована в QJsonObject со стороны Qt, а со стороны javascript - те данные, которые могут быть преобразованы в JSON.

Итак, есть частные случаи:

  • int
  • плавать
  • ул.
  • list: если поддерживается отправка и получение списков, но только из элементов, таких как числа и строки, а также словаря и других списков, поддерживающих предыдущие базовые типы.
class Backend(QtCore.QObject):
    @QtCore.pyqtSlot(result=list)
    def return_list(self):
        return [0.0, 1.5, 'Hello', ['Stack', 5.0], {'a': {'b': 'c'}}]

    @QtCore.pyqtSlot(list)
    def print_list(self, l):
        print(l)

backend = channel.objects.backend;
backend.return_list(function(pyval) {
    backend.print_list(pyval);
});

Выход:

[0.0, 1.5, 'Hello', ['Stack', 5.0], {'a': {'b': 'c'}}]
  • диктат:
class Backend(QtCore.QObject):
    @QtCore.pyqtSlot(result="QJsonObject")
    def return_dict(self):
        return {"a": 1.5, "b": {"c": 2}, "d": [1, "3", "4"]}

    @QtCore.pyqtSlot("QJsonObject")
    def print_dict(self, ref):
        print(ref)

backend = channel.objects.backend;
backend.return_dict(function(pyval) {
    backend.print_dict(pyval);
});

Выход:

{'a': <PyQt5.QtCore.QJsonValue object at 0x7f3841d50150>, 'b': <PyQt5.QtCore.QJsonValue object at 0x7f3841d501d0>, 'd': <PyQt5.QtCore.QJsonValue object at 0x7f3841d50250>}

Как видите, возвращается QJsonValue, поэтому получение информации может быть утомительным, поэтому в данном случае обходной путь - упаковать их в список:

class Backend(QtCore.QObject):
    @QtCore.pyqtSlot(result=list)
    def return_list(self):
        d = {"a": 1.5, "b": {"c": 2}, "d": [1, "3", "4"]}
        return [d]

    @QtCore.pyqtSlot(list)
    def print_list(self, ref):
        d, *_ = ref
        print(d)

backend = channel.objects.backend;
backend.return_list(function(pyval) {
    backend.print_list(pyval);
});

Выход:

{'a': 1.5, 'b': {'c': 2.0}, 'd': [1.0, '3', '4']}

ОБНОВЛЕНИЕ2:

Общий способ передачи информации - использовать JSON, то есть преобразовать объект python или js и преобразовать его в строку с помощью json.dumps() а также JSON.stringify()соответственно и отправить его; при получении в python или js строка должна быть преобразована с использованиемjson.loads() а также JSON.parse()соответственно:

class Backend(QtCore.QObject):
    @QtCore.pyqtSlot(str, result=str)
    def getRef(self, o):
        print("inside getRef", o)
        py_obj = json.loads(o)
        py_obj["c"] = ("Hello", "from", "Python")
        return json.dumps(py_obj)

    @QtCore.pyqtSlot(str)
    def printRef(self, o):
        py_obj = json.loads(o)
        print("inside printRef", py_obj)

var backend = null;
window.onload = function()
{
    new QWebChannel(qt.webChannelTransport, function(channel) {
        backend = channel.objects.backend;
        var x = {a: "1000", b: ["Hello", "From", "JS"]}
        backend.getRef(JSON.stringify(x), function(y) {
            js_obj = JSON.parse(y);
            js_obj["f"] = false;
            backend.printRef(JSON.stringify(js_obj));
        });
    });
}

inside getRef {"a":"1000","b":["Hello","From","JS"]}
inside printRef {'a': '1000', 'b': ['Hello', 'From', 'JS'], 'c': ['Hello', 'from', 'Python'], 'f': False}
Источник
Другие вопросы по тегам