1

我正在使用 node.js 和 socket.io 开发多用户绘图应用程序

我在 node.js 上使用 express web 框架

var express = require("express"),
    http = require("http");
var hoganex = require('hogan-express');
var app = express(),
    server = http.createServer(app)
    io = require('socket.io').listen(server);

var routes = require('./routes');

 var app = express({
   views: path.join(__dirname, 'views')
 });
app.set('views', __dirname + '/views');

app.set('view engine', 'html');
app.set('layout', 'layout.html');
app.engine('html', hoganex);
app.get('/test', routes.index);
app.use(express.static(__dirname + '/assets'));

// Listen for incoming connections from clients
io.sockets.on('connection', function (socket) {
//code for collaboration goes here using socket.on and other methods for sending...
});

我想做一些类似于etherpad和togetherjs所做的事情。每当用户访问 web 应用程序时，都会向他提供该应用程序的新实例，现在他可以共享某种操纵或任何其他随机生成的 url，他可以使用这些 url 连接其他用户/对等方，以便他们都可以协作他们的工作，在我的情况下是协作绘图。

所以问题是如何进行。向每个新来的用户呈现相同的index页面，然后为他提供共享某种 url 的功能，以便与该特定 url 相关的用户能够使用 sockrt.io 协作他们的工作，并且该过程继续为其他n用户协作他们的工作与其他m用户。

4

1 回答 1

3

使用别人

你应该看看Etherdraw。它完全按照您使用 Node.js 和 socket.io 的描述进行。

自己动手

  1. 当用户访问您的站点时，我们将其命名为 draw.yoursite.com，在数据存储中创建一个新的唯一 room_id 并将用户发送到空白画布。当用户绘制时，通过socket.io将绘制数据（即线的类型，线的开始（x，y），线的结束（x，y））发送到服务器。数据存储在数据存储中并发布给订阅该房间 (pub/sub) 的所有用户。

  2. 当新用户请求房间 (draw.yoursite.com/[room_id]) 时，将查询数据存储。（默认情况下，Etherdraw 将 JSON 格式的数据存储在平面文件中，但建议使用 MongoDB 之类的东西进行测试以外的任何事情。）

  3. 如果请求的房间已经存在，则发回该房间的数据。绘图作为 (x,y) 坐标存储在数据存储中，并带有描述如何连接点的属性（即直线、粗体、弧形等）。

于 2013-10-26T02:12:35.683 回答