chat engine

Bekanntmachung von Abwertung

ChatEngine wurde ohne Pläne für zusätzliche Veröffentlichungen veraltet. Die Unterstützung für den ChatEngine SDK endet am 16. Juli 2021. Wenn Sie Fragen zu ChatEngine haben, kontaktieren Sie uns bitte unter [email protected]. Bitte besuchen Sie unser neueres Chat -Produkt Pubnub Chat.

Pubnub ChatEngine Framework

Pubnub ChatEngine ist ein objektorientiertes Ereignisemitterbasis-Framework zum Erstellen von Chat-Anwendungen in JavaScript. Es verkürzt die Zeit, um Chat -Anwendungen drastisch zu erstellen und bietet wesentliche Komponenten wie Tippindikatoren, Online -Präsenzüberwachung und Nachrichtenhistorie in der Box.

Die Echtzeit-Serverkomponente wird von Pubnub bereitgestellt. ChatEngine ist so konzipiert, dass sie erweiterbar ist und ein Plugin -Framework enthält, um neue Funktionen zu vereinfachen.

Weitere Informationen zum Erstellen von Chat -Anwendungen mit PubNub finden Sie in unserem Chat -Ressourcenzentrum.

Dokumentation

Die vollständigen Dokumente finden Sie auf der Dokumentations -Website.

Erste Schritte

Voraussetzungen

• Nodejs
• Twitter Bootstrap
• JQuery
• Es6

Pubnub -Konto eingerichtet

Um ChatEngine auf Pubnub einzurichten, muss man zuerst einen Pubnub -Schlüssel einrichten. In den folgenden Schritten wird beschrieben, wie man einen Pubnub-Schlüssel manuell eingerichtet hat, um mit Chatengine Client-Side-SDKs zu arbeiten.

Melden Sie sich für ein Pubnub -Konto an

Wenn Sie noch kein Konto haben, können Sie hier kostenlos kostenlos erstellen.

Richten Sie den REST -API -Dienst mithilfe von PubNub -Funktionen ein

Das ChatEngine Framework und das clientseitige SDKs interagieren mit einem REST-API-Dienst, der als Pubnub-Funktion ausgeführt wird.

Sie müssen die Funktion auf Ihrem Pubnub -Konto einrichten, bevor Sie die SDKs verwenden können.

Befolgen Sie die Anweisungen für ChatEngine Server -Setup.

Code herunterladen

Erstellen Sie ein neues NPM -Projekt

Da wir Abhängigkeiten installieren werden, ist es hilfreich, ein neues package.json zu erstellen. Json, um alle Pakete zu verfolgen, die wir installieren werden.

Führen Sie diesen Befehl in Ihrem Projektverzeichnis aus, um ein neues Paket zu erstellen. Vervollständigen Sie den interaktiven Einrichtungshandbuch und wir sind bereit zu gehen.

 npm init

Dadurch werden in Ihrem Projektverzeichnis ein package.json erstellt.

{
  "name" : " chat-engine-tutorial " ,
  "version" : " 0.0.1 " ,
  "description" : " An example PubNub ChatEngine Tutorial " ,
  "main" : " index.js " ,
  "author" : " Ian Jennings "
}

Installieren Sie Pubnub ChatEngine

Okay, jetzt für den Teil, den Sie wahrscheinlich noch nie gemacht haben! Installieren Sie Pubnub ChatEngine, indem Sie ausführen:

npm install chat-engine@latest --save

Zusätzliche Ressourcen

Plugins

Schauen Sie sich das JQuery -Spülbecken und das eckige Spülbecken an, um Plugins in Aktion zu sehen.

• Image Uploads - Verwendet UploadCare -Dienst, um Bilder hochzuladen und in Chats zu rendern. Beispiel.
• Markdown -Support - Markdown in HTML beim Empfangen von Nachrichten. Beispiel.
• Durch stumme Benutzer - ermöglicht es dem aktuellen Benutzer, den Empfang von Ereignissen von anderen Benutzern nicht mehr zu empfangen. Beispiel.
• Online -Benutzersuche - Eine einfache Möglichkeit, die Liste der Benutzer online im Chat zu durchsuchen. Beispiel.
• Eingabedikator - Bietet Komfortmethoden, die feuern, wenn ein Benutzer startet oder nicht mehr tippt. Beispiel
• Ungelesene Nachrichten - ermöglicht es Ihnen, einen Chat im Hintergrund zu markieren und einen Zähler zu erhöhen, wenn Ereignisse an ihn gesendet werden. Beispiel.
• Desktop -Benachrichtigungen - verwendet HTML5 -Benachrichtigungs -API, um "Toaster" -Andates zu senden.
• Emoji -Unterstützung - verwendet Bilder als Fallback für Geräte, die möglicherweise noch nicht unterstützt werden?
• Ereignisstatus und Lesebelege - gibt zusätzliche Ereignisse aus, wenn jemand eine empfängt und/oder eine Nachricht liest.
• Gravatar Support - verwendet den Gravatar -Service, um einen Avatar basierend auf den Informationen zu den Benutzerstatus zu erstellen.
• Zufällige Benutzernamen- Ein Plugin, das jedem Benutzer einen zufälligen Benutzernamen bietet, der Farbe und ein Tier kombiniert.

