2016-06-18 42 views
0

私はsocket.ioでチャットルームを作って表現しました。私のローカルホストで作業していましたが、githubにアップロードすると動作しません。 私はウェブ上で多くの時間を捜しましたが、何も見つかりませんでした。私を助けることができれば、それは素晴らしいことでしょう。socket.ioはサーバー上で動作しませんが、私のlocalhostでは動作しません

コード:HTML(クライアント)

<html> 
<head> 
    <title>Chat with your friend</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> 

app.js(サーバー)

var express = require('express'), 
app = express(), 
server = require('http').createServer(app), 
io = require('socket.io').listen(server); 

    server.listen(8080); 

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

io.sockets.on('connection', function(socket){ 
socket.on('send message', function(data){ 
    io.sockets.emit('new message', data);  
}); 
}); 

package.json:

{ 
"name": "Chat", 
"version": "0.1.0", 
"priviate": true, 
"dependencies": { 
    "socket.io": "1.4.6", 
    "express": "4.14.0" 
    } 
} 
+0

「Githubでアップロード」とは何ですか?あなたのサーバーはどこにありますか? – jfriend00

答えて

0

はgithubの上でコードを置くことが実行されませんあなたのためのサーバー。

HyperDevはあなたが望むものかもしれません。

無料でノードアプリケーションを実行します。 100%の時間を費やしてはいけません。

コードをprojectにコピーしました。

は、それがhyperdevに軌道に乗るためにいくつかの小さな変更をしなければならなかった:

  • は今3000
  • は今
  • は、あなたが入力ミスのhttpではなくhttpsのソースからのjQueryをロードポートでリッスン「プライベート」 in package.json;)

実行中のサイトを表示するには、左上の[表示]をクリックします。

これはあなた自身のプロジェクトにコピーすることができます。「ホリーブッシュ」、左上、「リミックスプロジェクト」をクリックします。その後、あなたはそれを変更することができ、それはあなたのためにサーバーを更新します。

ノードの内容をテストするには最適な方法です。

関連する問題