Chatzoraالوثائق
المطوّرون

SDK لـ React Native

اعرض مساعدك داخل تطبيق React Native أو Expo الخاص بك.

هذه الصفحة للمطوّرين الذين يبنون تطبيق الجوال الخاص بهم. للرد على العملاء من هاتفك، استخدم تطبيق Chatzora للجوال. راجع ردّ على العملاء بنفسك.

تعرض الحزمة @chatzora/react-native-sdk صفحة الدردشة المستضافة داخل عرض react-native-webview. وتعمل على iOS وAndroid.

التثبيت

npm install @chatzora/react-native-sdk react-native-webview

مع Expo، ثبّت WebView بمُثبّت Expo ليتوافق الإصدار مع SDK لديك:

npx expo install react-native-webview

الاستخدام

import React from 'react';
import { SafeAreaView, StyleSheet } from 'react-native';
import { ChatzoraWidget } from '@chatzora/react-native-sdk';

export default function ChatScreen() {
  return (
    <SafeAreaView style={styles.container}>
      <ChatzoraWidget
        agentId="YOUR_ASSISTANT_ID"
        apiBase="https://chatzora.com"
        themeColor="#10b981"
        dataTitle="Support"
      />
    </SafeAreaView>
  );
}

const styles = StyleSheet.create({
  container: { flex: 1 },
});

يمكنك نسخ هذا الكود مع معرّف مساعدك مُدخلًا من القنوات ← SDK للجوال.

الخصائص (Props)

الخاصيةالنوعمطلوبةالوصف
agentIdstringنعممعرّف مساعدك.
visitorIdstringلامعرّف ثابت للمستخدم، مثل معرّف عميلك. إذا تركته فارغًا تنشئ صفحة الدردشة واحدًا.
themeColorstringلايتجاوز لون السمة المحفوظ في لوحة التحكم، مثل #10b981.
dataTitlestringلايتجاوز عنوان الدردشة المحفوظ في لوحة التحكم.
apiBasestringلاعنوان Chatzora. الافتراضي https://chatzora.com.
styleViewStyleلانمط عرض الحاوية.
onClose() => voidلايُستدعى عندما يضغط المستخدم على زر الإغلاق في الدردشة.
onMessageReceived(event: WebViewMessageEvent) => voidلايتلقى الرسائل الأخرى التي ترسلها صفحة الدردشة، مثل رسائل الدردشة الجديدة. تُتجاهل الرسائل القادمة من مصادر أخرى.

يجب أن يكون مساعدك مفعّلًا لتعمل الدردشة. تظهر المحادثات القادمة من SDK في المحادثات وتُحتسب ضمن رسائلك الشهرية.