原始碼開放:WebSocket應用示例

电子老师傅發表於2024-11-08
1 WebSocket概述

WebSocket是HTML5下一種新的協議(本質上是一個基於TCP的協議),它實現了瀏覽器與伺服器之間的全雙工通訊,能夠節省伺服器資源和頻寬,達到實時通訊的目的。WebSocket協議透過握手機制,允許客戶端和伺服器之間建立一個類似TCP的連線,從而方便它們之間的通訊。

  • 線上聊天應用:允許使用者實時傳送和接收訊息,而無需頁面重新整理或輪詢伺服器。

  • 實時協作應用:支援多使用者實時編輯文件或共享白板等場景。

  • 實時遊戲:允許多個玩家之間進行實時的遊戲互動。

  • 實時資料展示:用於顯示實時資料,如股票市場變化、天氣預報更新等。

  • 實時通知和提醒:用於向使用者傳送實時的通知訊息,如新郵件提醒、社交媒體通知等。

  • 線上會議和視訊通話:支援實時的音影片通訊。

2 準備硬體環境

“古人云:‘工欲善其事,必先利其器。’在深入介紹本功能示例之前,我們首先需要確保以下硬體環境的準備工作已經完成。”

2.1 Air780E開發板

本demo使用的是Air780E核心板。

2.2 PC電腦

請準備一臺配備USB介面且能夠正常上網的電腦。

2.3 SIM卡

請準備一張可正常上網的SIM卡,該卡可以是物聯網路卡或您的個人手機卡。

特別提醒:請確保SIM卡未欠費且網路功能正常,以便順利進行後續操作。

2.4 資料通訊線

請準備一根用於連線Air780E開發板和PC電腦的資料線,該資料線將實現業務邏輯的控制與互動。您有兩種選擇:

  • USB資料線(其一端為Type-C介面,用於連線Air780E開發板)。通常,這種資料線的外觀如下示意圖所示:

圖片

普通的手機USB資料線一般都可以直接使用;

  • 資料線是USB轉TTL串列埠線。通常,這種資料線的外觀如下示意圖所示:

圖片

在本教程中,我們將採用以下資料線配置進行測試和資料檢視:

  • 第一種:USB資料線:此資料線不僅用於為測試板供電,還用於檢視資料日誌。其一端為Type-C介面,連線Air780E開發板;另一端為標準USB介面,連線PC電腦。

  • 第二種:USB轉TTL串列埠線:此資料線主要用於Websocket-UART透傳資料的檢視。其一端為USB介面,連線PC電腦;另一端為TTL串列埠介面,連線Air780E開發板,以便進行串列埠通訊和資料傳輸。

2.5 組裝硬體環境

2.5.1 請按照SIM卡槽上的指示方向正確插入SIM卡,務必確保插入方向正確,避免插反導致損壞!

通常,插入SIM卡的步驟如下:

  • 將SIM卡的金屬接觸面朝下,對準卡槽的開口。

  • 用力平穩地將SIM卡推入卡槽,直至聽到“咔嚓”一聲,表示SIM卡已正確安裝到位。

圖片圖片

2.5.2 USB資料線,連線電腦和Air780E開發板,如下圖所示:

圖片

3
準備軟體環境

“凡事預則立,不預則廢。”在詳細闡述本功能示例之前,我們需先精心籌備好以下軟體環境。

3.1 Luatools工具

要想燒錄AT韌體到4G模組中,需要用到合宙的強大的除錯工具:Luatools;

Luatools工具集具備以下幾大核心功能:

  • 一鍵獲取最新韌體:自動連線合宙伺服器,輕鬆下載最新的合宙模組韌體。

  • 韌體與指令碼燒錄:便捷地將韌體及指令碼檔案燒錄至目標模組中。

  • 串列埠日誌管理:實時檢視模組透過串列埠輸出的日誌資訊,並支援儲存功能。

  • 串列埠除錯助手:提供簡潔的串列埠除錯介面,滿足基本的串列埠通訊測試需求。

Luatools下載之後,無需安裝,解壓到你的硬碟,點選Luatools_v3.exe執行,出現如下介面,就代表Luatools安裝成功了:

圖片

