在本教程中，我們將使用Capacitor 6、Angular和TypeScript構(gòu)建一個Android應(yīng)用程序，該應(yīng)用程序通過串行端口連接到BleuIO USB加密狗。該應(yīng)用程序允許用戶直接從Android設(shè)備發(fā)送和接收AT命令來配置和與BLE(低功耗藍(lán)牙)設(shè)備交互。

BleuIO是一個功能強大的BLE USB加密狗，可以與藍(lán)牙設(shè)備進(jìn)行通信，使其成為開發(fā)、調(diào)試和測試BLE應(yīng)用程序的絕佳工具。通過本項目，我們可以使用Android設(shè)備通過串行連接向BleuIO發(fā)送AT命令，從而可以在不需要PC的情況下配置和管理BLE操作。這個項目既適用于BleuIO和BleuIO Pro

為什么要使用電容器、Angular和TypeScript?

該項目是使用Capacitor 6構(gòu)建的，它提供了對本地設(shè)備功能的無縫訪問，包括USB串行通信。選擇Angular是因為它的結(jié)構(gòu)化方法，而TypeScript確保了類型安全性和更好的可維護(hù)性。

電容插件允許我們與USB設(shè)備等硬件進(jìn)行通信，在本項目中，我們使用@adeunis/ Capacitor -serial插件與BleuIO加密狗建立串行通信。

項目的特性

?在Android設(shè)備上與BleuIO建立串口連接。

?向BleuIO發(fā)送AT命令并讀取響應(yīng)。

?直接從安卓應(yīng)用掃描附近的BLE設(shè)備。

?為了可擴(kuò)展性和可維護(hù)性，使用Angular + TypeScript構(gòu)建。

?使用電容6進(jìn)行直接硬件交互。

先決條件

在啟動之前，請確保安裝了以下組件：

?node . js 18 +

?Angular命令行(npm install -g @angular/ CLI)

?電容命令行(npm install -g @capacitor/ CLI)

?Java 17(需要電容器6)

?AndroidStudio

?支持OTG的Android設(shè)備

?BleuIO USB適配器

?OTG電纜(將BleuIO連接到您的Android設(shè)備)

克隆存儲庫和設(shè)置項目

1. 克隆存儲庫

首先，克隆GitHub存儲庫并導(dǎo)航到項目文件夾：

2. 安裝依賴關(guān)系

運行以下命令安裝所有需要的依賴項：

3. 構(gòu)建Angular應(yīng)用

接下來，為生產(chǎn)環(huán)境構(gòu)建Angular應(yīng)用：

4. 同步與電容器的Android

構(gòu)建完Angular應(yīng)用后，我們需要將它與Capacitor同步，這樣它才能在Android設(shè)備上運行：

5. 在Android Studio中打開Project

要在Android Studio中啟動項目，運行：

6. 在Android設(shè)備上運行應(yīng)用程序

?通過USB連接您的Android設(shè)備。

?在“開發(fā)者選項”中打開USB調(diào)試開關(guān)。

?單擊Android Studio中的Run來安裝和啟動應(yīng)用程序。

使用應(yīng)用程序

1. 連接BleuIO

?按Connect to BleuIO按鈕。

?該應(yīng)用程序?qū)锽leuIO請求USB權(quán)限。

?一旦獲得授權(quán)，就會建立一個串行連接。

2. 發(fā)送AT命令

?按發(fā)送ATI命令按鈕。

?該命令從BleuIO中檢索設(shè)備信息。

?響應(yīng)將顯示在屏幕上。

3. 掃描BLE設(shè)備

?按掃描BLE設(shè)備按鈕。

?這將發(fā)送AT+CENTRAL命令，然后是AT+GAPSCAN=3。

?將顯示附近的BLE設(shè)備列表。

了解守則

1. 串行服務(wù)(處理與BleuIO通信)

SerialService處理與BleuIO的串行通信。它請求USB權(quán)限，打開連接，發(fā)送AT命令，并處理響應(yīng)。

關(guān)鍵方法

?connectToSerial()：請求OTG權(quán)限，建立串行連接，并偵聽傳入的數(shù)據(jù)。

?sendATCommand()：發(fā)送AT命令并處理響應(yīng)。

?scanBLEDevices()：發(fā)送BLE掃描命令并顯示掃描到的設(shè)備。

2. App組件(用戶界面邏輯)

AppComponent將UI與SerialService連接起來，以處理用戶交互。

關(guān)鍵特性

?當(dāng)用戶單擊Connect to BleuIO時調(diào)用connectToSerial()。

?當(dāng)用戶單擊發(fā)送ATI命令時調(diào)用sendATCommand()。

?當(dāng)用戶單擊Scan BLEDevices時調(diào)用scanBLEDevices()。

3. UI (HTML和樣式)

該應(yīng)用程序提供了三個按鈕：

響應(yīng)區(qū)域是動態(tài)更新的：

故障處理及常見問題

1. USB權(quán)限拒絕

?確保在提示時授予權(quán)限。

?如果問題仍然存在，請檢查Android設(shè)備上的OTG支持。

2. 應(yīng)用程序不檢測藍(lán)光

?檢查OTG線纜是否連接正確。

?確保您的Android設(shè)備能夠識別BleuIO加密狗。

3. npx cap sync android失敗

?確保安裝了Android Studio和Java 17。

?再次運行npm install，確保所有依賴項都已安裝。

輸出

源代碼

源代碼可在此GitHub存儲庫。

這個項目演示了如何在Android設(shè)備上使用電容器6、Angular和TypeScript與BleuIO進(jìn)行連接和通信。通過利用@adeunis/capacitor-serial插件，我們可以發(fā)送AT命令，檢索設(shè)備信息，甚至直接從Android應(yīng)用程序掃描BLE設(shè)備。

在此基礎(chǔ)上，開發(fā)人員可以通過添加自定義AT命令、集成數(shù)據(jù)記錄，甚至構(gòu)建更高級的BLE應(yīng)用程序來擴(kuò)展應(yīng)用程序。完整的源代碼可以在GitHub上獲得，以進(jìn)行進(jìn)一步的定制和增強。

本文編譯自hackster.io