PHP - 利用yshout给网站添加多人在线即时聊天功能

考虑给网站添加个多人即时在线聊天
的功能已经很久了,虽然没啥实际性意义。今天打酱油把网站在线聊天这功能给日上去了,姑且算是又疼了一回。

采用的是开源的yshout
,更更改改删删减减,先看看效果。

右下角的即时聊天效果图

这是点击网站右下角的打开即时聊天后的效果图。嘿嘿,颜色经过调整感觉起来爽多了。

查看所有的在线即时聊天历史记录

右下角展开的内容设置了只显示最新7条。可以通过History这边查看所有保存的历史记录。在后台也可以设置要保存几分历史记录,每份聊天的历史记录多少等等。yshout
的功能很实用很好。

yshout在线聊天后台控制面板

这是yshout 控制前台展示效果的一些参数设置。

yshout的一些系统参数设置

这里是设置功能的配置,yshout采用Php+Ajax+文本的方式。

yshout简介

yshout是采用PHP+TXT开发的一款Ajax嵌入式网页多人在线即时聊天谈天工具。有使用jQuery框架,是国外的程序,UTF8国际标准编码。
yshout的特点是可以方便嵌入到的你的网站中,不用数据库,摘用TXT文本存储数据方式,小巧灵活,移植很方便。几乎都使用了AJAX技术,操纵感受很棒。效果测试图如上所示。

把yshout嵌入到网站

下载yshout
后,配置设置了一番,然后调整聊天窗口的位置固定到右下角,把颜色改成和网站相搭的,写效果等等,就整合到网站了。

调用方法:
<script src="//sjolzy.cn/php/yshout/js/jquery.js" type="text/javascript"></script>
<script src="//sjolzy.cn/php/yshout/js/yshout.js" type="text/javascript"></script>
<link rel="stylesheet" href="//sjolzy.cn/php/yshout/css/example.yshout.css" />
<link rel="stylesheet" href="//sjolzy.cn/php/yshout/css/style.css" />
<script type="text/javascript">
new YShout({
yPath: '//sjolzy.cn/php/yshout/',
yLink: 'rars'
});
</script>
<div id="yshout"></div>

有发现了在本地html方式打开的时候不会有内容,貌似要http域名形式?

多人即时在线聊天例子

看看例子,

网页即时在线聊天

网页即时在线聊天[右下角嵌入版]

 

Ps,这个在线即时聊天功能在ie8、火狐、chrome上都能完美兼容。唯一的缺憾是点击的时候可能会因为js和css文件还未加载完全导致需要点击第二次第三次才能出来。。这点很Faint!

总的来说,这个即时在线群聊功能挺好的~ 哈哈

php WebSockets服务端和客户端

关于WebSockets 的基础概念参见:HTML5 WebSockets 基础使用学习教程

本文简单记录PHP利用WebSockets
和HTML5 WebSockets API的服务器推技术来实现在线聊天系统

php WebSockets服务端和客户端Demo下载

解压后只有两个文件:server.php(服务端)和client.html(客户端)

运行WebSockets服务器端

,命令行模式下使用php -q path\server.php
运行

,或者浏览器访问server.php

注:浏览器必须支持HTML5的WebSocket
。可使用当前的最新Firefox或Chrome。

另外PHP需要支持php_sockets组件
。windows环境下请将php.ini的php_sockets.dll打开。

以上条件满足后,打开http://domo.cn/WebSockets/client.html

如果出现图中提示:

PHP websockets error

这情况为server.php端未运行。可以另开个窗口:http://demo.cn/WebSockets/server.php

当出现提示:Message: Created socket Resource id #2 Message: Socket bound to localhost:8000 Message: Start listening on Socket.,此时表示WebSockets服务端运行中。

再次访问http://domo.cn/WebSockets/client.html,

PHP websockets 连接成功

此时客户端和服务器端WebSockets连接成功。

发送测试内容: PHP WebSockets Test

PHP WebSockets服务器主动 返回发送内容

PHP websockets exit

点击退出,客户端即与服务器端断开。

这样就利用PHP的sockets和HTML5的WebSockets API简单的实现了服务器推。