问题描述
- nodejs写的聊天室chome一直在报错求解
- 写了一个聊天室,但是chrome控制台一直在报错,
这是我的项目目录:
html部分代码<!DOCTYPE html><html> <head> <meta charset=""utf-8"" /> <title></title> <link rel=""stylesheet"" href=""css/style.css"" /> <script src=""node_modules/socket.io/node_modules/socket.io-client/socket.io.js""></script> <script type=""text/javascript"" src=""js/script.js"" ></script> </head> <body onload=""window_onload()"" onunload=""window_onunload()""> <h1>Socket.IO聊天室</h1> <div id=""divContainerl""> <table id=""tbDlg"" border=""0"" cellpadding=""3"" cellspacing=""0"" width=""100%""> <tr id=""trDlg""> <td id=""tdDlg"" width=""5""> 用户名: <input id=""tbxUsername"" type=""text"" value=""游客"" size=""20"" /> <input id=""btnLogin"" type=""button"" value=""登录"" onclick=""btnLogin_onclick();"" /> <input id=""btnLogout"" type=""button"" value=""退出"" disabled onclick=""btnLogout_onclick();"" /> </td> </tr> </table> </div> <div id=""divLeft""> <div id=""divchat""></div> <div id=""divContainer3""> <table id=""tbDlg"" border=""0"" cellpadding=""3"" cellspacing=""0"" width=""100%""> <tr id=""trDlg""> <td valign=""top"" id=""tdDlg"" nowrap>对话</td> <td valign=""top"" id=""tdDlg""> <textarea id=""tbMsg"" cols=""255"" rows=""5"" style=""width: 100%;""></textarea> </td> <td valign=""top"" id=""tdDlg""> <input id=""btnSend"" type=""button"" value=""发送"" disabled onclick=""btnSend_onclick();"" /> </td> </tr> </table> </div> </div> <div id=""divRight""> 用户列表: </div> </body></html>
服务端的代码
var http = require('http');var express = require('express');var sio = require('socket.io');var app = express();var server = http.createServer(app);app.get('/'function(reqres){ res.sendFile( '/index.html' { root:__dirname })});server.listen(8020);var io = sio.listen(server);var name = [];io.sockets.on('connection'function(socket){ socket.on('login'function(name){ for(var i=0;i<names.length;i++){ if(names[i] == name){ socket.emit('duplicate'); return; } } names.push(name); io.sockets.emit('login'name); io.sockets.emit('sendClients'names); }); socket.on('chat'function(data){ io.sockets.emit('chat'data); }); socket.on('logout'function(name){ for(var i=0;i<names.length;i++){ if(names[i] == name){ names.splice(i1); break; } } socket.broadcast.emit('logout'name); io.sockets.emit('sendClients'names); });});
js脚本代码
var userNamesockettbxUsernametbxMsgdivChat;function window_onload(){ divChat = document.getElementById('tbxUsername'); tbxUsername = document.getElementById('tbxUsername'); tbxMsg = document.getElementById('tbMsg'); tbxUsername.focus(); tbxUsername.select();}function AddMsg(msg){ divChat.innerHTML += msg + '<br>'; if(divChat.scrollHeight > divChat.clientHeight){ divChat.scrollTop = divChat.scrollHeight - divChat.clientHeight; }}function btnLogin_onclick(){ if(tbxUsername.value.trim() == ''){ alert('请输入用户名'); return; } userName = tbxUsername.value.trim(); socket = io.connect(); socket.on('connect'function(){ AddMsg(""与聊天服务器的连接已建立。""); socket.on('login'function(name){ AddMsg('欢迎用户' + name + '进入聊天室'); }); socket.on('sendClients'function(names){ var divRight = document.getElementById('divRight'); var str = ''; names.forEach(function(name){ str += name + ""<br>""; }) divRight.innerHTML = ""用户列表<br/>""; divRight.innerHTML += str; }); socket.on('chat'function(data){ AddMsg(data.user + '说:' + data.msg); }); socket.on('disconnect'function(){ AddMsg('与聊天服务器连接已经断开。'); document.getElementById('btnSend').disabled = true; document.getElementById('btnLogout').disabled = true; document.getElementById('btnLogin').disabled = ''; var divRight = document.getElementById('divRight'); divRight.innerHTML = ""用户列表""; }); socket.on('logout'function(name){ AddMsg('用户' + name + '已经退出聊天室'); }); socket.on('duplicate'function(){ alert('该同户名已经被使用'); document.getElementById('btnSend').disabled = true; document.getElementById('btnLogout').disabled = true; document.getElementById('btnLogin').disabled = ''; }); }); socket.on('error'function(err){ AddMsg('与聊天室服务器连接发生错误'); socket.disconnect(); socket.removeAllListeners('connect'); io.sockets = {}; }); socket.emit('login'userName); document.getElementById('btnSend').disabled = ''; document.getElementById('btnLogout').disabled = ''; document.getElementById('btnLogin').disabled = true;}function btnSend_onclick(){ var msg = tbxMsg.value; if(msg.length > 0){ socket.emit('chat'{user:userNamemsg:msg}); tbxMsg.value = ''; }}function btnLogout_onclick(){ socket.emit('logout'userName); socket.disconnect(); socket.removeAllListeners('connect'); io.sockets = {}; AddMsg('用户' + userName + '退出聊天室:'); var divRight = document.getElementById('divRight'); divRight.innerHTML = ""用户列表""; document.getElementById('btnSend').disabled = 'disabled'; document.getElementById('btnLogout').disabled = 'disabled'; document.getElementById('btnLogin').disabled = '';}function window_onunload(){ socket.emit('logout'userName); socket.disconnect();}
求大神们帮帮忙十分感谢!!
解决方案
参考:http://blog.csdn.net/jiangcs520/article/details/11173749
解决方案二:
404访问不到啊,你看看对应的URL,你的服务器有处理对吗
时间: 2024-10-18 11:09:29