# 功能整合

本章節將為您介紹如何整合 FIRERAP 遠端桌面及其相關功能，您可以將其自行整合到您的前端頁面，以進行操作、展示等各種應用。本章我們不會在此詳細介紹，您可以前往我們的 APIFOX 文件查看並進行測試。不過，我們需要為您介紹一些前置設定及其他基礎資訊。

```{hint}
以下內容需要您對 Websocket、Canvas 繪製、H.264 等具備一些基本了解。
```

## 前置設定

為方便您進行 API 測試，首先請確保裝置已透過 USB 連接到目前電腦，並確認裝置未啟用登入憑證驗證（https）。完成這兩步操作後，您還需完成 Apifox 平台的相關設定。由於涉及 ws API，您需要安裝 Apifox 電腦用戶端（非網頁版），並將相關專案匯入到您的用戶端內。我們不會在此介紹如何安裝與匯入，請您自行摸索。

## 即時視訊

即時視訊使用 Websocket 進行傳輸，視訊支援兩種傳輸格式：其一為 MJPEG (MOTION JPEG)，其二為 H.264 NALU。其中 MJPEG 的使用方式最為簡單。MJPEG 的實際傳輸內容為目前裝置螢幕的截圖，只要傳輸速度夠快，就能形成動態的即時裝置畫面。您唯一需要做的處理，就是將從 Ws 收到的每個影格訊息以 JPEG 的方式繪製到螢幕上即可。另一種 H.264 格式則對您的基礎知識要求較高，因為在渲染到畫布前，您還需要進行解碼操作。您可以自行搜尋或整合現有的 H.264 解碼器來進行解碼與繪製。

H.264 與 MJPEG 的區別在於，相對來說 H.264 可減少至少一半的流量，且速度較快。當然，它並非適用於所有裝置，部分裝置本身的 H.264 編碼效能可能不高，這時您應採用 MJPEG 進行傳輸。不過 MJPEG 也有其缺點，由於每個影格都是純圖像，因此對頻寬要求較高。

## 即時觸控

即時觸控也是使用 Websocket 進行傳輸。這部分沒有什麼特別之處，您只需按照特定格式傳送「按下」、「移動」、「抬起」三種操作即可。您可以透過網頁端的 `mousedown`、`up` 等事件來觸發，傳輸的主體資料為事件及座標。這裡唯一需要注意的是，座標需要您根據 canvas 及實際螢幕的大小進行轉換，計算出使用者在 canvas 上操作的座標所對應的實際螢幕座標。

## 按鍵操作

按鍵操作相對來說是最簡單的部分。您只需透過特定格式發送 POST 請求至相關 API 即可。按鍵操作支援您控制裝置的導航鍵以及進行普通的英文輸入。

## 命令終端

命令終端使用 Websocket 進行。您需要使用 xterm.js 等相關技術進行對接操作。您只需根據 API 文件將輸入輸出格式化為特定格式，然後傳送或請求 xterm 輸出即可。


## 即時指令