您如何在网站中实施quickblox?

时间:2018-10-12 13:36:40

标签: javascript php html api quickblox

我只是Web开发的初学者。因此,这可能是一个非常愚蠢的问题。 我想使用JavaScript将quickblox包含到我的网站中。到目前为止,我已经将javascript包含到我的网站中并创建了quickblox管理员端应用程序。 如何在您的网站上进行设置以登录和聊天。我已经阅读了文档,但没有下一步要做。如果有人可以细说,如何从我们的网页打开quickblox窗口。 任何帮助表示赞赏。

编辑:-我已经编辑了代码,但是现在它显示了在控制台上的连接,然后什么也没有发生。我不知道我是否传递了不正确的网址或其他内容。

<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 个答案:

答案 0 :(得分:0)

您包括了不带版本号的Quickblox CDN。

 src="https://cdnjs.cloudflare.com/ajax/libs/quickblox/x.x.x/quickblox.min.js">

确保在x.x.x处添加版本号

这是最新版本:

https://cdnjs.cloudflare.com/ajax/libs/quickblox/2.12.0/quickblox.min.js

该脚本现在尚未加载,这就是为什么它不起作用的原因。