javascript - 两个用户如何协作编辑一个 JSON 文件?

标签 javascript json node.js meteor share.js

我正在创建一个协作网络音乐平台。

目前,我有一台在本地工作的简单鼓机,带有一个记录所有节拍的 JSON 文件。即在输入模式后,代码在登录到控制台时看起来像这样。调度程序和播放功能然后迭代并播放节拍(如果它在当前节拍“打开”)。

  "kick": [1, 0, 0, 0, 1, 0, 0, 0, 1, 0, 0, 0, 1, 0, 0, 0],
    "snare": [0, 0, 0, 1, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0],
    "hat": [0, 0, 1, 0, 0, 0, 1, 0, 0, 1, 0, 0, 1, 1, 1, 1],
    "tom1": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
    "tom2": [0, 0, 1, 0, 0, 0, 1, 0, 0, 1, 0, 0, 1, 0, 0, 0],
    "tom3": [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]

所以接下来我想将这个网络应用程序联网,这样两个人就可以同时编辑图案。我真的很挣扎,很想在这里得到一些帮助。我看过 meteor 和 sharejs,但变得很困惑。

我如何在服务器上保存一个由两个用户编辑的 JSON 文件? (他们会轮流编辑模式,就像这个游戏 http://sharejs.org/hex.html#9TGAyPGFOy )这个 JSON 文件需要在代码中随时更新,这样最新版本的轨道可以播放给两个用户。

任何提示都会很棒,我觉得我在这里过于复杂了......

谢谢

最佳答案

我建议使用 Socket.io对于这个项目。

您可以使用以下代码设置一个简单的套接字服务器:

(不要忘记npm install --save socket.io!)

// server.js

// we're using filesystem stuff here
var fs = require('fs');

// set up socket.io
var io = require('socket.io').listen(80);

// load the current json file in
var currentJSON = fs.readFileSync('./beat.json');

io.on('connection', function(clientSocket) {

   console.log('Client connected!');

   // tell the client that just connected what the current JSON is
   clientSocket.emit('stateUpdate', {currentJSON: currentJSON});

   // listen for an "update" event from a client
   clientSocket.on('update', function(payload) {
       if(payload.updatedJSON) {

           console.log('We got updated JSON!');

           // validate the incoming JSON here
           validateBeatJSON(payload.updatedJSON);

           // update the "currentJSON" variable to reflect what the client sent
           currentJSON = payload.updatedJSON;

           // save the json file so the server will have it when it next starts. also, try not to use *sync methods for this, as they'll block the server but ive included them cos they're shorter
           fs.writeFileSync('/beat.json', JSON.stringify(payload.updatedJSON), 'utf8');

           // tell the other clients what the current state is
           clientSocket.broadcast.emit('stateUpdate', {currentJSON: currentJSON});

       }
   });

});

//client.html
<script src="socket.io.js"></script>
<script>
 var currentJSON = [];
 var socket = io(); // TIP: io() with no args does auto-discovery
  socket.on('stateUpdate', function (payload) {
     currentJSON = payload.currentJSON;
  });

  // blah blah, set event for when the json is updated
  window.addEventListener('updatedJSONLocally', function(e) {
    socket.emit('update', {updatedJSON: currentJSON});
  });

</script>

我基本上只是将其输入到答案框中 - 这尚未经过测试或其他任何内容,但我认为它可以让您对项目的 Socket.io 库的基础知识有一个很好的了解。

正如我在评论中提到的,我不建议在执行文件系统操作时使用 *sync 方法。这种方法更容易阅读,但会在读/写文件时锁定整个过程。如果有多个用户使用该项目,这将导致问题。查看 *async 方法以找到解决此问题的方法。它们实现起来并不难。

祝你好运!

关于javascript - 两个用户如何协作编辑一个 JSON 文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28942871/

相关文章:

javascript - 否 'Access-Control-Allow-Origin' - CORS

ios - 将 Json 与 post 请求绑定(bind)

javascript - `this` 在 expressJS 路由处理程序中未定义

sockets - 握手后立即发送 WebSocket 消息

javascript - 如何在 JavaScript 中读取 `export default *`?

javascript - 使用 Dojox/Standby 时如何去除覆盖层的透明度?

javascript - jquery 仅将鼠标悬停在一个 div 上,但为所有 div 定义

javascript - 正则表达式 - 仅数字、字符和空格

java - 当整个json是一个数组时解析jsonobject?

javascript - 我怎样才能停止 webpack-dev-server