JavaFX中嵌入Chromium谷歌内核

近日，笔者接到一个需求。开发一个客户端程序，内嵌浏览器，能够访问Vue.js项目。

接到这个需求吧，就很别扭。Java并不擅长开发客户端程序。笔者在学习Java开发时会Swing开发过客户端程序，整体感觉用Java开发客户端程序很麻烦，开发出来的东西也很丑。丑爆了。

没办法，领导安排的事情就要做，硬着头皮做。

经过一番考查，技术选型最终定为JavaFX + JxBrowser。

确认技术是否可行，先写Demo示例程序。

简单说一下JxBrowser是什么。

JxBrowser是一个Java类库，用于将谷歌Chromium浏览器组件集成到Java应用中，可以在JavaFX、Swing、SWT应用中展示Web页面和PDF文件。

开发环境：

• Windows 10（64位）
• JDK1.8

开发工具：IntelliJ IDEA 2021.3.3

（1）创建一个Maven项目。

<groupId>com.jasmine</groupId>
<artifactId>brower</artifactId>
<version>1.0-SNAPSHOT</version>

（2）在项目根目录下创建文件夹lib用于存放JxBrowser的Jar包。

（3）将JxBrowser的Jar包（jxbrowser-6.21.jar、jxbrowser-win64-6.21.jar、license.jar）复制到lib文件夹下。

（4）在IDEA中引用lib文件夹下的所有Jar包。

File --> Project Structure --> Project Settings --> Libraries --> + --> Java --> 选择lib文件夹的所有Jar包。

（5）创建项目启动类 —— App.java

public class App extends Application {

    static {
        try {
            Field e = ba.class.getDeclaredField("e");
            e.setAccessible(true);
            Field f = ba.class.getDeclaredField("f");
            f.setAccessible(true);
            Field modifersField = Field.class.getDeclaredField("modifiers");
            modifersField.setAccessible(true);
            modifersField.setInt(e, e.getModifiers() & ~Modifier.FINAL);
            modifersField.setInt(f, f.getModifiers() & ~Modifier.FINAL);
            e.set(null, new BigInteger("1"));
            f.set(null, new BigInteger("1"));
            modifersField.setAccessible(false);
        } catch (Exception e1) {
            e1.printStackTrace();
        }

    }

    @Override
    public void start(final Stage primaryStage) {
        Browser browser = new Browser();
        BrowserView view = new BrowserView(browser);

        Scene scene = new Scene(new BorderPane(view));
        primaryStage.setScene(scene);
        // 设置窗口最大化
        primaryStage.setMaximized(true);
        // 设置全屏展示
//        primaryStage.setFullScreen(true);
        // 设置标题
        primaryStage.setTitle("Hello JavaFX Application");
        primaryStage.show();

        // 添加了一个属性，供在JS文件中Java代码
        browser.addLoadListener(new LoadAdapter() {
            @Override
            public void onStartLoadingFrame(StartLoadingEvent event) {
                JSValue window = browser.executeJavaScriptAndReturnValue("window");
                MyBridge myBridge = new MyBridge();
                window.asObject().setProperty("myBridge", myBridge);
            }
        });

        browser.loadURL("http://localhost:8080/");
    }

    public static void main(String[] args) {
        launch(args);
    }
}

MyBridge.java

public class MyBridge {
    public void print(String msg) {
        System.out.println("msg: " + msg);
    }
}

在.vue文件中调用Java代码的方式：

print() {
  myBridge.print("vue page print button click");
}

（6）运行App.java。

项目启动成功后，我们就能看到一个最大化的JavaFX窗体，内嵌了Vue页面。点击Vue页面的按钮，可以在JavaFX项目控制台中看到对应的输出信息。