Integrate Quickblox in Ionic 2

Ionic Framework ionic-v3
1

Hi, I spent the last two weeks trying to figurate how integrate quickblox in my project. And furthest I made was only create a session.
When I try to do the

quickblox.chat.connect

I get this strange error

Runtime Error
this is undefined

And all the google searchs I made, didn’t helped me to solve this problem.
So for simplicity I started a blank project and was debugging with the console, this is my code:

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
// import * as $ from "jquery";
import * as quickblox from "quickblox";


@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  CREDENTIALS:any = {
    appId: 54485,
    authKey: 'WV9zLPSGEOSDh7j',
    authSecret: 'GeBPsdBrQLrPjKZ'
  };

  user:any = {
    id: 24786158,
    login: 'test',
    pass: 'qwerty1234'
  };

  constructor(public navCtrl: NavController) {
        quickblox.init(this.CREDENTIALS.appId, this.CREDENTIALS.authKey, this.CREDENTIALS.authSecret);
        quickblox.createSession(
          {login: this.user.login, password: this.user.pass},
          function(err, result) {
            if (result){
              quickblox.chat.connect(
                {userId: this.user.id, password: this.user.pass},
                function(err, roster){
                  if (err){
                    console.log(err);
                  }
                });
            }       
            console.log(err);
            console.log(result);
        });
  }
}

I know

quickblox.createSession

works fine, because I get the success response from server.

Any help or guide will be very helpful for me, I’m new in this field, and this error it’s driven me crazy.
Thanks in advance.

1 Like
2

You’ll want to change the callback functions to use Typescript’s fat arrow syntax, i.e.

quickblox.createSession(
          {login: this.user.login, password: this.user.pass},
          (err, result) => { //THIS LINE HAS BEEN CHANGED <-
            if (result){
              quickblox.chat.connect(
                {userId: this.user.id, password: this.user.pass},
                (err, roster) => { //THIS ONE TOO <-
                  if (err){
                    console.log(err);
                  }
                });
            }       
            console.log(err);
            console.log(result);
        });
1 Like
3

I love you,
I love you so much !!!
Thank you very much !!!

4

Hello plz help me,

I have added it in my app.components.ts

import * as quickblox from “quickblox”;
quickblox.init(this._utilityService.QBApp.appId, this._utilityService.QBApp.authKey, this._utilityService.QBApp.authSecret, this._utilityService.QBApp.CONFIG);

error_handler.js:60 ReferenceError: Strophe is not defined

5

Yes, you have to install strophe:

npm install strophe.js

Then you have to copy the file strophe.js located in node_modules/strophe.js
to the directory src
Finally you have to add

<script src="strophe.js"></script>

to the file index.html located in the folder src

6

Thank you lot, DONE!!!

7

quckblox.chat.send : NOT SAVE MESSAGE created Dialog._id created:
Plz help.

quickblox.chat.dialog.create(params, (err, createdDialog) => {
if (err) {
console.log(err);
} else {
console.log(“createdDialog._id”, createdDialog._id);

this.userdetails.full_name);

     var message = {
           type: 'chat',
           body: "How are you today?",
           extension: {
            save_to_history: 1,
            _id: createdDialog._id,
          }, 
           markable: 1
        };


         quickblox.chat.send(this.userdetails.id, message);
                          
                                 

  }
});

RESPONSE
:
{_id: “591046dba28f9aa956000002”, created_at: “2017-05-08T10:22:19Z”, last_message: null,…}
created_at
:
"2017-05-08T10:22:19Z"
last_message
:
null
last_message_date_sent
:
null
last_message_user_id
:
null
name
:
"Soumya"
occupants_ids
:
[26832707, 26893912]
photo
:
null
type
:
3
unread_messages_count
:
null
updated_at
:
"2017-05-08T10:22:19Z"
user_id
:
26832707
xmpp_room_jid
:
null
_id
:
"591046dba28f9aa95600000

8

i’m getting this error Unexpected signature any help please

9

Hi @gonzag how you added the quickblox in ionic 2

10

I’ve made an example