快捷導(dǎo)航

詳解如何在Java中實(shí)現(xiàn)屏幕共享

更新時(shí)間：2024年10月31日 08:25:01 作者：TeamDev

在本文中,將為大家展示如何利用 JxBrowser 的功能,實(shí)現(xiàn)運(yùn)行在不同電腦上的兩個(gè) Java 應(yīng)用程序之間的屏幕共享,感興趣的小伙伴可以參考一下

遠(yuǎn)程屏幕共享廣泛運(yùn)用于各種應(yīng)用和服務(wù)中，從網(wǎng)絡(luò)會(huì)議到遠(yuǎn)程訪問(wèn)應(yīng)用都離不開(kāi)它的支持。后臺(tái)員工可以使用它向一線同事咨詢問(wèn)題，技術(shù)支持專家也可以通過(guò)它查看客戶看到的精確畫(huà)面。

盡管市面上有像 TeamViewer 這樣的第三方應(yīng)用可供選擇，但如果您希望直接在 Java 應(yīng)用程序中集成遠(yuǎn)程訪問(wèn)功能，那么，您可能需要考慮另一種解決方案。

在本文中，我將向您展示如何利用 JxBrowser 的功能，實(shí)現(xiàn)運(yùn)行在不同電腦上的兩個(gè) Java 應(yīng)用程序之間的屏幕共享。

JxBrowser 作為一款強(qiáng)大的跨平臺(tái) Java 庫(kù)，它不僅能夠?qū)⒒?Chromium 的 Web 瀏覽器控件無(wú)縫集成到您的 Java Swing、JavaFX、SWT 應(yīng)用程序中，同時(shí)還提供了對(duì) Chromium 數(shù)百種強(qiáng)大功能的支持，這為我們實(shí)現(xiàn)屏幕共享提供了很大便利。

為了在 Java 中實(shí)現(xiàn)屏幕共享，我將利用 Chromium 內(nèi)置的屏幕共享功能，并結(jié)合 JxBrowser 提供的編程接口進(jìn)行操作。

概述

該項(xiàng)目包含兩部分: 一是基于 Node.js 的服務(wù)器；二是兩個(gè)獨(dú)立的 Java 應(yīng)用程序。

服務(wù)器是一個(gè)簡(jiǎn)化的 WebRTC 服務(wù)器實(shí)現(xiàn)。項(xiàng)目的這一部分包含了用于連接到服務(wù)器并啟動(dòng)屏幕共享會(huì)話的 JavaScript 代碼。

Java 客戶端是兩個(gè)桌面應(yīng)用程序。第一個(gè)應(yīng)用程序是一個(gè)帶有按鈕的窗口。點(diǎn)擊按鈕將啟動(dòng)共享會(huì)話。第二個(gè)應(yīng)用程序則會(huì)自動(dòng)接收視頻流并顯示它。同時(shí)還有一個(gè)按鈕用于停止屏幕共享。

WebRTC 服務(wù)器

WebRTC 服務(wù)器被配置為支持兩個(gè)客戶端之間的交互：一個(gè)流媒體發(fā)送端（streamer）和一個(gè)接收端（receiver）。該服務(wù)器提供兩個(gè)靜態(tài)頁(yè)面，分別是 streamer.html 和 receiver.html。

const app = express();

app.use(express.static('public'));

app.get('/streamer', (req, res) => {
   res.sendFile(rootPath + 'public/streamer.html');
});

app.get('/receiver', (req, res) => {
   res.sendFile(rootPath + 'public/receiver.html');
});

每個(gè) HTML 文件都包含了 JavaScript 代碼，這段代碼負(fù)責(zé)連接至服務(wù)器并通過(guò) WebRTC 建立屏幕共享。當(dāng)流媒體發(fā)送端開(kāi)始捕獲屏幕時(shí)，我們會(huì)將其屏幕視圖作為視頻流接收。為了顯示這個(gè)視頻流，我們會(huì)在接收端使用內(nèi)置的 HTML5 視頻播放器。

為了檢查一切是否正常，讓我們打開(kāi)兩個(gè)瀏覽器窗口親自查看一下。

Java 客戶端

