Socket.io 8888端口和网络服务器的80端口 - 不能将二者结合起来
我有以下的node.js服务器端代码:Socket.io 8888端口和网络服务器的80端口 - 不能将二者结合起来
var app = require('http').createServer(handler)
, io = require('socket.io').listen(app)
, fs = require('fs')
app.listen(8888);
var fn='/home/eamorr/workspace/node_proxy_remote5/data';
function handler (req, res) {
fs.readFile(__dirname + '/index.html',
function (err, data) {
if (err) {
res.writeHead(500);
return res.end('Error loading index.html');
}
res.writeHead(200);
res.end(data);
});
}
io.sockets.on('connection', function (socket) {
fs.watchFile(fn,function(curr,prev){
//curr.time
fs.readFile(fn,function(err,data){
socket.emit('data',data.toString());
console.log(data);
});
});
});
正如你所看到的,我看文件并向浏览器发送修改。
在客户端,我有:
<html>
<head>
<script src="/socket.io/socket.io.js"></script>
<script type="text/javascript" src="./jqPlot/jquery.min.js"></script>
<script type="text/javascript" src="./jqPlot/jquery.jqplot.min.js"></script>
<script type="text/javascript" src="./jqPlot/plugins/jqplot.canvasTextRenderer.min.js"></script>
<script type="text/javascript" src="./jqPlot/plugins/jqplot.canvasAxisLabelRenderer.min.js"></script>
<link rel="stylesheet" type="text/css" href="./jqPlot/jquery.jqplot.min.css" />
</head>
<body>
<script type="text/javascript">
var socket = io.connect('http://localhost:8888');
socket.on('data', function (data) {
console.log(data);
//socket.emit('my other event', { my: 'data' });
});
</script>
<div id="chart2" style="height:300px; width:500px;"></div>
<script type="text/javascript">
$(document).ready(function(){
var plot2 = $.jqplot ('chart2', [[3,7,9,1,5,3,8,2,5]], {
// Give the plot a title.
title: 'Bandwidth over port 10001',
// You can specify options for all axes on the plot at once with
// the axesDefaults object. Here, we're using a canvas renderer
// to draw the axis label which allows rotated text.
axesDefaults: {
labelRenderer: $.jqplot.CanvasAxisLabelRenderer
},
// Likewise, seriesDefaults specifies default options for all
// series in a plot. Options specified in seriesDefaults or
// axesDefaults can be overridden by individual series or
// axes options.
// Here we turn on smoothing for the line.
seriesDefaults: {
rendererOptions: {
smooth: true
}
},
// An axes object holds options for all axes.
// Allowable axes are xaxis, x2axis, yaxis, y2axis, y3axis, ...
// Up to 9 y axes are supported.
axes: {
// options for each axis are specified in seperate option objects.
xaxis: {
label: "X Axis",
// Turn off "padding". This will allow data point to lie on the
// edges of the grid. Default padding is 1.2 and will keep all
// points inside the bounds of the grid.
pad: 0
},
yaxis: {
label: "Y Axis"
}
}
});
});
</script>
</body>
</html>
正如你所看到的,我想提请使用jqPlot从服务器发送的数据的图表。
我用这段代码的问题是,如果我导航到http://localhost:80,图表显示正常,但没有启动websocket。如果我导航到http://localhost:8888,图表不会显示,但websocket工作正常!我怎样才能结合node.js和jQuery?
提前许多感谢,
服务器绑定套接字到特定的端口和数据来系统重定向基于解决端口。
您的Apache正在处理特定的端口。它具有绑定到特定端口的监听套接字。默认情况下,它是80.
当您导航到localhost:80时,您的浏览器创建与Apache的连接,并且它们交换一些数据和htmls。
然后,当您使用JS创建WebSocket时,浏览器会创建套接字并尝试连接到提供的地址和端口。如果您的websocket服务器绑定到端口8888,那么它将成功连接到它。
然后,如果您试图在浏览器顶端localhost:8888中导航,那么浏览器会创建与服务器的连接,但是在Port 8888上您拥有WebSockets服务器,它们将连接,但它们将在握手时失败并且其他事情。
Apache中的主机文件是一个端口,而websockets服务器是另一个端口。 查看一下info关于什么是端口以及它们是如何工作的。
真的很有用的答案。谢谢。 – miksiii 2015-01-10 19:35:53
我无法在端口80上看到监听,只有'app.listen(8888);'。也许这是一个[同源的政策问题](http://en.wikipedia.org/wiki/Same_origin_policy)? – mindandmedia 2012-02-29 10:11:24
当我在8888上收听时,我在jQuery文件中遇到了一些错误。例如“在XML表达式中缺少} [Break On This Error]”你认为socket.io和jQuery之间存在一些冲突吗? – Eamorr 2012-02-29 10:21:49
好的,我现在正在工作......我只需要执行以下操作:“”“而不是” “Woop woop! – Eamorr 2012-02-29 10:34:56