stream chat js

JavaScript SDK الرسمية للدردشة المباشرة

عميل JavaScript API الرسمي لـ Stream Chat، وهي خدمة لإنشاء تطبيقات الدردشة.
استكشاف المستندات »

الإبلاغ عن الأخطاء · ميزة الطلب

حول ستريم

يمكنك التسجيل للحصول على حساب Stream من خلال صفحة البدء.

يمكن استخدام هذه المكتبة من خلال تطبيقات الواجهة الأمامية والخلفية. بالنسبة للواجهة الأمامية، لدينا أطر عمل تعتمد على هذه المكتبة مثل Flutter وReact وAngular SDKs. لمزيد من المعلومات، راجع مستنداتنا.

تثبيت

الآلية الوقائية الوطنية

npm install stream-chat

غزل

yarn add stream-chat

تسليم شبيبة

 < script src =" https://cdn.jsdelivr.net/npm/stream-chat " > </ script > 

ابدء

تم إعداد عميل StreamChat للسماح بتوسيع الأنواع الأساسية من خلال استخدام الأدوية العامة عند إنشاء مثيل لها. تم تعيين كافة الأدوية العامة على Record<string, unknown> .

 import { StreamChat } from 'stream-chat' ;
// Or if you are on commonjs
const StreamChat = require ( 'stream-chat' ) . StreamChat ;

const client = StreamChat . getInstance ( 'YOUR_API_KEY' , 'API_KEY_SECRET' ) ;

const channel = client . channel ( 'messaging' , 'TestChannel' ) ;
await channel . create ( ) ;

أو يمكنك تخصيص الأدوية العامة:

 type ChatChannel = { image : string ; category ?: string } ;
type ChatUser1 = { nickname : string ; age : number ; admin ?: boolean } ;
type ChatUser2 = { nickname : string ; avatar ?: string } ;
type UserMessage = { country ?: string } ;
type AdminMessage = { priorityLevel : number } ;
type ChatAttachment = { originalURL ?: string } ;
type CustomReaction = { size ?: number } ;
type ChatEvent = { quitChannel ?: boolean } ;
type CustomCommands = 'giphy' ;

type StreamType = {
  attachmentType : ChatAttachment ;
  channelType : ChatChannel ;
  commandType : CustomCommands ;
  eventType : ChatEvent ;
  messageType : UserMessage | AdminMessage ;
  reactionType : CustomReaction ;
  userType : ChatUser1 | ChatUser2 ;
} ;

const client = StreamChat . getInstance < StreamType > ( 'YOUR_API_KEY' , 'API_KEY_SECRET' ) ;

// Create channel
const channel = client . channel ( 'messaging' , 'TestChannel' ) ;
await channel . create ( ) ;

// Create user
await client . upsertUser ( {
  id : 'vishal-1' ,
  name : 'Vishal' ,
} ) ;

// Send message
const { message } = await channel . sendMessage ( { text : `Test message` } ) ;

// Send reaction
await channel . sendReaction ( message . id , { type : 'love' , user : { id : 'vishal-1' } } ) ;

ستنتقل الأنواع المخصصة المقدمة عند تهيئة العميل إلى كافة مرتجعات العميل وستوفر ذكاءً للاستعلامات.

؟ (اختياري) إعداد التطوير بالاشتراك مع مجموعات تطوير البرامج (SDK) الخاصة بنا

اتصل بـ Stream Chat React Native SDK

تشغيل في جذر هذا الريبو

yarn link

قم بالتشغيل في جذر أحد التطبيقات النموذجية (SampleApp/TypeScriptMessaging) في مستودع stream-chat-react-native

yarn link stream-chat
yarn start

افتح ملف metro.config.js وقم بتعيين القيمة لـ watchFolders كـ

 const streamChatRoot = '{{CHANGE_TO_THE_PATH_TO_YOUR_PROJECT}}/stream-chat-js'

module . exports = {
  // the rest of the metro config goes here
  ...
  watchFolders : [ projectRoot ] . concat ( alternateRoots ) . concat ( [ streamChatRoot ] ) ,
  resolver : {
    // the other resolver configurations go here
    ...
    extraNodeModules : {
      // the other extra node modules go here
      ...
      'stream-chat' : streamChatRoot
    }
  }
} ;

تأكد من استبدال {{CHANGE_TO_THE_PATH_TO_YOUR_PROJECT}} بالمسار الصحيح لمجلد stream-chat-js وفقًا لبنية الدليل الخاص بك.

تشغيل في جذر هذا الريبو

yarn start

المزيد من أمثلة التعليمات البرمجية

توجه إلى docs/typescript.md لمزيد من الأمثلة.

✍️ المساهمة

نحن نرحب بتغييرات التعليمات البرمجية التي تعمل على تحسين هذه المكتبة أو حل مشكلة ما، يرجى التأكد من اتباع أفضل الممارسات وإضافة الاختبارات إن أمكن قبل إرسال طلب السحب على Github. يسعدنا جدًا دمج الكود الخاص بك في المستودع الرسمي. تأكد من توقيع اتفاقية ترخيص المساهم (CLA) أولاً. راجع ملف الترخيص الخاص بنا لمزيد من التفاصيل.

توجه إلى CONTRIBUTING.md للحصول على بعض النصائح التطويرية.

‍ نحن نقوم بالتوظيف!

لقد أنهينا مؤخرًا جولة تمويل من السلسلة B بقيمة 38 مليون دولار ونواصل النمو بنشاط. يتم استخدام واجهات برمجة التطبيقات الخاصة بنا من قبل أكثر من مليار مستخدم نهائي، وستكون لديك فرصة لإحداث تأثير كبير على المنتج ضمن فريق من أقوى المهندسين في جميع أنحاء العالم.

تحقق من الفتحات الحالية لدينا وتقدم بطلب عبر موقع Stream الإلكتروني.