佳佳君给佳佳酱加上了在线人数哦

前两天做了个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

本站文章未经文下加注授权不得拷贝发布。

本博客使用Disqus评论系统,如果看不到评论框,请尝试爬墙。