How do you implement quickblox in your website?
Question
I am just a beginner in web development. So, this might be a very silly question. I want to include quickblox into my website using javascript. So far I have included the javascript into my website and created the quickblox admin side application. How do you set it up in your website to sign in and chat. I have gone through the documentation but not getting what to do next. How is the quickblox window opened from our webpage, if anyone can elabarate. Any help is appreciated.
Edit:- I have edited the code but now it show connecting on console and nothing happens then. I dont know if I am passing improper url or something.
<script> var QBAPP = { app_id: 'xxxx', auth_key: 'xxxxxxx', auth_secret: 'xxxxxxxx' }; // our parameters to connect to QuickBlox Chat service var CHAT = { server: 'chat.quickblox.com', bosh_server: 'http://chat.quickblox.com:5280' }; var params, connection; params = { login: 'xxxxxxx', password: 'xxxxxxx' }; QB.init(QBAPP.app_id, QBAPP.auth_key, QBAPP.auth_secret); QB.createSession(params, function (err, res) { if (err) { console.log(err.detail); } else { connectChat(res.user_id, params.password); } }); function connectChat(user_id, password) { var userJID = user_id + "-" + QBAPP.app_id + "@" + CHAT.server; var userPass = password; connection = new Strophe.Connection(CHAT.bosh_server); connection.rawInput = rawInput; //connection.rawOutput = rawOutput; connection.connect(userJID, userPass, function (status) { switch (status) { case Strophe.Status.ERROR: console.log('[Connection] Error'); break; case Strophe.Status.CONNECTING: console.log('[Connection] Connecting'); break; case Strophe.Status.CONNFAIL: console.log('[Connection] Failed to connect'); break; case Strophe.Status.AUTHENTICATING: console.log('[Connection] Authenticating'); break; case Strophe.Status.AUTHFAIL: console.log('[Connection] Unauthorized'); break; case Strophe.Status.CONNECTED: console.log('[Connection] Connected'); // Create an event handler for getting messages connection.addHandler(onMessage, null, 'message', null, null, null); // send a presence message connection.send($pres().tree()); break; case Strophe.Status.DISCONNECTING: console.log('[Connection] Disconnecting'); break; case Strophe.Status.DISCONNECTED: console.log('[Connection] Disconnected'); break; case Strophe.Status.ATTACHED: console.log('[Connection] Attached'); break; } }); } // logs function rawInput(data) { console.log('RECV: ' + data); } function rawOutput(data) { console.log('SENT: ' + data); } function onMessage(msg) { console.log(msg); var to = msg.getAttribute('to'); var from = msg.getAttribute('from'); var type = msg.getAttribute('type'); var elems = msg.getElementsByTagName('body'); // we must return true to keep the handler alive. // returning false would remove it after it finishes. return true; } function sendMessage() { params = { to: '<some JID>', // JID of recipient QB User from: connection.jid, // JID of sender QB user type: 'chat' // type of the message } var msg = $msg(params).c('body').t('Hello world!'); connection.send(msg.tree()); } </script>
<html> <head> <meta charset="UTF-8"> <title>Simple Recorder.js demo with record, stop and pause</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/quickblox/2.12.0/quickblox.min.js"></script> <script type="javascript" src="<?php echo base_url() ?>assets/js/strophe"></script> </head> <body> <h1>Welcome to chatbox</h1> <p>begin chatting here</p> </body> </html>
1 answers
solution1
0 2018-10-12 14:10:14
You included the Quickblox CDN without version number.
src="https://cdnjs.cloudflare.com/ajax/libs/quickblox/x.x.x/quickblox.min.js">
Make sure you add a version number in the place of the xxx
This is the latest version:
https://cdnjs.cloudflare.com/ajax/libs/quickblox/2.12.0/quickblox.min.js
The script isn't loaded now, that's why it won't work.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.