Socket.io js無法連接

我有一個node.js服務器在端口8443上運行。每當我嘗試通過瀏覽器運行應用程序時，我的socket.io會在URL最後變成紅色前保持連接大約20秒。Socket.io js無法連接

編輯3：這是安裝在服務器上我的目錄結構，現在有更新的文件

/var/www/html/nodetest/

這裏面

/node_modules 
/app.js 
/index.html

節點JS。

這裏是我的主app.js代碼（如在回答提示）：

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

    // Run server to listen on port 8443. 
    server = app.listen(8443,() => { 
    console.log('listening on *:8443'); 
}); 

io.listen(server); 

io.sockets.on('connection', function(socket) { 
    socket.emit('message', 'this is the message emitted by server'); 
    }); 

app.get('/', function(req, res){ 
    fs.readFile(__dirname + 'index.html', function(error, data) { 
     res.writeHead(200); 
     res.end(data);   
    }); 
});

這是我的客戶端瀏覽器端代碼：

<html> 
<head> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.5.1  
/socket.io.min.js"></script> 
    <script type="text/javascript"> 
     var websocket; 
     function onload() { 
     websocket = io.connect(); 
     websocket.on('message',function(data) { 
      console.log('Received a message from the server!',data); 
     }); 

    }; 
    </script> 
</head> 
<body onload="onload()"> 
    <div id="divId"></div> 
</body> 
</html>

以下是錯誤

的圖像

現在它顯示404錯誤

來源

2016-11-12 Arth Parikh

什麼是它變成了錯誤？ –

@JustGameDev沒有錯誤類型顯示。它只是嘗試連接超過20秒，然後URL變成紅色。 –

服務器和客戶端的端口不同。 – ppovoski

我已經修改了代碼，根據自己的需要。該代碼正在工作，因爲它顯示了在瀏覽器的控制檯中加載後服務器發出的消息，如下圖所示。

Server.js：

let express = require('express') 
let app = express(); 
let http = require('http').Server(app); 
let io = require('socket.io')(http); 

let port = 8443; 
var fs = require('fs'); 
var path = require('path'); 

app.get('/', function (req, res) { 
    fs.readFile(path.join(__dirname, 'index.html'), function (error, data) { 
     res.writeHead(200); 
     res.end(data); 
    }); 
}); 

// Run server to listen on port 8443. 
http.listen(port, function() { 
    console.log(`listning on ${port}`); 
}); 

io.on('connection', function (socket) { 
    socket.emit('message', 'this is the message emitted by server'); 
    socket.on('disconnect', function() { 
     console.log('Client disconnected'); 
    }); 
});

的index.html

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta charset="utf-8" /> 
    <title></title> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.5.1/socket.io.min.js"></script> 
    <script type="text/javascript"> 
     var websocket; 
     function onload() { 
      websocket = io().connect(); 
      websocket.on('message', function (data) { 
       console.log('Received a message from the server!', data); 
      }); 

     }; 
    </script> 

</head> 
<body onload="onload();"> 

</body> 
</html>

的出來說就是如下：

來源

2016-11-12 06:08:05

謝謝你的代碼。但仍然不起作用。 –

你面臨的錯誤或問題是什麼？你可以使用所做的更新來編輯你的問題嗎？ –

Gaikwasd現在檢查 –

你正在以我還沒有看到的方式做到這一點。這是一個正在工作的例子。主要區別是我的web服務器返回我正在與套接字連接的文件。

編輯：我更新了這個使用你的網絡服務器。我修改它使它成爲服務器的index.html文件。

網絡服務器：

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

    // Run server to listen on port 8000. 
    server = app.listen(8447,() => { 
     console.log('listening on *:8447'); 
    }); 

    io.listen(server); 

    io.sockets.on('connection', function(socket) { 
     socket.emit('message', 'this is the message emitted by server'); 
    }); 

    app.get('/', function(req, res){ 
     fs.readFile(__dirname + '/index.html', function(error, data) { 
     res.writeHead(200); 
     res.end(data);   
     }); 
    });

的index.html

<html> 
    <head> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.5.1/socket.io.min.js"></script> 
     <script type="text/javascript"> 
     var websocket; 
     function onload() { 
      websocket = io.connect(); 
      websocket.on('connect',function() { 
       console.log('Client has connected to the server!'); 
      }); 
      websocket.on('message',function(data) { 
       console.log('Received a message from the server!',data); 
      }); 
      websocket.on('disconnect',function() { 
       console.log('The client has disconnected!'); 
      }); 
     }; 
     </script> 
    </head> 
    <body onload="onload()"> 
     <div id="divId"></div> 
    </body> 
</html>

來源

2016-11-12 06:05:07 ppovoski

謝謝@ppovoski我試過你的代碼。但現在它爲socket.io引發404錯誤，js –

運行'npm install socketio'。 – ppovoski

或者用你的cloudflare行替換我的src行。 – ppovoski

你正在創建兩個單獨的服務器，僅啓動其中之一，所以你的socket.io服務器永遠不會啓動。

更改此：

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

    // Run server to listen on port 8000. 
    server = app.listen(8447,() => { 
    console.log('listening on *:8447'); 
    });

這樣：

var app = require('express')(); 

    // Run server to listen on port 8000. 
    var server = app.listen(8447,() => { 
    console.log('listening on *:8447'); 
    }); 
    var io = require('socket.io')(server);

app.listen()創建自己的服務器，所以你不想使用它和http.createServer()。

下面是app.listen()代碼，以便你可以看到它是如何工作的：

app.listen = function(){ 
    var server = http.createServer(this); 
    return server.listen.apply(server, arguments); 
};

所以，你可以看到你http.createServer()創建然後綁定到socket.io服務器從未開始.listen()。

來源

2016-11-13 01:53:38 jfriend00

我試過你的解決方案，但它仍然顯示與我的問題中添加的圖像相同的錯誤。 –

@ArthParikh - 那麼你還有其他一些問題需要解決，因爲這絕對是你錯誤的第一件事。 – jfriend00

你犯了一個簡單的錯誤。在您的html文件中，將socket.io庫文件源https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.5.1/socket.io.min.js更改爲socket.io cdn sorce，即https://cdn.socket.io/socket.io-1.4.5.js。

之後，運行重新啓動你的應用程序。

如果喲再次獲得404，然後在你的HTML代替websocket = io.connect();到websocket = io.connect(your_server_domain_or_host_name:nodejs_server_running_port);

來源

2016-11-16 05:45:06 Emran

看到這個答案[希望它會工作]（http://stackoverflow.com/a/40624874/3176120）@ arth-parikh – Emran

不，我試過這個解決方案仍然URL嘗試連接，但不工作。 –

Socket.io js無法連接

回答

相關問題