两个用户如何协同编辑 JSON 文件?
How can two users collaboratively edit a JSON file?
我正在创建一个协作网络音乐平台。
目前,我有一个简单的鼓机在本地工作,有一个 JSON 文件记录所有节拍。即在输入模式后,代码在登录到控制台时看起来像这样。如果当前节拍为 'on',则调度程序和播放功能将循环播放节拍。
"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]
所以接下来我想将这个网络应用联网,这样两个人就可以同时编辑图案。我真的很挣扎,很想在这里得到一些帮助。我看过流星和 sharejs,但变得很困惑。
如何让 JSON 文件驻留在服务器上,并由两个用户编辑? (他们会轮流编辑花样,像这个游戏http://sharejs.org/hex.html#9TGAyPGFOy)这个JSON文件需要在代码中随时更新,所以可以播放最新版本的曲目两个用户。
任何提示都会很棒,我觉得我在这里过于复杂了...
谢谢
我认为您服务器上的一个简单 PHP 脚本就可以解决这个问题。
您可以为每个会话创建一个 JSON/txt 文件(可能为每个会话生成一个随机 ID)并使用 AJAX 将两个用户的数据发送到服务器,然后服务器将更新JSON 文件。
您可以将 jQuery 用于 AJAX:
$.post("myscript.php", { data: 'json goes here' });
在你的 PHP 中,你可以得到 POST 数据:
$data = $_POST['data'];
这将是一个可以保存到服务器上的字符串。
Here 是关于使用 PHP 保存文件的教程。
要取回数据,只需从服务器重新加载 JSON 文件即可。我建议将整个内容保存为字符串(Javascript 中的 JSON.stringify()
),然后在取回时使用 JSON.parse()
对其进行解码。
考虑到用户会轮流使用,此架构应该可以正常工作。
LMK 如果有什么我不清楚的地方,祝你好运!
我建议对这个项目使用 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 方法。这种方法更容易阅读,但会在文件 read/written 时锁定整个过程。如果有多个用户使用该项目,这将导致问题。查看 *async 方法以找到解决此问题的方法。它们并不难实施。
祝你好运!
让我们尽可能地简化它。
最简单的解决方案是在内存中(在您的 node.js 服务器中)有一个 javascript 对象,并让用户通过单个 API 调用来编辑它。喜欢,
app.put('/composition', updateJSONObject)
updateJSONObject
函数将读取内存中的 javascript 对象,对其进行编辑,然后 return 更新对象。
app.get('/composition', getJSONObject)
此路由将获取最新的 JSON 对象。
(我假设你在这里使用 express.js)
然后,使用 fs.createWriteStream
定期(每 1 分钟一次?)执行一个简单的 setInterval
将您的 javascript 对象保存到文件系统。这将像 filename.json
一样保存您的 json 对象,如果内存中的 json 对象为空,您可以检索它。 (例如,在服务器重启后)
处理碰撞是一个更大的问题。但由于您不想让您的解决方案过于复杂,所以这很简单,并且完成工作,除非您期望每秒编辑 100 次。
我正在创建一个协作网络音乐平台。
目前,我有一个简单的鼓机在本地工作,有一个 JSON 文件记录所有节拍。即在输入模式后,代码在登录到控制台时看起来像这样。如果当前节拍为 'on',则调度程序和播放功能将循环播放节拍。
"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]
所以接下来我想将这个网络应用联网,这样两个人就可以同时编辑图案。我真的很挣扎,很想在这里得到一些帮助。我看过流星和 sharejs,但变得很困惑。
如何让 JSON 文件驻留在服务器上,并由两个用户编辑? (他们会轮流编辑花样,像这个游戏http://sharejs.org/hex.html#9TGAyPGFOy)这个JSON文件需要在代码中随时更新,所以可以播放最新版本的曲目两个用户。
任何提示都会很棒,我觉得我在这里过于复杂了...
谢谢
我认为您服务器上的一个简单 PHP 脚本就可以解决这个问题。
您可以为每个会话创建一个 JSON/txt 文件(可能为每个会话生成一个随机 ID)并使用 AJAX 将两个用户的数据发送到服务器,然后服务器将更新JSON 文件。
您可以将 jQuery 用于 AJAX:
$.post("myscript.php", { data: 'json goes here' });
在你的 PHP 中,你可以得到 POST 数据:
$data = $_POST['data'];
这将是一个可以保存到服务器上的字符串。 Here 是关于使用 PHP 保存文件的教程。
要取回数据,只需从服务器重新加载 JSON 文件即可。我建议将整个内容保存为字符串(Javascript 中的 JSON.stringify()
),然后在取回时使用 JSON.parse()
对其进行解码。
考虑到用户会轮流使用,此架构应该可以正常工作。
LMK 如果有什么我不清楚的地方,祝你好运!
我建议对这个项目使用 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 方法。这种方法更容易阅读,但会在文件 read/written 时锁定整个过程。如果有多个用户使用该项目,这将导致问题。查看 *async 方法以找到解决此问题的方法。它们并不难实施。
祝你好运!
让我们尽可能地简化它。
最简单的解决方案是在内存中(在您的 node.js 服务器中)有一个 javascript 对象,并让用户通过单个 API 调用来编辑它。喜欢,
app.put('/composition', updateJSONObject)
updateJSONObject
函数将读取内存中的 javascript 对象,对其进行编辑,然后 return 更新对象。
app.get('/composition', getJSONObject)
此路由将获取最新的 JSON 对象。
(我假设你在这里使用 express.js)
然后,使用 fs.createWriteStream
定期(每 1 分钟一次?)执行一个简单的 setInterval
将您的 javascript 对象保存到文件系统。这将像 filename.json
一样保存您的 json 对象,如果内存中的 json 对象为空,您可以检索它。 (例如,在服务器重启后)
处理碰撞是一个更大的问题。但由于您不想让您的解决方案过于复杂,所以这很简单,并且完成工作,除非您期望每秒编辑 100 次。