前两天做了个node版的websocket在线服务端,现在顺手给佳佳酱也加上了。
使用方法还是很简单的啦,只有打开服务端,然后在要显示在线数量的页面加上以下脚本(这是我用的代码)
(function() { try { var siteol = $("#online_number #site_ol"),//获取填写全站在线数的元素 pageol = $("#online_number #page_ol");//获取填写本页在线数的元素 } catch(e) {} var sitesocket = { newconnection: newconnection, socket: null, pinginterval: null }, pagesocket = { newconnection: newconnection, socket: null, pinginterval: null }; function ssiteol(num) { if (siteol.length) { siteol.html(num) } else { $(window).load(function() { siteol = $("#online_number #site_ol");//注意修改这里,我后来为了在页面加载完之前就先发起连接,又要确保可以填入正确位置做的修改 siteol.html(num) }) } } function spageol(num) { if (pageol.length) { pageol.html(num) } else { $(window).load(function() { pageol = $("#online_number #page_ol");//还有这里 pageol.html(num) }) } } function _(type, data) { return JSON.stringify({ type: type, data: data }) } function newconnection(url, callback) { clearInterval(this.pinginterval); if (this.socket && this.socket.readyState !== 3) { return } else { delete this.socket } var inte; this.socket = new WebSocket("ws://urlonline.coding.io:80");//修改成你自己的在线服务器地址 var so = this.socket; this.socket.ping = function() { so.send("1") }; this.socket.onopen = function(data) { so.send(_("url", url)); inte = this.pinginterval = setInterval(so.ping, 30000) }; this.socket.onmessage = function(data) { if (typeof data == "string" && data === "1") return; var msg = JSON.parse(data.data); switch (msg.type) { case "ol": { callback(msg.data); break } } }; this.socket.onerror = function(data) { clearInterval(inte); delete so; setTimeout(newconnection, 3000, url); callback(0) }; this.socket.onclose = function(data) { clearInterval(inte); delete so; setTimeout(newconnection, 3000, url); callback(0) } } //初始化连接 sitesocket.newconnection("site://blog.luojia.me", ssiteol);//使用site://前缀标识统一的被请求地址(此网站) pagesocket.newconnection(window.location.href, spageol)//使用本页的href作为被请求地址 })();
可以断线自动重连,喵喵喵!
不过人少的站加上了它显得更寒酸了 (๑•́ ₃ •̀๑)
本文发布于 https://luojia.me
本站文章未经文下加注授权不得拷贝发布。
这个功能 叼! 厉害~
好厉害
在线:全站[0] 本页[0] 我是透明的吗
正在重新部署在线服务器