Socket.IO連接輪詢說錯誤404未找到

我正在使用下面鏈接中的白板繪圖畫布。 https://socket.io/demos/whiteboard/Socket.IO連接輪詢說錯誤404未找到

我按照所有的設置要求，但是當我運行應用程序，很具有低於此錯誤控制檯

Failed to load resource: the server responded with a status of 404 (Not Found) 
socket.io.js:1 
GET http://localhost/socket.io/?EIO=3&transport=polling&t=1505327119965-1 404 (Not Found) 
i.create @ socket.io.js:1 
i @ socket.io.js:1 
o.request @ socket.io.js:1 
o.doPoll @ socket.io.js:1 
n.poll @ socket.io.js:2 
n.doOpen @ socket.io.js:2 
n.open @ socket.io.js:1 
r.open @ socket.io.js:1 
r @ socket.io.js:1 
r @ socket.io.js:1 
n.open.n.connect @ socket.io.js:1 
(anonymous) @ socket.io.js:1 
setTimeout (async) 
n.reconnect @ socket.io.js:1 
n.maybeReconnectOnOpen @ socket.io.js:1 
(anonymous) @ socket.io.js:1 
n.emit @ socket.io.js:1 
r.onError @ socket.io.js:1 
(anonymous) @ socket.io.js:1 
n.emit @ socket.io.js:1 
n.onError @ socket.io.js:1 
(anonymous) @ socket.io.js:1 
n.emit @ socket.io.js:1 
i.onError @ socket.io.js:1 
(anonymous) @ socket.io.js:1 
setTimeout (async) 
hasXDR.e.onreadystatechange @ socket.io.js:1 
socket.io.js:1 
GET http://localhost/socket.io/?EIO=3&transport=polling&t=1505327122954-2 404 (Not Found)

好像Socket.Io沒有得到響應讀心人。請有人幫我解決這個問題。

這裏是server.js

const express = require('express'); 
const app = express(); 
const http = require('http').Server(app); 
const io = require('socket.io')(http); 
const port = process.env.PORT || 3000; 

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

function onConnection(socket){ 
    socket.on('drawing', (data) => socket.broadcast.emit('drawing', data)); 
} 

io.on('connection', onConnection); 

http.listen(port,() => console.log('listening on port ' + port));

這裏是index.html的

<!doctype html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title></title> 


<script src="jquery.min.js"></script> 

    <style> 

.whiteboard { 
    height: 100%; 
    width: 100%; 
    position: absolute; 
    left: 0; 
    right: 0; 
    bottom: 0; 
    top: 0; 
} 


</style> 
</head> 
<body> 

    <canvas class="whiteboard" ></canvas> 

    <script src="./socket.io/socket.io.js"></script> 
    <script> 
'use strict'; 

(function() { 

    var socket = io(); 
    var canvas = document.getElementsByClassName('whiteboard')[0]; 
    var colors = document.getElementsByClassName('color'); 
    var context = canvas.getContext('2d'); 

    var current = { 
    color: 'black' 
    }; 
    var drawing = false; 

    canvas.addEventListener('mousedown', onMouseDown, false); 
    canvas.addEventListener('mouseup', onMouseUp, false); 
    canvas.addEventListener('mouseout', onMouseUp, false); 
    canvas.addEventListener('mousemove', throttle(onMouseMove, 10), false); 

    for (var i = 0; i < colors.length; i++){ 
    colors[i].addEventListener('click', onColorUpdate, false); 
    } 

    socket.on('drawing', onDrawingEvent); 

    window.addEventListener('resize', onResize, false); 
    onResize(); 


    function drawLine(x0, y0, x1, y1, color, emit){ 
    context.beginPath(); 
    context.moveTo(x0, y0); 
    context.lineTo(x1, y1); 
    context.strokeStyle = color; 
    context.lineWidth = 2; 
    context.stroke(); 
    context.closePath(); 

    if (!emit) { return; } 
    var w = canvas.width; 
    var h = canvas.height; 

    socket.emit('drawing', { 
     x0: x0/w, 
     y0: y0/h, 
     x1: x1/w, 
     y1: y1/h, 
     color: color 
    }); 
    } 

    function onMouseDown(e){ 
    drawing = true; 
    current.x = e.clientX; 
    current.y = e.clientY; 
    } 

    function onMouseUp(e){ 
    if (!drawing) { return; } 
    drawing = false; 
    drawLine(current.x, current.y, e.clientX, e.clientY, current.color, true); 
    } 

    function onMouseMove(e){ 
    if (!drawing) { return; } 
    drawLine(current.x, current.y, e.clientX, e.clientY, current.color, true); 
    current.x = e.clientX; 
    current.y = e.clientY; 
    } 

    function onColorUpdate(e){ 
    current.color = e.target.className.split(' ')[1]; 
    } 

    // limit the number of events per second 
    function throttle(callback, delay) { 
    var previousCall = new Date().getTime(); 
    return function() { 
     var time = new Date().getTime(); 

     if ((time - previousCall) >= delay) { 
     previousCall = time; 
     callback.apply(null, arguments); 
     } 
    }; 
    } 

    function onDrawingEvent(data){ 
    var w = canvas.width; 
    var h = canvas.height; 
    drawLine(data.x0 * w, data.y0 * h, data.x1 * w, data.y1 * h, data.color); 
    } 

    // make the canvas fill its parent 
    function onResize() { 
    canvas.width = window.innerWidth; 
    canvas.height = window.innerHeight; 
    } 

})(); 
</script> 
</body> 
</html>

來源

2017-09-13 bowman87

我認爲你需要chec k它的網址應該是ws：// –

哪些url我檢查 – bowman87

websockets網址是ws：//嘗試使用測試應用程序https://www.websocket.org/echo.html –

我認爲這個問題是你如何設置服務器，請嘗試建立這樣：

const http = require('http'); 
const express = require('express'); 
const socketIO = require('socket.io'); 

var app = express(); 
var server = http.createServer(app); 
var io = socketIO(server); 

app.use(express.static(__dirname + '/public')); 
const port = process.env.PORT || 3000; 

// add your socketio code here 

server.listen(port,() => { 
    console.log(`Server is up on port ${port}!`); 
});

來源

2017-09-13 19:46:09

Socket.IO連接輪詢說錯誤404未找到

回答

相關問題