EMQX 提供了一個內建的管理控制檯，即 EMQX Dashboard 。方便使用者透過 Web 頁面就能輕鬆管理和監控 EMQX 叢集，並配置和使用所需的各項功能。

歷經多個大版本迭代，EMQX 在[最新發布的 5.0 版本](https://www.emqx.com/zh/blog/emqx-v-5-0-released)中帶來了全新 UI 設計風格的 EMQX Dashboard。該版本最佳化了關鍵資料和指標資料的顯示方式與內容，在提升視覺體驗的同時，也提供了更全面、強大、易用的內建功能，如對於連線、訂閱和釋出時的認證與許可權管理，支援使用資料橋接並搭配規則引擎進行資料整合轉化等。使用瀏覽器來快速便捷訪問的方式，為使用者使用 EMQX 進行更多物聯網業務開發提供了便利。

本文將帶領大家一睹新版 EMQX Dashboard 的全貌，透過對其重點功能的詳細解讀，幫助大家深入瞭解基於新版 Dashboard 的 EMQX 如何助力高效開發，同時還將帶大家快速上手使用這款強大的 [MQTT 伺服器](https://www.emqx.com/zh/mqtt/public-mqtt5-broker)管理控制檯。

## 全新面貌

### 全新 UI / UX 設計：實時可觀測性大幅提升

EMQX 5.0 的 Dashboard 使用了全新的 UI 設計風格。我們主要最佳化了各類頁面的樣式，增強了檢視資料的視覺化能力。透過更加突出的系統主題，以及支援明亮與暗黑風格主題的切換，將資料更加清晰地展示給使用者。

例如下圖中所示，我們將一些使用 EMQX 時的關鍵資料，如連線數訂閱數、訊息量、訊息速率和叢集狀態等，在首頁概覽中進行了視覺化圖表的實時展示。使用者可以在 Dashboard 內更加直觀地瞭解到當前系統叢集內的資料狀態變化。

[![MQTT Dashboard](http://img.blog.itpub.net/blog/2022/08/26/7a24954957e6ad9a.png?x-oss-process=style/bb "MQTT Dashboard")](https://www.emqx.com/zh/blog/an-easy-to-use-and-observable-mqtt-dashboard "MQTT Dashboard")

隨著 EMQX 5.0 單叢集 1 億連線的達成 ，EMQX Dashboard 的資料監控與分析檢視職能也配合著 EMQX 效能提升實現了同步升級：對於將整個叢集內的所有節點狀態資訊、連線、主題和訊息量資料，都能輕鬆描繪並展示，使用者也可以根據資料隨時間變化的統計圖來更加快速、可靠地訪問與檢視關鍵指標資料。

針對 UI / UX 設計的升級，除了豐富的樣式結構，還保持了功能的完整性和使用的簡易性。使用者除了可以透過使用基礎的 HTTP API、命令列工具和配置檔案等方法外，還能從帶有 GUI（圖形化介面）的人機互動中更好地瞭解和使用 EMQX，從而為其物聯網應用創造更大的價值。

### 選單結構最佳化：快速直達訪問內容

我們根據使用者普遍的使用順序和習慣對選單的功能分佈進行了重新規劃和整理，描繪出了這樣一個使用故事：

1. 使用者進入到 Dashboard 後首先需要透過`儀表板`首頁檢視使用資料，然後進行客戶端或裝置連線，實現`連線管理`、`主題訂閱`；
2. 驗證完成基本操作後，需要透過配置認證與許可權，進行`訪問控制`，以保證接入資料或使用的安全性；
3. 有了資料接入之後就可以進行`資料整合`，將其進行處理轉化後再分發到不同的業務資料系統中；
4. 此時使用者應該對 EMQX 使用已經有了基本瞭解，就可以對一些特定場景和需求進行`功能配置`，例如對於 MQTT 協議中的 Session 配置，保留訊息使用等；
5. 如果有更多不同的需求和應用場景，就可以透過`外掛擴充套件`使用閘道器擴充套件協議連線，使用外掛和 Hooks 來增強系統應用，以完成符合自己的業務需求的功能擴充套件；
6. 當然，在使用時難免會遇到一些問題，在`問題分析`中我們提供了日誌追蹤、慢訂閱查詢、主題監控和 WebSocket 客戶端等功能來發現追蹤並解決使用過程中的問題；
7. 此外，還可以透過`系統設定`進行中英多語言和系統主題色等的個性化設定，新增和管理不同的使用者來訪問和使用 EMQX Dashboard，申請使用 API 時的所需要的金鑰等功能。

[![EMQX Dashboard 選單](http://img.blog.itpub.net/blog/2022/08/26/131dab8379710f9a.jpeg?x-oss-process=style/bb "EMQX Dashboard 選單")](https://www.emqx.com/zh/blog/an-easy-to-use-and-observable-mqtt-dashboard "EMQX Dashboard 選單")

## 強大功能

新版 Dashboard 聚合了更多強大便捷的功能，包括認證與授權的線上管理、資料整合與 Flow 視覺化編排、各類擴充套件外掛，以及問題查詢分析工具等。使用者在一個 Dashboard 介面，就可以輕鬆完成開發過程中不同環節所需的工作。

### 資料監控與管理：重要資料一目瞭然

如前文所提到的，EMQX Dashboard 儀表盤首頁提供了執行中 EMQX 叢集連線數、訂閱主題數、訊息收發與訊息丟棄數量的檢視，同時也支援實時監控訊息流入流出速率，檢視一定時間範圍內的資料圖表和叢集中節點的拓撲圖顯示，點選每個節點則可以進一步檢視當前節點的一些基礎資訊。

在節點頁面，使用者可以檢視節點列表，瞭解當前節點的執行狀態、執行時長和記憶體使用資訊等，還可以點選節點名稱檢視更為詳細的節點資訊，用來監控節點的健康狀況；在指標頁面，使用者可以檢視叢集或每個節點下一些使用過程中的指標資料，包括針對連線、會話、認證授權與訊息收發流量等的統計資訊。這些均使使用者對於當前叢集節點的情況有了全面清晰的掌控。

[![MQTT 節點管理](http://img.blog.itpub.net/blog/2022/08/26/14c0a11db7de7738.png?x-oss-process=style/bb "MQTT 節點管理")](https://www.emqx.com/zh/blog/an-easy-to-use-and-observable-mqtt-dashboard "MQTT 節點管理")

除此之外，在連線管理頁面中為使用者提供了對於使用過程中連線到 EMQX 的客戶端或裝置的監控和管理功能，支援使用客戶端 ID、使用者名稱、節點等資訊來過濾出想要檢視的客戶端連線。點選客戶端 ID 可以進一步檢視連線詳情，包括連線狀態、連線時間、IP 地址、[Keep Alive](https://www.emqx.com/zh/blog/mqtt-keep-alive) 等客戶端資訊，以及當前客戶端的訂閱列表等。在訂閱主題列表中，可以檢視當前 EMQX 內所有的訂閱列表和主題列表。

> 注：訂閱列表是根據客戶端來區分的，而主題是當前所有已經訂閱過的主題，相同的主題可能包含在不同的客戶端。

[![MQTT 連線管理](http://img.blog.itpub.net/blog/2022/08/26/852c183355c32d33.png?x-oss-process=style/bb "MQTT 連線管理")](https://www.emqx.com/zh/blog/an-easy-to-use-and-observable-mqtt-dashboard "MQTT 連線管理")

### 視覺化管理訪問控制：開箱即用的認證授權管理

在最新版本中，使用者僅透過使用者介面，就可以快速實現客戶端認證授權機制的配置，無需編寫程式碼或手動編輯配置檔案，即可對接各類資料來源與認證服務，實現各個級別與各類場景下的安全配置，以更高的開發效率獲得更安全的保障。

認證方式支援選擇使用者名稱或客戶端 ID 加密碼認證、JWT 配置以及 [MQTT 5.0](https://www.emqx.com/zh/mqtt/mqtt5) 中的增強認證功能。認證資料來源資訊可以選擇 EMQX 的內建資料庫儲存和主流資料庫，如 MySQL、MongoDB、PostgreSQL、Redis，也可直接使用 HTTP 服務。

對於釋出和訂閱時的許可權校驗配置，支援在頁面內直接編輯 ACL 檔案，或使用內建資料庫，同樣也支援直接使用 MySQL、MongoDB、PostgreSQL 和 Redis 等主流資料庫來儲存和配置授權資訊。

詳情請檢視：[《靈活多樣認證授權，零開發投入保障 IoT 安全》](https://www.emqx.com/zh/blog/securing-the-iot)

[![MQTT 認證](http://img.blog.itpub.net/blog/2022/08/26/f80da1ff87d1e668.png?x-oss-process=style/bb "MQTT 認證")](https://www.emqx.com/zh/blog/an-easy-to-use-and-observable-mqtt-dashboard "MQTT 認證")

### 強大資料整合能力：Flow 視覺化編排與雙向資料橋接

作為 EMQX 為物聯網資料基礎設施構建提供的最重要能力之一，資料整合幫助使用者將所有的業務資料無需額外編寫程式碼即可快速完成處理與分發。

EMQX 5.0 還提供了資料整合視覺化檢視能力（Flows）。透過 Dashboard 頁面，使用者可以清晰看到 MQTT 資料是如何透過規則處理，以及資料如何流向外部資料服務或裝置。後續版本還將支援在 Dashboard 上以拖拽的方式編排規則和資料橋接（Flow Editor），透過視覺化介面將物聯網與硬體資料流輕鬆連線在一起。

詳情請檢視：[《全新物聯網資料整合：Flow 視覺化編排 & 雙向資料橋接》](https://www.emqx.com/zh/blog/iot-data-integration)

[![MQTT 視覺化](http://img.blog.itpub.net/blog/2022/08/26/67c33ca319b2a90e.png?x-oss-process=style/bb "MQTT 視覺化")](https://www.emqx.com/zh/blog/an-easy-to-use-and-observable-mqtt-dashboard "MQTT 視覺化")

### 線上配置更新：儲存即刻生效的配置熱更新

配置是使用 EMQX 的主要方法之一，相較於使用配置檔案來說，EMQX 5.0 中在使用者頁面內就能實現配置快速修改和儲存無疑是更加方便的。針對每一項配置均透過特定的選項或使用限制提供註解參考，有效使用互動來保證修改配置的正確性，滿足使用需求。

在功能配置頁面，我們提供了針對於監聽器的配置，使用者可以根據不同的網路環境埠修改等需求，新增不同型別的監聽器，或直接在原有內建的監聽器上進行修改。支援對於 MQTT 協議的相關配置，例如超時時間、最大報文大小、最大 QoS 等級、會話、保留訊息、系統主題等。還支援包括日誌資訊的相關配置修改和整合到外部監控服務的配置等。

[![MQTT 線上配置](http://img.blog.itpub.net/blog/2022/08/26/f173f19b302da826.png?x-oss-process=style/bb "MQTT 線上配置")](https://www.emqx.com/zh/blog/an-easy-to-use-and-observable-mqtt-dashboard "MQTT 線上配置")

### 自定義擴充套件能力：內建閘道器、外掛和 Hooks

在 EMQX 5.0 之前，非 MQTT 協議的接入分別由不同的接入外掛實現，這些外掛之間存在設計和實現上差異，對於部分使用者來說使用起來不是十分友好。 在 5.0 版本中，EMQX 為其定義了統一的概念和操作模型以降低使用難度。內建了 CoAP、ExProto、LwM2M、MQTT-SN 和 STOMP 協議連線的擴充套件，使用者只需要在 Dashboard 配置相關資訊，開啟即可以使用相應的客戶端透過以上協議連線到 EMQX。

同時新版 Dashborad 上還提供了各類自定義外掛安裝、配置鉤子（Hooks）攔截模組間的函式呼叫、訊息傳遞、事件傳遞來修改或擴充套件系統功能等。

[![MQTT 外掛](http://img.blog.itpub.net/blog/2022/08/26/a9c3a49a9e147e91.png?x-oss-process=style/bb "MQTT 外掛")](https://www.emqx.com/zh/blog/an-easy-to-use-and-observable-mqtt-dashboard "MQTT 外掛")

### 更加全面的診斷工具：及時發現問題並解決

在 EMQX 5.0 Dashboard 中，我們提供了一些除錯工具來幫助使用者除錯和排查使用時遇到的錯誤和問題，並讓使用者能夠最終解決問題。除了可以透過一個線上的 [MQTT over WebSocket](https://www.emqx.io/mqtt-client) 客戶端連線、釋出訂閱來除錯外，還支援使用如主題監控、慢訂閱查詢、線上日誌追蹤、檢視告警列表等方法。線上日誌追蹤可以針對指定 ClientID 或 Topic 或 IP 實時過濾日誌，透過 Dashboard 檢視實時日誌相比較於基於線上檢視日誌檔案更加方便和有效。慢訂閱查詢可以按照訊息傳輸的耗時，從高到低對訂閱者進行排名，點選慢的訂閱者的 Client ID 來顯示詳情後分析和查詢原因。

這些工具都可以有效幫助使用者診斷和除錯客戶端的不規則行為，從而避免或及時解決發現的錯誤與問題。

[![MQTT 伺服器日誌](http://img.blog.itpub.net/blog/2022/08/26/ec365c9d75cfac2a.png?x-oss-process=style/bb "MQTT 伺服器日誌")](https://www.emqx.com/zh/blog/an-easy-to-use-and-observable-mqtt-dashboard "MQTT 伺服器日誌")

## 簡單易用的 MQTT Dashboard

EMQX Dashboard 的訪問也非常簡單方便，支援在瀏覽器內訪問，預設監聽 18083 埠。只要成功安裝並部署好 EMQX，無論是什麼樣的作業系統和環境下，只要可以支援使用瀏覽器的，都可以透過開啟 [http://localhost:18083](http://localhost:18083/) 地址來訪問和使用 EMQX Dashboard。

> 注：如非本機部署的 EMQX，需要將 localhost 替換為實際的 IP 地址。

接下來我們將簡單演示一個使用 [MQTT 客戶端](https://mqttx.app/zh)連線到 EMQX 訂閱和釋出訊息後，在 Dashboard 中監控資料變化、檢視連線客戶端的例子，來幫助讀者對如何使用 EMQX Dashboard 進行 EMQX 的管理和監控有更加清晰的認識。

首次安裝和部署 EMQX 的使用者，瀏覽器開啟 Dashboard 後可以使用預設使用者名稱 `admin` 和預設密碼 `public` 來進行登入使用。

> 首次登入後，系統會自動檢測到您正在使用預設使用者名稱和密碼登入，並會強制要求修改預設密碼，這有利於訪問 Dashboard 的安全性提升，注意修改的密碼不能與原密碼相同，且不建議再次使用 public 做為登入密碼。

進入 EMQX Dashboard 頁面後，我們使用 [MQTT X 客戶端](https://mqttx.app/zh)工具來模擬和演示裝置連線到 EMQX。訂閱一個 `t/#` 的主題，傳送幾條訊息。

[![MQTT 客戶端](http://img.blog.itpub.net/blog/2022/08/26/03608424156c1d95.png?x-oss-process=style/bb "MQTT 客戶端")](https://www.emqx.com/zh/blog/an-easy-to-use-and-observable-mqtt-dashboard "MQTT 客戶端")

我們在概覽頁面就可以觀察到當前連線、主題和訊息等相關資料實時的發生了變化。

[![MQTT Dashboard1](http://img.blog.itpub.net/blog/2022/08/26/372b48d1bdad23ae.png?x-oss-process=style/bb "MQTT Dashboard1")](https://www.emqx.com/zh/blog/an-easy-to-use-and-observable-mqtt-dashboard "MQTT Dashboard1")

進入到左側選單中的連線管理，可以在該頁面下檢視到已經連線上來的客戶端列表資訊，包含連線時間、IP 地址、連線使用者名稱、連線狀態和心跳時間等，支援在列表中踢除連線，在列表頂部，可以針對連線資訊進行過濾查詢。點選客戶端 ID 進入到連線詳情，檢視更多關於連線資料的資訊，包括連線和會話時的資訊、收發流量統計、已訂閱的主題等。

[![MQTT 連線管理1](http://img.blog.itpub.net/blog/2022/08/26/a7859f4461ffcbce.png?x-oss-process=style/bb "MQTT 連線管理1")](https://www.emqx.com/zh/blog/an-easy-to-use-and-observable-mqtt-dashboard "MQTT 連線管理1")

進入到訂閱主題的管理頁面中，可以檢視到剛剛連線上來的客戶端的訂閱主題。

[![MQTT 訂閱管理](http://img.blog.itpub.net/blog/2022/08/26/288d1243340af7e2.png?x-oss-process=style/bb "MQTT 訂閱管理")](https://www.emqx.com/zh/blog/an-easy-to-use-and-observable-mqtt-dashboard "MQTT 訂閱管理")

## 結語

EMQX Dashboard 是基於 EMQX 所提供的強大且全面的 HTTP API 所構建、結合使用者使用習慣來設計與開發的一個 Web 應用，旨在幫助使用者更好地管理和使用 EMQX。雖然在不啟用 Dashboard 的情況下也可以正常體驗到 EMQX 的強大功能特性，但對於更習慣使用圖形化介面操作的使用者來說，Dashboard 提供了一種使用體驗更佳的使用選擇。

全新 EMQX 5.0 Dashboard 無論是在樣式互動還是功能特性方面的最佳化提升，都進一步加強了 EMQX 的易用性。對於資料的視覺化展現與監控管理能力、高效便捷的資料整合能力、靈活多樣的認證授權管理能力、滿足個性化需求的自定義擴充套件能力、對於問題故障的診斷能力…….使用者只需透過一個 Dashboard 即可「玩轉」EMQX 的諸多強大功能，輕鬆應對不同的場景下的各類業務需求，打造具有競爭力的物聯網平臺與應用。

>版權宣告： 本文為 EMQ 原創，轉載請註明出處。
>
>原文連結：[https://www.emqx.com/zh/blog/an-easy-to-use-and-observable-mqtt-dashboard](https://www.emqx.com/zh/blog/an-easy-to-use-and-observable-mqtt-dashboard)

易操作、可觀測的 MQTT Dashboard，叢集資料盡在掌握

相關文章