聊天室和彈幕的js實(shí)現(xiàn)感覺

var hasLastCheckReturned = true;

????var lastCheckedTime = 0;

????setTimeout(function(){

???? if(!hasLastCheckReturned){

???? return; // 上次還沒返回結(jié)果。放棄這次請(qǐng)求。

???? }

???? var xhr = new XMLHttpRequest();

???? xhr.onreadystatechange = function(){

???? if(xhr.readyState === 4){

???? if(xhr.responseCode === 200){

???? // 解析彈幕

???? var danmakuList = yourFormatParser(xhr.responseText);

???? for(var i = 0; i < danmakuList.length; i++){

???? CM.insert(danmakuList[i]); // 把增量彈幕每一個(gè)都插入

???? };

???? lastCheckedTime = Date.now(); // 更新上次檢測的時(shí)間

???? hasLastCheckReturned = true;

???? } else {

???? // 可能出了問題

???? hasLastCheckReturned = true;

???? }

???? }

???? };

???? xhr.open('GET', 'http://yoururl/somevideoid/?from=' + lastCheckedTime, true); // 告訴服務(wù)器上次檢查的時(shí)間,來獲取增量

???? xhr.send(); // 發(fā)送請(qǐng)求

???? hasLastCheckReturned = false;

????}, 3000); // 每3s檢查新的彈幕

????

以及:

?

????// 基于 socket.io 和 JQuery來簡化代碼

????

????var socket = io(); //開啟流

????

????socket.on('danmaku', function(data){

???? // 當(dāng)遇到 danmaku 事件,就把推送來的彈幕推送給 CCL

???? var danmaku = yourFormatParser(data);

???? CM.insert(danmaku);

????});

????

????$('#send-danmaku-btn').click(function(){

???? //當(dāng)按了發(fā)送彈幕的按鈕

???? var data = {

???? "text":"獲取信息。。"

???? ...

???? };// 通過UI獲取新彈幕的信息

????

???? //包裝并發(fā)射彈幕

???? socket.emit('send-danmaku', JSON.stringify(yourFormatPackager(data));

????

???? //清除 UI 文字部分

???? $('#send-danmaku-field').value("");

????});

加好友 1098271199?? 一起交流討論吧?

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容