Rethinkdb节点将Feed更改为HTML

时间:2015-09-15 22:00:00

标签: node.js real-time rethinkdb

我正在尝试将我的rethinkdb数据库中的任何更改Feed显示到HTML(前端),但我无法显示任何更改Feed。

你能帮我解决一下这个问题吗?

该文件为app.js

var express = require('express'),
    app = express(),
    server = require('http').createServer(app),
    users = {},
    db='testing',
    table = 'todos';
    io = require('socket.io').listen(server);
var bodyParser = require('body-parser');

server.listen(5000);

app.get('/', function(req, res){
    res.sendFile(__dirname + '/index.html');
});

var config = require(__dirname + '/config.js');
var r = require('rethinkdbdash')(config.rethinkdb);

io.sockets.on('connection', function(socket){
    r.db(db).table(table).pluck('title').changes().run().
        then(function(feed){
            feed.each(function(err, item){
                console.log(JSON.stringify(item, null, 2));
                io.emit('new message', item);   
            }); 
    });
});

config.js文件

module.exports = {
  rethinkdb: {
    host: '192.168.2.3',
    port: 28015,
    authKey: '',
    db: 'testing'
  },
  express: {
     port: 5000
  }
};

index.html文件

<html>
<head>
    <title>Chat with socket.io and node.js</title>
    <style>
        #chat{
            height:500px;
        }
    </style>
</head>
<body>
    <div id="chat"></div>
    <form id="send-message">
        <input size="35" id="message"></input>
        <input type="submit"></input>
    </form>

    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script src="/socket.io/socket.io.js"></script>
    <script>
        jQuery(function($){
            var socket = io.connect();
            var $messageForm = $('#send-message');
            var $messageBox = $('#message');
            var $chat = $('#chat');

            $messageForm.submit(function(e){
                e.preventDefault();
                socket.emit('send message', $messageBox.val());
                $messageBox.val('');
            });

            socket.on('new message', function(data){
                $chat.append(data + "<br/>");


        });
    </script>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

你在index.html上有一些语法错误,这会阻止客户端运行,那么主要的问题就是你在错误的字段上运行。

以下是有效的代码:

app.js

var express = require('express'),
app = express(),
server = require('http').createServer(app),
users = {},
db='testing',
table = 'todos';
io = require('socket.io').listen(server);
var bodyParser = require('body-parser');

server.listen(5000);

app.get('/', function(req, res){
  res.sendFile(__dirname + '/index.html');
});

var config = require(__dirname + '/config.js');
var r = require('rethinkdbdash')(config.rethinkdb);

io.sockets.on('connection', function(socket){
  r.db(db).table(table)
  .pluck('title')
  .changes()
  .run()
  .then(function(feed){
    feed.each(function(err, item){
      console.log(JSON.stringify(item, null, 2));
      io.emit('new message', item.new_val.title);
    })
  })
})

的index.html

<html>
<head>
  <title>Chat with socket.io and node.js</title>
  <style>
#chat{
  height:500px;
}
  </style>
</head>
<body>
  <div id="chat"></div>
  <form id="send-message">
    <input size="35" id="message"></input>
    <input type="submit"></input>
  </form>

  <script src="http://code.jquery.com/jquery-latest.min.js"></script>
  <script src="/socket.io/socket.io.js"></script>
  <script>
jQuery(function($){
  var socket = io.connect();
  var $messageForm = $('#send-message');
  var $messageBox = $('#message');
  var $chat = $('#chat');

  $messageForm.submit(function(e){
    e.preventDefault();
    socket.emit('send message', $messageBox.val());
    $messageBox.val('');
  });

  socket.on('new message', function(data){
    $chat.append(data + "<br/>");


  });
})
  </script>
</body>
</html>

请注意,在更改Feed上,您会收到以下文档:

{
  "new_val": {
    "id": "862e6410-f686-4a70-8a52-d4387181d4f2",
    "title": "12"
  },
  "old_val": null
}

如果您返回整个文档,那么客户端$chat.append(data + "<br/>")上的字符串concat可能会收到错误或字符串'object Object',因为数据是对象,而不是字符串。

如果只返回这样的标题:

io.emit('new message', item.new_val.title);

然后字符串concat将运行正常。

此外,您的代码非常混乱。我建议你通常会得到一些基本的JavaScript基础。