3.2 燒錄程式碼

首先要說明一點:指令碼程式碼,要和韌體的LuatOS-SoC_V1112_EC618_FULL.soc檔案一起燒錄。

整體壓縮檔案:內含有檔案一:Core韌體和檔案二:WebSocket加密通訊指令碼檔案,檔案三:WebSocket-UART透傳指令碼檔案,如圖所示。

圖片

3.2.1 壓縮檔案:

閱讀原文下載完整壓縮檔案包:
https://docs.openluat.com/air780e/luatos/app/socket/websocket/

3.2.2 壓縮包內部檔案

檔案一:Core韌體

檔案二:WebSocket加密通訊指令碼檔案

檔案三:WebSocket-UART透傳指令碼檔案

3.2.3 找到燒錄的韌體檔案

https://docs.openluat.com/air780e/luatos/app/socket/websocket/

圖片

3.2.4 正確連線電腦和4G模組電路板

使用帶有資料通訊功能的資料線,不要使用僅有充電功能的資料線;

3.2.5 識別4G模組的boot引腳

在下載之前,要用模組的boot引腳觸發下載,也就是說,要把4G模組的boot引腳拉到1.8v,或者直接把boot引腳和VDD_EXT引腳相連。我們要在按下BOOT按鍵時讓模組開機,就可以進入下載模式了。

具體到Air780E開發板,

  • 當我們模組沒開機時,按著BOOT鍵然後長按POW開機。

  • 當我們模組開機時,按著BOOT鍵然後點按重啟鍵即可。

圖片

3.2.6 識別電腦的正確埠

判斷是否進入BOOT模式:-模組上電,此時在電腦的裝置管理器中,檢視串列埠裝置,如下圖:

圖片

進入boot下載模式,如下圖所示:

圖片

這時候,硬體連線上就緒狀態,恭喜你,可以進行燒錄了!

3.2.7 新建專案

首先,確保你的Luatools的版本大於或者等於3.0.6版本.

在Luatools的左上角上有版本顯示的,如圖所示:

圖片

Luatools版本沒問題的話,就點選Luatools右上角的“專案管理測試”按鈕,如下圖所示:

圖片

這時會彈出專案管理和燒錄管理的對話方塊,如下圖:

圖片

3.2.8 開始燒錄

選擇780E板子對應的底層core和剛改的main.lua指令碼檔案。下載到板子中。

圖片

圖片

點選下載後,我們需要進入boot模式才能正常下載。

圖片

3.3 PC端串列埠工具

閱讀原文下載:
https://docs.openluat.com/air780e/luatos/app/socket/websocket/

  • 串列埠接線方式:Air780提供三個Uart.

MAIN_UART:通用串列埠,可用於AT命令和資料傳輸最大波特率921600bps,預設波特率自適應9600-115200bps支援硬體流控(RTS/CTS)

AUX_UART:通用串列埠

DBG_UART:用於輸出除錯資訊

圖片

注意:

  • 以上PinOut圖示,對應的V1.8的開發板,版本號在板子絲印上可查閱。

  • V1.4的開發板,由於LCD腳有差異,圖示的LCD_RS/LCD_CLK實際位於開發板管腳編號06/05的UART2/AUX_UART腳,不在編號11/14腳。

  • V1.8的開發板17腳改為VBAT.

3.3.1 LLCOM工具設定:初始配置

圖片

3.3.2 資料傳送前的配置

圖片

4 WebSocket加密通訊的概述

本小節教你怎麼使用luatos指令碼語言,就可以讓合宙4G模組連線上一個WebSocket伺服器,並且模組和伺服器之間實現資料的互動!

4.1 本教程實現的功能定義:

  • 4G模組插卡開機後,連線上WebSocket伺服器;

  • 這是個測試服務,當4G模組傳送的是json,且action=echo,就會回顯所傳送的內容

  • 傳送內容是

    wsc:send((json.encode({action="echo",msg=os.date()})))

4.2 文章內容引用

  • 780E開發板軟硬體資料:Air780E產品手冊

  • websocket函式介面不做詳細介紹,可透過此連結檢視具體介紹:websocket-網路介面-LuatOS文件

4.3 核心指令碼程式碼詳解