Videos

• Chatengine Intro
• 5 -minütiges Chatengine -Tutorial
• Chat in 30 Zeilen von Code -Webinar

Tutorials

JavaScript

• Erste Schritte Tutorial.
• Chat - wirklich einfaches Chat -Beispiel. Die "Hallo Welt" von Chatgine.
• Online -Liste - keine Chats, nur rendern, wer online ist. Sehen Sie die Spülen in den Küchen, um dies mit privaten Chats zu kombinieren.

React Native + Mobile React

• Reagieren Sie natives Beispiel-Hergestellt mit create-react-app .
• Reagieren Sie native Komponenten - Vorgefertigte Komponenten zum Rendern von Chats, Nachrichten, Benutzern und mehr.
• Integration in eine vorhandene iOS -App - Handbuch zum Hinzufügen von Chatengine React Native App in iOS.
• Integration in eine vorhandene Android -App - Handbuch zum Hinzufügen von Chatengine React Native App in Android.

Reagieren

• React - Bare Bones React Web Beispiel.

Vue

• Vue Guide - Leitfaden zur Verwendung von ChatEngine und Vue zusammen. Verwendet die folgenden Ressourcen.
• Vue -Beispiel - Vollständiges ChatEngine Vue -Beispiel.
• VUE -Plugin - Chatengine Plugin für Vue.

Eckig

• Angular Simple - Angular "Hello World" App. Einfache App, die ein benutzerdefiniertes Angular -Plugin verwendet, um zu rendern, wenn irgendetwas aktualisiert wird.
• Angular Kitchen Speek - die größte Demo -App da draußen, fast ein komplettes Desktop -Team -Chat -Klon (Slack, Stride, FlowDock). Persistente URLs und rendert zu einer echten Desktop -App mit Elektron!

JQuery

• JQuery Simple - JQuery ChatEngine "Hello World" App. Eine einfache App, in der alle miteinander chatten.
• JQuery Kitchen Speek - ein großes Beispiel, das die meisten Chatengine -Funktionen verwendet. Hat eine Online -Liste, die neue Chats hervorbringt, wenn Sie auf Benutzernamen klicken.

Authentifizierung der 3. Partei

• Facebook Login - Verwenden Sie Facebook -Profile mit ChatEngine.

NodeJS + Chatbot

• NodeJS -Chatbot - Ein Beispiel -Bot, der auf Nachrichten reagiert und das Tippen emuliert. Arbeitet standardmäßig mit dem Beispiel für JQuery Kitchen Spüle.

Entwicklung

Klonen

Klonrepos (Chat-Engine und Plugins).

Alle Repos sollten Geschwister voneinander sein. Dies ist erforderlich, um Dokumente ordnungsgemäß zu machen.

 chat-engine
chat-engine-desktop-notifications
chat-engine-emoji
chat-engine-examples
//...

Einrichten der Umgebung

 nvm use v6

Führen Sie http-server aus meinem /development aus, das alle Chat-Engine-Repos enthält:

cd chat-engine

node server.js

Laden Sie http: // localhost: 8080 im Browser und navigieren

Kompilieren

Führen Sie gulp aus, um zu kompilieren, aber Sie sollten wahrscheinlich gulp watch ausführen, um konsistente Änderungen zu erhalten.

Auslauftests

Sie müssen Umgebungsvariablen PUB_KEY_0 und SUB_KEY_0 zuweisen. Fügen Sie diese Variablen in Ihr .bashrc oder .zshrc hinzu.

 # pubnub chatengine keys
export PUB_KEY_0= " YOUR PUBNUB PUBLISH KEY "
export SUB_KEY_0= " YOUR PUBNUB SUBSCRIBE KEY "

Dann im Stammordnerlauf:

 gulp test

Veröffentlichen Sie einen Patch (Chat Engine und Plugins)

 npm version patch && git push origin master --tags

Unterstützung

• Wenn Sie Hilfe benötigen , eine allgemeine Frage haben oder einen Fehler einreichen, wenden Sie sich an [email protected]