如何使用 Twilio 在 React Native 中創建視頻諮詢醫療保健應用程序！

已發表: 2022-04-20

自從引入 mHealth 應用程序以來，醫療機構見證了患者與醫生的關係發生了翻天覆地的變化。現在，患者可以更好地控制他們的醫療決策，整個系統也變得更加以患者為中心。正因為如此，市場上出現了各種 mHealth 應用程序，視頻諮詢醫療保健應用程序就是這樣的創新之一。該應用程序使患者和醫生能夠在緊急情況下或無法訪問醫院時立即進行交流。醫生可以在線發送電子處方並提供醫療幫助。因此，擁有一個帶有視頻通話功能的在線醫療諮詢應用程序對於任何醫療機構甚至個人從業者來說總是一個有利可圖的決定。

所以，今天的主題是關於創建一個視頻諮詢醫療保健應用程序。我們將為此目的考慮 React Native 框架，因為 React Native 開發服務是開發類原生跨平台應用程序的完美選擇。此外，我們還將討論 Twilio 作為一個廣泛用於視頻通話應用程序的云通信平台。讓我們開始了解 Twilio 是什麼，然後了解創建應用程序的過程。

什麼是 Twilio？

Twilio 是美國基於雲的服務或云通信平台即服務 (CPaaS)。它充當強大的通信工具，彌合各種移動設備、其他系統、服務等與電話之間的差距。在 React Native 開發中，Twilio 提供的 API 使開發人員能夠實現多種通信服務，例如撥打和接收音頻/視頻電話、發送和接收短信等。這些服務還包括 AI 機器人、電子郵件等。在這個過程中，除了音頻/視頻通話外，還可以使用其他功能，例如帳戶恢復、電話驗證、應用內通話或應用內聊天等。

要將 Twilio 集成到應用程序中，React Native 開發人員將需要現有的 Cocoapods、React Native Navigation、React 等知識。Twilio

以下是使用 Twilio 的一些主要好處

Twilio 很容易學習，因此有大量的開發人員可用。
它遵循標準的通信方法：HTTP。
在技術之間切換也容易得多。
由於平台即服務 (PaaS)，資本成本略低。甚至部署成本更低，並且隨著公司的發展而逐漸增加。

使用 Twilio WebRTC 創建帶有視頻諮詢的 React Native Healthcare 應用程序的關鍵步驟

在將 Twilio WebRTC 用於醫療保健視頻通話應用程序時，React Native 應用程序開發公司應遵循下面給出的分步程序。這個過程分為兩個主要部分，第一部分是關於使用 Twilio 生成令牌，第二部分是關於使用 React Native 入門工具包安裝依賴項。此外，我們現在將考慮一個 React Native Android 應用程序。那麼讓我們從第一部分開始吧。

第 1 部分：使用 Twilio 生成令牌

Twilio 提供 IOS/Android SDK 和 JavaScript。但是對於 React Native，Twilio 不提供任何直接支持。因此，React Native 開發人員可以將 JavaScript SDK 用於一些服務，但對於其他服務則不可能，因為它在很大程度上依賴於瀏覽器 API。還有另一種選擇，那就是將原生 Android/IOS SDK 移植到 React Native。所以在這裡，我們使用了這個組合：Twilio Video (WebRTC) for React Native。

首先，在 https://www.twilio.com/ 上創建一個帳戶。註冊試用並驗證您的憑據，例如電話號碼、電子郵件等。您現在將被定向到儀表板。

您將需要一個 ACCOUNT SID 以及一個 API 密鑰和一個用於生成令牌的密鑰。要生成 API 密鑰，請通過設置導航到 API 密鑰。此處創建 API 密鑰將提供 Secret 密鑰和 API 密鑰。現在可以通過使用 npm 包的 npm install 來生成令牌。令牌也可以用多種語言生成。應該為每個令牌更改身份值，因為不能在不同的地方使用相同的令牌。

還有另一種使用 Twilio 工具創建令牌的方法。單擊 Twilio 工具並寫下身份和房間名稱。這將生成訪問令牌。安全地保存這些密鑰以備後用。

視頻諮詢醫療保健應用程序的 Twilio 部分到此結束。現在讓我們從 React Native 開發部分開始。

第 2 部分：使用 React Native Starter Kit 安裝依賴項

在這裡，我們將使用可以從 GitHub 鏈接複製的 React Native 入門工具包 — https://github.com/flatlogic/react-native-starter。您需要在終端項目目錄中運行命令-“npm install https://github.com/blackuy/react-native-twilio-video-webrtc –save”，然後在App.js文件中編寫所需的代碼。

確保通過在項目目錄中執行命令“npm install”來安裝所有必需的依賴項。此外，您需要進行一些配置以使用 Twilio，還需要使用音頻、攝像頭等。

要製作 goto Android 文件夾，您應該在 settings.gradle 文件中添加以下代碼行 -

包括'：react-native-twilio-video-webrtc'

項目（'：react-native-twilio-video-webrtc'）.projectDir = 新文件（rootProject.projectDir，'../node_modules/react-native-twilio-video-webrtc/android'）

現在，轉到 Android > app > build.gradle 文件並蒐索依賴項。之後，在塊中添加下面提到的代碼。

編譯項目（'：react-native-twilio-video-webrtc'）

另外，在 Android > app >SRC> main >JAVA> com > reactnativestarter > MainApplication.java 中添加下面提到的代碼

導入 com.twiliorn.library.TwilioPackage；

在此之後，將 getPackages() 方法替換為所需的代碼。

現在為了向用戶請求權限，必須通過在此文件中添加所需的代碼來修改 AndroidManifest.xml。還要確保在您的 Twilio 帳戶中啟用了客戶端房間創建。

運行應用程序

最後，當所有步驟都實現並執行代碼時，通過從終端窗口執行命令“react-native run-android”來運行您的 React Native 醫療保健應用程序。

最終判決

在這裡，我們開發了一個簡單的 React Native 應用程序來演示 Twilio 的視頻通話功能。但我們只需要記住，用戶連接、用戶訪問令牌生成、房間創建等一些事情必須在後端非常勤奮地處理。

如上所述，您想在 React Native 中使用 Twilio 實現開發視頻諮詢醫療保健應用程序嗎？我們希望上述步驟對 React Native 開發者有所幫助。如需在創建定制的醫生點播視頻諮詢醫療保健應用程序方面的任何技術援助，請聯繫 Biz4Solutions，這是一家在該領域擁有 11 年以上經驗的高度熟練的醫療保健應用程序開發公司。