在线白板,基于socket.io的多人在线协作工具

首发:个人博客,更新&纠错&回复

昨天这篇博文留的尾巴,socket.io库的使用练习,成品地址在这里

代码已经上传到github,传送门。可以开俩浏览器看效果。

现实意义是俩人在线交流时说不明白,这时有个白板就好了,两人都能在上面写写画画,帮助沟通。

把github的readme搬过来——

此项目用于socket.io技术的使用演示

1.安装node.js

2.在某个文件夹下执行npm install socket.io

3.将源码拷贝到该文件夹下

4.执行node main.js

5.开两个浏览器访问http://localhost/

目前支持画直线、添加文字、橡皮擦、清空画布功能,可以参考源码自行添加其他功能。

可用于多人在线交流,起到白板的作用。

演示地址:演示地址

主要用的技术是Node.js的socket.io模块做服务器/客户端交互,画布绘制调用html5的canvas API。

长期欢迎项目合作机会介绍,项目收入10%用于酬谢介绍人。新浪微博:@冷镜,QQ:908789432。

时间: 2024-11-02 23:21:46

在线白板,基于socket.io的多人在线协作工具的相关文章

使用node.js和socket.io实现多人聊天室

刚学node.js,想着做点东西练练手.网上的东西多而杂,走了不少弯路,花了一天时间在调代码上.参考网上的一篇文章,重写了部分代码,原来的是基于基于node-websocket-server框架的,我没用框架,单单是socket.io. 一.基本功能 1.用户随意输入一个昵称即可登录2.登录成功后1) 对正在登录用户来说,罗列所有在线用户列表,罗列最近的历史聊天记录2) 对已登录的用户来说,通知有新用户进入房间,更新在线用户列表3.退出登录1)支持直接退出2) 当有用户退出,其他所有在线用户会收

基于Java NIO的多人在线聊天工具源码实现(登录,单聊,群聊)

近来在学习Java NIO网络开发知识,写了一个基于Java NIO的多人在线聊天工具练练手.源码公开在Coding上: https://coding.net/u/hust_wsh/p/MyChat/git ,开发环境是Ubuntu14.04+Eclipse Mars+JDK1.8. 要想编写一个基于Java NIO的多人在线聊天工具,我总结需要以下几方面的地址:客户端服务器模型,Java NIO中的Selector,SocketChannel,ByteBuffer,Collections以及序

基于socket.io的实时消息推送

用户访问Web站点的过程是基于HTTP协议的,而HTTP协议的工作模式是:请求-响应,客户端发出访问请求,服务器端以资源数据响应请求. 也就是说,服务器端始终是被动的,即使服务器端的资源数据发生变化,如果没有来自客户端的请求,用户就不会看到这些变化. 这种模式是不适合某些应用场景的,比如在社交网络用户需要近乎实时地知道其他用户最新的信息.对于普通站点来说, 请求-响应模式可以满足绝大多数的功能需求,但总有某些功能我们希望能够为用户提供实时消息的体验. 为解决这个问题,有两种方案可以选择: 仍旧使

[Node.js] 基于Socket.IO 的私聊

原文地址:http://www.moye.me/2015/01/02/node_socket-io/ 引子 最近听到这么一个问题:Socket.IO 怎么实现私聊?换个提法:怎么定位到人(端),或者说怎么标识到连接,而不是依赖每个连接的socket.id.好问题. 在 Socket.IO Real-Time Web Application Development的指引下,形成了如下思路: 服务端在每个用户初次进入系统时,产生session_id 服务端强制用户输入昵称,与session_id对应

nodejs 实例 使用 Express + Socket.IO 搭建多人聊天室

https://cnodejs.org/topic/51d51cd8d44cbfa3047926ba 作者 nswbmw 详细内容大家可以看这个. 由于时间久远,很多代码都过期了.我刚更新了app.js代码. /** * Module dependencies. */ var express = require('express') , http = require('http') , path = require('path'); var app = express(); // all env

nodejs 基于socket.io实现聊天室

由于之后要做的网页视频直播项目要用到socket.io模块,所以特地花时间研究了下,参照网上的代码做了些改进,自己写了个聊天室代码.不得不承认后端事实推送能力有点厉害,这是以前我用php一直苦恼的事情.下面简单介绍下我的项目,顺带讲解下nodejs. 事实上,在看别人写的代码之前,我一直不知道nodejs是干嘛的,直到真正接触到才明白这也可以算作是服务端代码,丰富的第三方库使其功能极其强大.它可以像golang的beego一样直接通过命令行开启服务器,不过要用到express模块.加载模块的方式

第十三章:基于socket.io实现即时通信

服务器端的搭建参考socket io官网,里面有非常详细的描述,按照步骤下来,最终可以在localhost进行模拟聊天. 下面是客户端的说明. 引入socket.io.js: <script src="js/socket.io.js"></script> 定义Chats tab: <!-- Chats Tab --> <ion-tab title="Chats" icon-off="ion-ios-chatboxe

基于socket.io客户端与服务端的相互通讯

socket.io是对websocket的封装,用于客户端与服务端的相互通讯.官网:https://socket.io/. 下面是socket.io的用法: 1.由于使用express开的本地服务,先下载相关依赖 cnpm install express socket.io 2.服务端代码 const express = require("express"); const io = require("socket.io"); const app = express(

基于socket编程的多人聊天室

先是做完的效果图:      server.c 1 /* 服务器端 server.c */ 2 #include <glib.h> 3 #include <stdio.h> 4 #include <fcntl.h> 5 #include <signal.h> 6 #include <sys/socket.h> 7 #include <sys/types.h> 8 #include <sys/time.h> 9 #inclu