.Net如何使用SuperSocket框架實(shí)現(xiàn)WebSocket前端

這篇文章將為大家詳細(xì)講解有關(guān).Net如何使用SuperSocket框架實(shí)現(xiàn)WebSocket前端，小編覺得挺實(shí)用的，因此分享給大家做個(gè)參考，希望大家閱讀完這篇文章后可以有所收獲。

其實(shí)前端實(shí)現(xiàn)相對就容易很多了，因?yàn)槲覀冇蠮avaScript WebSocket Api，它看上來大致是這樣的：

var ws = '';//WebSocket對象
var userName = '測試同學(xué)' + parseInt(Math.random(1) * 888);//用戶名
//初始化連接
function connect() {
    var address = "ws://127.0.0.1:10086";//服務(wù)端地址
    ws = new WebSocket(address);//實(shí)例化WebSocket對象
    //開始連接時(shí)
    ws.onopen = function (e) {
        ws.send('[login]{"userid":"' + userName + '"}');
    };
    //收到信息時(shí)
    ws.onmessage = function (e) {
        var Json = eval('(' + e.data + ')');
        switch (Json.type) {
            case '1':
                //新用戶連接時(shí)
                break;
            case '2':
                var Html = '';
                Html += '<p>';
                Html += Json.user + ':' + Json.msg;
                Html += '</p>';
                $('#msgBox').append(Html);
                break;
        }
    };
    //發(fā)生錯(cuò)誤時(shí)
    ws.onerror = function (e) {
 
    };
    //連接關(guān)閉時(shí)
    ws.onclose = function (e) {
        $('#msgBox').append('<p>與聊天室的連接已斷開。</p>');
    };
}
 
//公聊發(fā)送
function send() {
    var SendText = $('#send').val();
    ws.send('[send]{"msg":"' + SendText + '","user":"' + userName + '"}');
}

這些東西是固定的，記就行了~簡單解釋下：

關(guān)鍵之一：ws.onmessage,它可以在收到服務(wù)端信息時(shí)做出響應(yīng)——然后你就可以為所欲為了。

該方法返回的信息存儲在e.data內(nèi)，內(nèi)容取決于你的服務(wù)端如何編寫（這里視作返回Json）。

關(guān)鍵之二：ws.send(),它可以發(fā)送信息到你編寫的服務(wù)端（至于內(nèi)容，依然取決于你后端如何實(shí)現(xiàn)）。

關(guān)鍵之三：ws.onopen(),通過它可以打開與服務(wù)端的溝通（要設(shè)置好WebSocket對象）。

下面是實(shí)現(xiàn)的效果（很丑勿吐槽）：

記得要找支持H5的瀏覽器哦~

關(guān)于“.Net如何使用SuperSocket框架實(shí)現(xiàn)WebSocket前端”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，使各位可以學(xué)到更多知識，如果覺得文章不錯(cuò)，請把它分享出去讓更多的人看到。