Question

我是nodejs的新手。

var io = require('socket.io').listen(server);
users = [];
connections = [];

server.listen(process.env.PORT || 3000);
console.log('server running....on Pro');

app.get ('/', function(req, res){
	res.sendFile(__dirname+'/index.html');
});

    io.sockets.on('connections',function(socket){
	connections.push(socket);
	console.log('connected: %s sockets is connected', connections.length);

	//Disconnet function 
	socket.on('disconnect', function(data){
		
		users.splice(users.indexOf(socket.username),1);
		updateUsernames();
		connections.splice(connections.indexOf(socket),1);
		console.log('Disconneted: %s sockets connected', connections.length);
	});
	//send messege
	socket.on('send massege', function(data){
	io.sockets.emit('new massege', {msg: data, user:socket.username});
	});

	//new user
	socket.on('new user', function(data, callback){
		callback(true);
		socket.username = data;
		user.push(socket.username);
		updateUsernames();

	});
	function updateUsernames(){
		io.sockets.emit('get users', users);
	}
});

<!DOCTYPE html>
<html>
<head>
	<title>Simple Chat App By Probhas</title>
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
	<script src="/socket.io/socket.io.js"></script>
	<style>
		body{
			margin-top: 30px;
		}
    #messageArea{
      display: none;
    }
	</style>
</head>
<body>
  	<div class="container">
      <div id="userFormArea" class="row">
          <div class="col-md-12">
              <form id="userForm">
            <div class="form-group">
              <label>Enter Username</label>
              <input class="form-control" id="Username"><br/>
              <input type="submit" class="btn btn-primary" value="Login">
            </div>
          </form>
          </div>
      </div>
  		<div id="messageArea" class="row">
  			<div class="col-md-4"></div>
  				<div class="well">
  					<h3>Online Users</h3>
  					<ul class="list_group" id="users"></ul>
  				</div>
  			<div class="col-md-8"></div>
  				<div class="chat" id="chat"></div>
  				<form id="messageform">
  					<div class="form-group">
  						<label>Enter Your Massege</label>
  						<textarea class="form-control" id="message"></textarea><br/>
  						<input type="submit" class="btn btn-primary" value="send Massege">
  					</div>
  				</form>
  		</div>	
  	</div>	
  	<script>
  		$(function(){
  			var socket = io.connect();
        var $messageform = $('#messageform');
        var $message = $('#messageform');
        var $chat = $('chat');
        var $messageArea = $('#messageArea');
        var $userFormArea = $('#userFormArea');
        var $userForm = $('#userForm');
        var $users = $('#users');
        var $Username = $('#Username');

          $messageform.submit(function(e){
            e.preventDefault();
            socket.emit('send massege', $message.val());
            $message.val('');
          });
          socket.on('new massege', function(data){
            $chat.append('<div class="well"><strong>'+data.user+'</strong>:'+data.msg+'</div>');
          });

          $userform.submit(function(e){
            e.preventDefault();
            socket.emit('new user', $Username.val(),function(data){
              if (data){
                $userFormArea.hide();
                $messageArea.show();

              }
            });
            $Username.val('');
          });
          socket.on('get users', function(data){
            var html = '';
            for (i=0; i<data.length; i++){
              html += '<li class = "list-group-item">'+data[i]+'</li>';
             }
             $users.html(html);
          });
  		});
  	</script>

</body>
</html>

我使用socket.io，Node.js和Express构建实时聊天应用程序。我跟随video tutorial i代码与教程和应用程序一样在我的localhost上运行节点服务器。但它没有显示任何输出。我认为它可以解决我的变量声明和html中的id.but我到目前为止没有找到错误。这是我的server.js文件和index.html文件

Answer 1

这将有效：

<强> index.js：

var app = require('express')();
var server = require('http').Server(app);
var io = require('socket.io').listen(server);
users = [];
connections = [];

server.listen(process.env.PORT || 3000);
console.log('server running....on Pro');


io.on('connection',function(socket){
    connections.push(socket);
    console.log('connected: %s sockets is connected', connections.length);

    //Disconnet function 
    socket.on('disconnect', function(data){

        users.splice(users.indexOf(socket.username),1);
        updateUsernames();
        connections.splice(connections.indexOf(socket),1);
        console.log('Disconneted: %s sockets connected', connections.length);
    });
    //send messege
    socket.on('send massege', function(data){
    io.sockets.emit('new massege', {msg: data, user:socket.username});
    });

    //new user
    socket.on('new user', function(data, callback){
        callback(true);
        socket.username = data;
        users.push(socket.username);
        updateUsernames();

    });
    function updateUsernames(){
        io.sockets.emit('get users', users);
    }
});

<强>的index.html：

<!DOCTYPE html>
<html>
<head>
    <title>Simple Chat App By Probhas</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="http://localhost:3000/socket.io/socket.io.js"></script>
    <style>
        body{
            margin-top: 30px;
        }
    #messageArea{
      display: none;
    }
    </style>
</head>
<body>
    <div class="container">
      <div id="userFormArea" class="row">
          <div class="col-md-12">
              <form id="userForm">
            <div class="form-group">
              <label>Enter Username</label>
              <input class="form-control" id="Username"><br/>
              <input type="submit" class="btn btn-primary" value="Login">
            </div>
          </form>
          </div>
      </div>
        <div id="messageArea" class="row">
            <div class="col-md-4"></div>
                <div class="well">
                    <h3>Online Users</h3>
                    <ul class="list_group" id="users"></ul>
                </div>
            <div class="col-md-8"></div>
                <div class="chat" id="chat"></div>
                <form id="messageform">
                    <div class="form-group">
                        <label>Enter Your Massege</label>
                        <textarea class="form-control" id="message"></textarea><br/>
                        <input type="submit" class="btn btn-primary" value="send Massege">
                    </div>
                </form>
        </div>  
    </div>  
    <script>
        $(function(){
            var socket = io.connect("http://localhost:3000/");
        var $messageform = $('#messageform');
        var $message = $('#message');
        var $chat = $('#chat');
        var $messageArea = $('#messageArea');
        var $userFormArea = $('#userFormArea');
        var $userForm = $('#userForm');
        var $users = $('#users');
        var $Username = $('#Username');

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

          socket.on('new massege', function(data){
            $chat.append('<div class="well"><strong>'+data.user+'</strong>:'+data.msg+'</div>');
          });

          $userForm.submit(function(e){
            e.preventDefault();
            socket.emit('new user', $Username.val(),function(data){
              if (data){
                $userFormArea.hide();
                $messageArea.show();

              }
            });
            $Username.val('');
          });
          socket.on('get users', function(data){
            var html = '';
            for (i=0; i<data.length; i++){
              html += '<li class = "list-group-item">'+data[i]+'</li>';
             }
             $users.html(html);
          });
        });
    </script>

</body>
</html>

正如你所看到的，我改变了一些小事。这个配置适合本地运行，当你在网站上托管它以后你应该/可以为了安全目的改进一些东西，但是现在它是一个很好的设置： - ）

Answer 2

试试这个

var Server = require('socket.io');
var io = new Server();

但请查看此Link

nodejs app在节点服务器上运行但未显示任何输出

2 个答案: