So entschied ich mich schließlich, Node.js eine Chance zu geben. Ich beschloss, mit einer kleinen Chat-App zu gehen, um das Eis zu brechen. Das Tutorial, dem ich folge, stammt direkt von der socket.io-Site.Socket.io Chat Tutorial funktioniert nicht richtig
http://socket.io/get-started/chat/
Ich verfolge das Tutorial Wort für Wort und habe sogar versucht, den Code in den Quellcode zu kopieren und einzufügen und bin immer nicht, wo, wenn ich Text eingeben und versenden. Es soll in meiner Eingabeaufforderung erscheinen, ist es aber nicht.
Ich hatte den Benutzer verbunden und Benutzer getrennt Nachrichten angezeigt, aber ich bin ratlos auf diesem, wie ich das Tutorial Schritt für Schritt gefolgt bin.
Index.js
var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
app.get('/', function(req, res) {
res.sendFile('/chat/index.html');
});
io.on('connection', function(socket){
socket.on('chat message', function(msg){
console.log('message: ' + msg);
});
});
http.listen(3000, function() {
console.log('Listening on *:3000');
});
Index.HTML:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Chat</title>
<script src="/socket.io/socket.io.js"></script>
<script src="http://code.jquery.com/jquery-1.11.1.js"></script>
<script>
var socket = io();
$('form').submit(function(){
socket.emit('chat message', $('#m').val());
$('#m').val('');
return false;
});
</script>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font: 13px Helvetica, Arial; }
form { background: #000; padding: 3px; position: fixed; bottom: 0; width: 100%; }
form input { border: 0; padding: 10px; width: 90%; margin-right: .5%; }
form button { width: 9%; background: rgb(130, 224, 255); border: none; padding: 10px; }
#messages { list-style-type: none; margin: 0; padding: 0; }
#messages li { padding: 5px 10px; }
#messages li:nth-child(odd) { background: #eee; }
</style>
</head>
<body>
<ul id="messages"></ul>
<form action="">
<input id="m" autocomplete="off" /><button>Send</button>
</form>
</body>
</html>
Ich nehme ich etwas, wo gefoult, aber sehe es nicht, obwohl ich versucht haben, und kopieren und einfügen. Wenn es darauf ankommt, verwende ich Windows 8.1 und Chrome. Ich habe nachgesehen und konnte auch keine Antwort auf dieses Problem finden. Jede Hilfe wäre großartig.
EDIT: Das Problem war mit jQuery, aus irgendeinem Grund reagiert es nicht wie es sollte. Nach dem Umschreiben des Skripts in Vanille funktioniert es wie beabsichtigt.
Index.js - JavaScript
<script>
var socket = io();
function sendMessage() {
var msg = document.getElementById('m');
socket.emit('message', msg.value);
msg.value = '';
return false;
}
</script>
HTML:
<form action="" onsubmit="javascript:sendMessage();">
<input id="m" autocomplete="off" /><button>Send</button>
</form>
Können Sie eine beliebige Konsolenausgabe für den Server und die Clientseite bereitstellen? – jmar777
Keine Fehler auf beiden Seiten. Das ist was ich frustrierend finde. –