Gunakan SDK Obrolan dengan React Native

Artikel ini menjelaskan cara menyiapkan paket di Azure Communication Services Chat JavaScript SDK untuk mendukung obrolan di aplikasi React Native Anda. Langkah-langkah berikut berfungsi untuk Azure Communication Services JavaScript Chat SDK 1.1.1 dan yang lebih baru.

Menyiapkan paket obrolan agar berfungsi dengan React Native

Saat ini, paket obrolan Communication Services tersedia sebagai paket Node. Karena tidak semua modul Node kompatibel dengan React Native, modul memerlukan port React Native untuk berfungsi.

Setelah Menginisialisasi proyek React Native, selesaikan langkah-langkah berikut untuk bekerja @azure/communication-chat dengan React Native. Selesaikan langkah-langkah berikut untuk menginstal paket yang berisi port React Native dari modul Node Core yang diperlukan di @azure/communication-chat.

1. Instalasi node-libs-react-native:

   npm install node-libs-react-native --save-dev
   

2. Instalasi stream-browserify:

   npm install stream-browserify --save-dev
   

3. Instalasi react-native-get-random-values:

   npm install react-native-get-random-values --save-dev
   

4. Instalasi react-native-url-polyfill:

   npm install react-native-url-polyfill --save-dev
   

5. Perbarui metro.config.js untuk menggunakan modul Node Core yang kompatibel dengan React Native:

   module.exports = {
       // ...
       resolver: {
           extraNodeModules: {
               ...require('stream-browserify'),
               ...require('node-libs-react-native'),
               net: require.resolve('node-libs-react-native/mock/net'),
               tls: require.resolve('node-libs-react-native/mock/tls')
       }
   };
   }
   

6. Tambahkan perintah berikut import di bagian atas file titik masuk Anda:

   import 'node-libs-react-native/globals';
   import 'react-native-get-random-values';
   import 'react-native-url-polyfill/auto';
   

7. Instal paket Layanan Komunikasi:

   npm install @azure/communication-common@1.1.0 --save
   
   npm install @azure/communication-signaling@1.0.0-beta.11 --save
   
   npm install @azure/communication-chat@1.1.1 --save
   

Langkah berikutnya

Artikel ini menjelaskan cara menyiapkan paket Communication Services yang diperlukan untuk menambahkan obrolan ke aplikasi Anda di lingkungan React Native.

Pelajari cara menggunakan Chat SDK untuk memulai obrolan.