4.3.1 websocket客戶端建立

圖片

4.3.2 設定額外的headers

圖片

4.3.3 設定自動重連機制

圖片

4.3.4 註冊websocket回撥

圖片

4.3.5 連線伺服器

圖片

4.3.6 釋出訊息

圖片

4.3.7 websocket客戶端關閉(關閉後資源釋放無法再使用)

wsc:close()

4.4 成果演示與深度解析:影片+圖文全面展示

4.4.1 成果執行精彩呈現

圖片

4.4.2 演示影片生動展示

4.4.3 完整例項深度剖析

圖片

5 WebSocket-UART透傳的概述

在某些應用場景下,可能需要將WebSocket接收到的資料透過UART串列埠傳送到其他裝置,或者將UART串列埠接收到的資料透過WebSocket傳送到伺服器。這通常需要透過一箇中間層或閘道器裝置來實現資料的轉換和傳輸。

5.1 本教程實現的功能定義:

  • 4G模組插卡開機後,連線上WebSocket伺服器;

  • 本小節教你怎麼使用luatos指令碼語言,就可以讓合宙4G模組透過Uart1透傳資料傳送到WebSocket伺服器,並且模組和伺服器之間實現資料的互動!

5.2 文章內容引用

  • 780E開發板軟硬體資料:Air780E產品手冊

  • websocket函式介面不做詳細介紹,可透過此連結檢視具體介紹:websocket-網路介面-LuatOS文件

5.3 核心指令碼程式碼詳解

5.3.1 websocket客戶端建立

圖片

5.3.2 設定額外的headers

圖片

5.3.3 設定自動重連機制

圖片

5.3.4 註冊websocket回撥

圖片

5.3.5 連線伺服器

圖片

5.3.6 串列埠初始化

本文示例:串列埠使用MAIN_UART(uart1)

圖片

5.3.7 接收UART訊息

圖片

5.3.8 釋出訊息

圖片

5.3.9 websocket客戶端關閉(關閉後資源釋放無法再使用)

圖片

5.4 成果演示與深度解析:影片+圖文全面展示

5.4.1 成果執行精彩呈現

圖片

5.4.2 完整例項深度剖析

圖片

6 總結
  • WebSocket加密確保了資料在傳輸過程中的安全性,防止被竊取或篡改;而WebSocket透傳則指資料在不改變內容的情況下,透過WebSocket協議進行傳輸,通常涉及中間層或閘道器裝置的資料格式轉換與傳遞

  • Air780E作為一款4G模組,支援WebSocket協議,並可透過Luatools等工具進行除錯和韌體管理。在Air780E上實現WebSocket加密通訊,通常需要使用SSL/TLS等加密協議來確保資料傳輸的安全性。

7 常見問題
  • websocket伺服器的連線地址,格式為ws(或wss)://xxx開頭

  • websocket需要在任務中啟動,帶自動重連,支援心跳協議

  • websocket心跳包,建議180秒

  • 注意串列埠傳送過去的資料是字元格式,這裡進行對比時注意echo的型別ifuart_rx_buff_data=='"echo"'

8 擴充套件

在WebSocket中,WS和WSS代表兩種不同的連線型別,它們分別具有以下特點:

8.1 WSS(WebSocketSecure)

  • 含義:表示安全的WebSocket連線,即在TLS(傳輸層安全協議)之上的WebSocket通訊。WSS相當於HTTPS在WebSocket中的應用,提供了資料加密和完整性驗證等安全功能。

  • 埠:預設情況下,WSS協議使用443埠,這是大多數網站用於HTTPS通訊的標準埠。

  • 使用場景:適用於需要保護通訊內容、防止資料竊取或篡改的場景。WSS是處理敏感資料或進行安全通訊時的推薦選擇。

8.2 WS(WebSocket)

  • 含義:表示非安全的WebSocket連線,即沒有加密的WebSocket通訊。

  • 埠:預設情況下,WebSocket的WS協議使用80埠。

  • 使用場景:適用於不需要資料加密的場景,或者在安全性要求不高的環境中使用。然而,對於敏感資料或需要保護通訊內容的情況,WS可能不是最佳選擇。

相關文章