如何在2022年调试JavaFX webview

Question

如何调试JavaFX How视图？我找到了两种方法

一个是将外部铬调试器附加到webview.

• Another上，是用来注入firebug javascript.的。

Method#1似乎使用了一些黑客技术，比如设置对私有字段的访问等。Method#2依赖于现在看来已经过时的火药。

2022年该怎么做呢？有没有其他的方法，或者更好的方法？

到目前为止，我正在尝试firebug lite方法，并且已经将javascript作为maven项目的一部分，并尝试将其作为字符串而不是外部URL注入，因为firebug现在似乎没有被正确地托管在任何地方。

参考https://stackoverflow.com/a/18396900/2448015

，这就是我现在的位置:

package xyz.jphil.internal_browser;

import com.sun.net.httpserver.HttpContext;
import com.sun.net.httpserver.HttpServer;
import java.net.InetSocketAddress;
import javafx.scene.web.WebEngine;
import netscape.javascript.JSObject;

/**
 *
 * @author Ivan
 */
public class WebkitDebugUtils {
    private static int resourcesPort = 0;

    public static void createHttpServerForLocalFiles() {
        int portStart = 64321, endPort = 65534;
        resourcesPort = portStart + (int) ((endPort * 1d - portStart * 1d) * Math.random());
        System.out.println("Starting internal server on " + resourcesPort);
        try {
            HttpServer server = HttpServer.create(new InetSocketAddress(resourcesPort), 0);
            HttpContext context = server.createContext("/");
            context.setHandler((req) -> {
                try (req) {
                    var p = req.getRequestURI();
                    System.out.println("Serving @ localhost:"+resourcesPort+" "+p);
                    var s = WebkitDebugUtils.class.getResourceAsStream(p.toString()).readAllBytes();
                    req.sendResponseHeaders(200, s.length);
                    req.getResponseBody().write(s);
                }catch(Exception a){
                    a.printStackTrace();
                }
            });
            server.start();
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

    public static class JavaBridge {
        public void log(String text) {
            System.out.println(text);
        }
    }

    // Maintain a strong reference to prevent garbage collection:
    // https://bugs.openjdk.java.net/browse/JDK-8154127
    private final static JavaBridge bridge = new JavaBridge();

    public static void enableDebug(final WebEngine e) {
        JSObject window = (JSObject) e.executeScript("window");
        window.setMember("java", bridge);
        e.executeScript("""
                        console.log = function(message)
                        {
                            java.log(message);
                        };""");
        e.executeScript("console.log('console.log enabled');");
    }
    
    public static void enableFirebug(final WebEngine e) {
        var firebugurl = "http://localhost:"+resourcesPort+"/firebug-lite/firebug-lite.js";
        //https://raw.githubusercontent.com/stefanXO/firebug-lite/master/firebug-lite.js
        //https://lupatec.eu/getfirebug/firebug-lite-compressed.js
        var script= """
                    console.log("Inside script block");
                    if (!document.getElementById("FirebugLite")) {
                        E = document["createElement" + "NS"] && document.documentElement.namespaceURI;
                        E = E ? 
                             document["createElement" + "NS"](E, "script") : 
                             document["createElement"]("script");
                        E["setAttribute"]("id", "FirebugLite");
                        E["setAttribute"]("src", "{$firebugurl}#startOpened");
                        E["setAttribute"]("FirebugLite", "4");
                        (
                             document["getElementsByTagName"]("head")[0] 
                             || 
                             document["getElementsByTagName"]("body")[0]
                        ).appendChild(E);
                        E = new Image();
                        E["setAttribute"]("src", "{$firebugurl}#startOpened");
                    }
                    console.log("executed script block");
                    """.replace("{$firebugurl}", firebugurl);
        System.out.println("+++firebug thing+++");
        System.out.println(script);
        System.out.println("---firebug thing---");
        e.executeScript(script);
    }
}

应用的主要方法

    //...
    public static void main(String[]args){
        WebkitDebugUtils.createHttpServerForLocalFiles();
        launch(args);
    }
    //...

在JavaFx阶段初始化代码节

    @Override
    public void start(final Stage primaryStage) throws Exception {
        // ....
        wv = new WebView();
        // ....
        javafx.scene.web.WebEngine e = wv.getEngine();
        // ....
        e.getLoadWorker().stateProperty().addListener((ov, t, t1) -> WebkitDebugUtils.enableDebug(e));
        e.documentProperty().addListener((ov, t, t1) -> WebkitDebugUtils.enableFirebug(e));
        // ....
    }

我从jar的资源文件夹中为firebug提供文件。

自定义文件的Snippter

console.log("inside firebug-lite");
(function(){
//...
//firebug lite 1.4.0 code 
//..
})();
console.log("outside firebug-lite");

输出

Starting internal server on 65148
console.log enabled
console.log enabled

// some application specific output

+++firebug thing+++
if (!document.getElementById("FirebugLite")) {
    E = document["createElement" + "NS"] && document.documentElement.namespaceURI;
    E = E ?
         document["createElement" + "NS"](E, "script") :
         document["createElement"]("script");
    E["setAttribute"]("id", "FirebugLite");
    E["setAttribute"]("src", "http://localhost:65148/firebug-lite/firebug-lite.js#startOpened");
    E["setAttribute"]("FirebugLite", "4");
    (
         document["getElementsByTagName"]("head")[0]
         ||
         document["getElementsByTagName"]("body")[0]
    ).appendChild(E);
    E = new Image();
    E["setAttribute"]("src", "http://localhost:65148/firebug-lite/firebug-lite.js#startOpened");
}

---firebug thing---
Inside script block
executed script block
Serving @ localhost:65148 /firebug-lite/firebug-lite.js

// some application specific output

console.log enabled

摘要：什么都没有发生，控制台中什么也没有显示，我不知道错误，甚至没有打开防火墙。

Update2: --我想我使用了错误版本的Firebug1.5或什么的，而旧版本我没有看到任何文件，因此它依赖于默认的网站，该网站目前正在关闭。

Answer 1

你可以简单地在加载你的网页后注入萤火虫。

我已经在windows 10上使用correto18.0.2JDK进行了测试。

下面是一个示例：(页面加载可能需要一些时间)

package com.example.demo;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.VBox;
import javafx.scene.web.WebView;
import javafx.stage.Stage;
import javafx.scene.web.WebEngine;
import javafx.concurrent.Worker.State;

public class HelloApplication extends Application {
    public static void main(String[] args) {
        launch(args);
    }

    @Override
    public void start(Stage myStage) {
        System.out.println("Demo for firebugLite");

        WebView myWebView = new WebView();
        myWebView.minHeight(1050);
        myWebView.prefWidth(1950);
        myWebView.prefHeight(1070);
        myWebView.minWidth(1050);
        final WebEngine myWebEngine = myWebView.getEngine();
        myWebEngine.getLoadWorker().stateProperty()
                .addListener((obs, oldValue, newValue) -> {
                    if (newValue == State.SUCCEEDED) {
                        System.out.println("finished loading");
                        myWebEngine.executeScript("var firebug=document.createElement('script');firebug.setAttribute('src','https://lupatec.eu/getfirebug/firebug-lite-compressed.js');document.body.appendChild(firebug);(function(){if(window.firebug.version){firebug.init();}else{setTimeout(arguments.callee);}})();void(firebug);");
                    }
                });
        myWebEngine.load("https://lupatec.eu/getfirebug/");
        VBox myBox = new VBox(myWebView);
        Scene myScene = new Scene(myBox, 1050, 600);
        myStage.setScene(myScene);
        myStage.show();
    }
}

结果：

​