基於XMPP協議的WebIM

2021-07-27 00:00:25 字數 1674 閱讀 4376

本篇主要介紹的是xmpp協議與strophe.js的使用

一、匯入必須的檔案及編寫頁面

二、基礎的登入功能

頁面上先新增乙個登入框：

id="signin"


class="signinpanel">


name="cred">


for="jid">帳號:label>


type="text"


id="jid"


value="" />


for="pass">密碼:label>


type="password"


id="pass"


value="" />


type="button"


id="connect"


value="登入" />


for="tojid">聯絡人:label>


type="text"


id="tojid"


value="">


form>


div>
底下的tojid是指訊息要傳送的目標，接著設定幾個必須的引數用於登入服務

//xmpp伺服器bosh位址


//xmpp連線


var connection = null;


// 當前狀態是否連線


var connected = false;
接下來就是登入按鈕的功能以及登入狀態connected的修改

/**


* 連線狀態改變


* @param status


*/function


onconnect


(status)  else


if (status == strophe.status.connfail)  else


if (status == strophe.status.disconnecting)  else


if (status == strophe.status.disconnected)  else


if (status == strophe.status.connected) 


}/**


* 事件監聽


*/$(document).ready(function


()     });


connection.rawinput = function


(data) 


connection.rawoutput = function


(data) 


});
這樣基本就完成了乙個登入功能。登入狀態改變的時候會在chrome瀏覽器中列印狀態訊息和登入情況，console.log(『recv: 』 + data);輸出的是接收到的訊息而console.log(『send: 』 + data);則是傳送出去的訊息。

三、訊息傳送格式

登入後就是訊息的傳送了

$("#send").on("click", function


() ).c("body", null, msgbody);


connection.send(msg.tree());


});
以上就是基本的登入和傳送訊息功能，webim涉及到的東西比較多，比如表情訊息啊、檔案訊息啊等等。

基於XMPP協議的即時通訊

最近公司的專案需要用到即時通訊技術，就花了一點時間對即時通訊技術進行研究。經過調研發現，通過openfire spark smack就可以實現。廢話不多說，下面我們就來講一下具體的實現。1.什麼叫openfire？openfire是乙個即時通訊伺服器，也稱之為即時通訊平台。它是基於xmpp協議的，大...

通訊 基於Xmpp協議實現的聊天室

size medium 前段時間寫了個自定義通訊協議的聊天室 即用 r n標記字串，作為一句話 總感覺自己弄的那個協議實現雖然簡單，但是拓展性就太差了，只適合於傳送聊天的內容，難以包含更多的資訊。基於上述幾點，於是就開始接觸xmpp協議，並自己定義了乙個簡單的xmpp協議用以實現聊天室。size s...

通訊 基於Xmpp協議實現的聊天室

前段時間寫了個自定義通訊協議的聊天室 即用 r n標記字串，作為一句話 總感覺自己弄的那個協議實現雖然簡單，但是拓展性就太差了，只適合於傳送聊天的內容，難以包含更多的資訊。基於上述幾點，於是就開始接觸xmpp協議，並自己定義了乙個簡單的xmpp協議用以實現聊天室。首先有2點要知道 1.什麼是xmpp...