接下來(lái)，讓我們實(shí)現(xiàn) Java 客戶端，并將它們與 JavaScript 應(yīng)用程序集成。我們需要初始化一個(gè)空的 Gradle 項(xiàng)目，并使用 JxBrowser Gradle 插件添加 JxBrowser 的依賴項(xiàng)。

plugins {
    …
    id("com.teamdev.jxbrowser") version "1.0.1"
}

jxbrowser {
    version = "{version}"
}

dependencies {
    // 檢測(cè)當(dāng)前平臺(tái)并添加相應(yīng)的 Chromium 二進(jìn)制文件。 
    implementation(jxbrowser.currentPlatform)

    // 添加對(duì) Swing 集成的依賴項(xiàng)。
    implementation(jxbrowser.swing)
}

流媒體發(fā)送端應(yīng)用

讓我們從一個(gè)將要共享其屏幕的應(yīng)用程序開(kāi)始。

我們需要代表流媒體發(fā)送端連接到服務(wù)器。首先，需要?jiǎng)?chuàng)建 Engine 和 Browser 的實(shí)例：

Engine engine = Engine.newInstance(HARDWARE_ACCELERATED);
Browser browser = engine.newBrowser();

然后加載所需的 URL：

browser.navigation().loadUrlAndWait("http://localhost:3000/streamer");

一旦 URL 加載完畢，我們便可以訪問(wèn) streamer.html 中的 JavaScript 代碼，以及可以在 Java 中通過(guò)按鈕點(diǎn)擊直接開(kāi)始屏幕共享：

JButton startSharingButton = new JButton("共享您的屏幕");

startSharingButton.addActionListener(e -> {
   browser.mainFrame().ifPresent(mainFrame ->    
       mainFrame.executeJavaScript("startScreenSharing()"));
});

默認(rèn)情況下，當(dāng)網(wǎng)頁(yè)想要捕獲屏幕上的視頻時(shí)，Chromium 會(huì)彈出一個(gè)對(duì)話框供用戶選擇捕獲源。不過(guò)，借助 JxBrowser API，我們可以直接在代碼中指定捕獲源，從而省去手動(dòng)選擇的步驟：

browser.set(StartCaptureSessionCallback.class, (params, tell) -> {
    CaptureSources sources = params.sources();
    // 共享整個(gè)屏幕。
    CaptureSource screen = sources.screens().get(0);
    tell.selectSource(screen, AudioCaptureMode.CAPTURE);
});

讓我們保存 CaptureSession 的實(shí)例，以便稍后可以通過(guò)編程方式停止它。

private CaptureSession captureSession;
…
browser.on(CaptureSessionStarted.class, event -> 
    captureSession = event.capture()
);

為此，我們需要一個(gè)不同的按鈕：

JButton stopSharingButton = new JButton("停止共享");
stopSharingButton.addActionListener(e -> {
   captureSession.stop();
});

接收端應(yīng)用

在接收端應(yīng)用中，我們將顯示共享的屏幕。

和流媒體發(fā)送端應(yīng)用一樣，我們需要連接到 WebRTC 服務(wù)器，但這次是作為接收端。因此，我們需要?jiǎng)?chuàng)建 Engine 和 Browser 實(shí)例，并導(dǎo)航到接收端的 URL：

Engine engine = Engine.newInstance(HARDWARE_ACCELERATED);
Browser browser = engine.newBrowser();
browser.navigation().loadUrlAndWait("http://localhost:3000/receiver");

為了在 Java 應(yīng)用程序中顯示流媒體發(fā)送端的屏幕，讓我們創(chuàng)建一個(gè) Swing 的 BrowserView 組件，并將其嵌入到 JFrame 中：

private static void initUI(Browser browser) {
   BrowserView view = BrowserView.newInstance(browser);

   JFrame frame = new JFrame("接收端");
   frame.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);
   frame.setSize(700, 500);
   frame.add(view, BorderLayout.CENTER);
   frame.setLocationRelativeTo(null);
   frame.setVisible(true);
}

BrowserView 組件將顯示加載的網(wǎng)頁(yè)內(nèi)容，包括 HTML5 視頻播放器，這樣我們就可以看到流媒體發(fā)送端的屏幕了。

就是這樣!