Jeg har prøvet det, og den modificerede version nedenfor virker! De vigtigste ændringer var at placere mongoose-skemakoden på serversiden, og først ekko tilbage indholdet af tekstboksen på serveren efter en vellykket lagring i Mongo-databasen.
Se også mean.io websted for introduktion til MEAN-stakken, så lad mig vide, hvis du har spørgsmål til koden.
Ændret server.js:
var mongoose = require('mongoose')
var express = require('express'),
app = express(),
server = require('http').createServer(app),
io = require('socket.io').listen(server);
server.listen(3000);
app.get('/', function(req, res){
res.sendfile(__dirname + '/test.html');
});
io.sockets.on('connection', function(socket){
socket.on('send message', function(data){
var newMsg = new Chat({msg: '' + data});
console.log('saving newMsg: ' + newMsg);
newMsg.save(function(err){
console.log('saved, err = ' + err);
if(err) throw err;
console.log('echoeing back data =' + data);
io.sockets.emit('new message', data);
});
});
});
var chatSchema = mongoose.Schema({
msg: String,
created: {type: Date, default: Date.now}
});
var Chat = mongoose.model('Message', chatSchema);
mongoose.connect('mongodb://localhost/test', function(err){
if(err){
console.log(err);
} else{
console.log('Connected to mongodb!');
}
});
Dette er html-siden:
<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){
console.log('Received data: ' + data);
$chat.append(data + "<br/>");
});
});
</script>
</body>
</html>