nodejs socket.io GET http：//domain/socket.io/？EIO = 3＆transport = polling＆t =導入socket.io時的LrTVonQ狀態404爲

Question

我的問題很簡單我實際上遇到錯誤404試圖在我的網頁上導入socket.io。我正在使用

<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.3/socket.io.js"></script> 

要導入socket.io。

如果我從頭標記中刪除此行，我很好，但是當它在那裏時，我在開發工具中看到404錯誤，而且我的計數器甚至沒有工作。

我想爲我的網站之一做一個實時查看器計數，但我從來沒有真正使用Node.js，所以這就是爲什麼我有一些麻煩。如果我的腳本中有錯誤，請原諒我。

對於服務器端腳本，文件名爲：viewercounter.js這是代碼

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

server.listen(port, function() { 
    console.log('Server listening at port %d', port); 
}); 

app.use(express.static(__dirname + '/public')); 

var count = 0 
io.on('connection', function(socket) { 
    count++; 
    socket.broadcast.emit('userupd', { 
     numUsers: count 
    }); 
    console.log(count); 

    socket.on('disconnect', function(){ 
     count--; 
     socket.broadcast.emit('userupd', { 
      numUsers: count 
     }); 
     console.log(count); 
    }); 
}); 

然後我直接在我的網頁上放置的，而不是做一個新的文件中客戶端腳本，我真的不看到它的重點。無論如何，該文件被稱爲：index.php 和代碼是在身體標記結束之前的文件的末尾，代碼前沒有其他js。

<script type="text/javascript"> 
$(function() { 
    var socket = io(); 

    socket.on('userupd', function (data) { 
    $('.counter').html(data); 
    }); 
}); 

編輯

通過尋找更深刻，我一直搞不明白，這是一個XMLHttpRequest的問題。事實上，當我剛剛導入的socket.io代碼試圖執行xhr.send（this.data）時，出現錯誤。任何人都知道我能如何解決這個問題 https://gyazo.com/53f64081a92b449e157df76c6c570178

EDIT2

在文件viewcounter.js更改端口後。它看起來像這樣：

// Setup basic express server 
var express = require('express'); 
var app = express(); 
var server = require('http').createServer(app); 
var io = require('socket.io')(server); 
var port = 80; 

server.listen(port, function() { 
    console.log('Server listening at port %d', port); 
}); 

// Routing 
app.use(express.static(__dirname + '/public')); 

var count = 0 
io.on('connection', function(socket) { 
    count++; 
    socket.broadcast.emit('userupd', { 
     numUsers: count 
    }); 
    console.log('New user: '); 

    socket.on('disconnect', function(){ 
     count--; 
     socket.broadcast.emit('userupd', { 
      numUsers: count 
     }); 
     console.log('Neg user:'); 
    }); 
    }); 

Answer 1

如果你的網頁是由Apache Web服務器來的80端口，你想的同一主機上創造的node.js一個socket.io服務器，那麼你需要爲該socket.io服務器選擇一個新端口，並且在連接到socket.io服務器時，需要確定要連接的端口，因爲默認端口爲80端口，但這不是您的socket.io服務器的位置是。

我建議使用端口8001像你最初爲你的socket.io服務器。請將你的node.js代碼改回。

然後，你可以在你的頁面從這個改變socket.io代碼：

<script type="text/javascript"> 
$(function() { 
    var socket = io(); 

    socket.on('userupd', function (data) { 
    $('.counter').html(data); 
    }); 
}); 
</script> 

這樣：

<script type="text/javascript"> 
$(function() { 
    var url = window.location.protocol + "//" + window.location.hostname + ":8001"; 
    var socket = io(url, {transports: ['websocket'], upgrade: false}); 

    socket.on('userupd', function (data) { 
    $('.counter').html(data); 
    }); 
}); 
</script> 

這將socket.io連接到相同的協議和主機你的網頁，但是一個不同的端口，它將只使用一個webSocket，所以你不會遇到socket.io通常嘗試用Ajax輪詢啓動連接的跨域問題。

如果你的插座。io服務器實際上位於與Apache服務器不同的主機上，那麼您需要將該主機放在URL中而不是window.location.hostname。