The QuickBlox Developer Hub

Welcome to the QuickBlox developer hub. You'll find comprehensive guides and documentation to help you start working with QuickBlox as quickly as possible, as well as support if you get stuck. Let's jump right in!

Get Started    

This is our new documentation for beta version of QuickBlox React Native SDK. Please contact our Customer Support Team to provide your feedback, suggestions, and requests to improve this page.

Follow the instructions below to ensure that QuickBlox SDK runs smoothly with your app.

Minimum system requirements

  • iOS 10
  • Android (minimum SDK version 14)
  • React Native (minimum version 0.60)

Create a new app in the Dashboard

QuickBlox application includes everything that brings messaging right into your application - chat, video calling, users, push notifications, etc. To create a QuickBlox application, follow the steps below:

  1. Register a new account following this link. Type in your email and password to sign in. You can also sign in with your Google or Github accounts.
  2. Create the app clicking New app button.
  3. Configure the app. Type in the information about your organization into corresponding fields and click Add button.
  4. Go to Dashboard => Overview => Credentials groupbox and copy your Application ID, Authorization Key, and Authorization Secret.
  5. Get Account Key following Dashboard => Privacy and Settings direction and copy the Account Key value.

Install QuickBlox SDK into your app

Note

To manage project dependencies:

  1. Node.js and npm must be installed
  2. CocoaPods must be installed for iOS.

To connect QuickBlox to your app just add it into your project's dependencies by running following code sample in terminal (in your react-native app):

npm install quickblox-react-native-sdk --save

iOS and Android have different dependencies systems. For that reason, you need to install dependencies in your iOS project. Just locate ios/ folder in the root directory of the project and enter the following code snippet.

pod install

Initialize QuickBlox SDK

Connect SDK by calling init() method initializing the settings required for QuickBlox.

const appSettings = {
 appId: '',
 authKey: '',
 authSecret: '',
 accountKey: '',
 apiEndpoint: '', // optional
chatEndpoint: '' // optional
};

QB.settings
 .init(appSettings)
 .then(function () {
 // SDK initialized successfully
 })
 .catch(function (e) {
 // Some error occured, look at the exception message for more details
 });


Pass the following parameters within appSettings object:

Parameters
Description

appId

Application identifier.

authKey

Authentication key.

authSecret

Authentication secret.

accountKey

Required to get actual apiEndpoint and chatEndpoint for right server.

apiEndpoint

(optional) API endpoint.

chatEndpoint

(optional) Chat endpoint.

For Basic, Startup, and Growth plan users

  1. Make sure you set accountKey.
  2. Make sure to leave apiEndpoint and chatEndpoint fields empty to provide a smooth migration between servers.

For Enterprise plan users

  1. Contact our sales team to get apiEndpoint and chatEndpoint.
  2. Initialize your QuickBlox application with application credentials and apiEndpoint and chatEndpoint outlined in the table above.

Add permissions

For Android

If your app requires adding some specific permissions to access camera, microphone, internet, and storage permissions, add these permissions to your app manifest.

<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />

For iOS

You can use our SDK in the background mode as well. If you want to receive push notifications when the app goes to background mode, this requires you to add specific app permissions. Under the app build settings, open the Capabilities tab and turn on Remote notifications checkbox only.

If you want to use video calling functionality in the background mode set the Audio, AirPlay, and Picture in Picture checkboxes.

Autoreconnect to Chat

QuickBlox Chat runs over XMPP protocol. To receive messages in a real-time mode, the application should be connected to the Chat over XMPP protocol. To enable autoreconnection to Chat, call enableAutoReconnect() method and pass enable as true.

QB.settings.enableAutoReconnect({ enable: true })

By default, this parameter is enabled. Thus, if XMPP connection is lost and autoreconnect functionality is enabled, the app connects to Chat automatically. You can disable autoreconnection to Chat by passing enable parameter as false to enableAutoReconnect() method.

QB.settings.enableAutoReconnect({ enable: false })

Message carbons

Enable message carbons to ensure that all user messages get copied to all their devices so they could keep up with the current state of the conversation. For example, a User A has phone running conversations and desktop running conversations. User B has desktop running conversations. When User B sends a message to User A, the message shows on both the desktop and phone of User A.

Enable message carbons

QB.settings.enableCarbons()

Disable message carbons

QB.settings.disableCarbons()

Pay attention

By default, this parameter is turned off. Keep it enabled if you want to receive messages on all devices of the particular user (when a user is logged in on several devices).

Stream management

Stream management has two important features Stanza Acknowledgements and Stream Resumption:

  • Stanza Acknowledgements is the ability to know if a stanza or series of stanzas has been received by one's peer. In other words, a reply is requested on every sent message. If the reply is received, the message is considered as delivered.
  • Stream Resumption is the ability to quickly resume a stream that has been terminated. So once a connection is re-established, Stream Resumption is executed. By matching the sequence numbers assigned to each Stanza Acknowledgement a server and client can verify which messages are missing and request to resend missing messages.

Call initStreamManagement() method and pass autoReconnect and messageTimeout parameters to it to enable stream management.

QB.settings.initStreamManagement({
 autoReconnect: boolean,
 messageTimeout: number
})
Parameters
Description

autoReconnect

Set this parameter to apply Stream resumption. By default it is false. Set it as true to use Stream resumption for new connections.

messageTimeout

Preferred resumption time (in seconds). If this parameter is greater than 0, than it is applied, otherwise it is not applied.

Pay attention

Make sure to pass autoReconnect as true in initStreamManagement() to enable Stream resumption and be able to quickly resume a stream.

Updated about 13 hours ago


What's Next

Authentication

Setup


Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.