QML WebEngineView 和 DOM 元素更新

Question

我正在尝试使用 javascript 使用更新的输入凭据打开 Netflix 网址。输入似乎在 HTML 表单中更新，但是当我触发登录按钮时，输入字段为空。任何意见都非常感谢

WebEngineView {
    id: webEngineView
    focus: true                
    url: "https://www.netflix.com/de-en/login"

    onLoadProgressChanged: {
        if(loadProgress === 100){
            webEngineView.runJavaScript("var input1 = document.getElementsByName('email');
                                                      input1[0].value =\"xxxxx@email.com\";",
                                        function(result) { console.error("Email updated"); });
            webEngineView.runJavaScript("var input2 = document.getElementsByName('password');
                                                      input2[0].value =\"*******\";",
                                        function(result) { console.error("Password updated"); });
        }
    }
}

Answer 1

您可能使用了错误的元素名称。 查看document.getElementsByName返回的值：

webEngineView.runJavaScript("document.getElementsByName('element-name')", function(element){
                console.log(element);
});

我建议您使用元素 ID 而不是名称。 （分别是document.getElementById()）。您可以使用开发者工具（Chrome 中的 F12）找到元素 ID。

正确的元素是id_userLoginId，但它仍然不起作用。 我想问题出在Netflix页面上。也许一些风格或什么... 有趣的是，代码在 Chrome 控制台中运行良好。 以下是适用于 Google 的代码：

import QtQuick 2.11
import QtQuick.Controls 2.4
import QtWebEngine 1.7

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("WebEngine Test")

    WebEngineView {
        id: webEngineView
        focus: true
        anchors.fill: parent
        url: "https://www.google.com"
        onLoadingChanged: {
            if(loadRequest.status === WebEngineLoadRequest.LoadSucceededStatus)
            {
                webEngineView.runJavaScript("searchbox = document.getElementById(\"lst-ib\"); searchbox.value=\"Who Framed Roger Rabbit\";");
            }
        }
    }
}

另一种运行自定义脚本的方式：

WebEngineView {
    id: webEngineView
    focus: true
    anchors.fill: parent
    url: "https://www.google.com"
    userScripts: WebEngineScript {
        injectionPoint: WebEngineScript.DocumentReady
        sourceCode: "box = document.getElementById('lst-ib'); box.value = 'xxx';"
    }
}

不幸的是，这也不适用于 Netflix。