发送socket.io实例来表示路由

我正在尝试创build一个nodejs应用程序,它将使用他们的API在各种网站中进行search。 一旦从使用socket.io的API接收结果,结果将被发送到客户端。 然后前端将使用jQuery添加这些结果。

什么是实施这个最好的方法?

到目前为止我已经尝试过:

示例代码1

起初,我创build了一个快递中间件,将套接字添加到请求中 –

var socketMiddleWare = function(req, res, next){ io.on('connection', function(socket){ console.log(io.engine.clientsCount + " clients connected."); req.socket = socket; socket.on('disconnect', function(){ console.log(io.engine.clientsCount + " clients after disconnec."); }); }); next(); }; 

然后将这个中间件添加到我的路线 –

 app.use('/users', socketMiddleWare, users); 

它的工作原理,但问题是每次用户刷新页面时都会创build多个事件监听器。

示例代码2

所以然后我试了(示例代码)

 io.on('connection', function(socket){ console.log("user connected"); global.socket = socket; socket.on('disconnect', function(){ console.log("disconnect"); }); socket.on('my message', function(){ console.log("My message received"); }); }); 

在我的testing路线上,我做到了

 var express = require('express'); var router = express.Router(); /* GET home page. */ router.get('/', function(req, res, next) { if(socket){ socket.emit('response', 'nothing'); } res.render('index', { title: 'Express' }); }); module.exports = router; 

它解决了刷新多事件监听器的前一个问题,但大多数时候它不能发出响应。 甚至它发出我的浏览器无法显示的结果。 在客户端,我做了这样的事情 –

 var socket = io.connect('http://localhost'); socket.on('response', function(data){ console.log(data); document.getElementById("change").innerHTML += data; }); 

我可以在浏览器控制台中看到响应,但我的浏览器在消失之前显示几毫秒的更改。

我认为主要的问题是在build立套接字连接之前加载页面。

我目前正在学习node.js和socket.io。 所以请帮助我。

结论

我有计划添加社交networkingfunction,如一对一的消息,生活的朋友饲料主页上的更新等未来使用socket.io。 请让我知道是否有任何好的文档或开源项目可以帮助我实现它。

我正在寻找最近几天的解决scheme,但迄今为止没有运气。 我准备学习任何新的方法或完全重写我的代码。

TL; DR

当用户客户端search项目时,当新数据可用时,将内容推送到请求内容的客户端。 通过他们的API处理来自网站(例如“ 电影数据库 ”和“ TheTVDB.com ”)的响应之后,数据可用。

您可以使用套接字的ID来跟踪哪个套接字发送结果。

客户

当用户然后search某些内容时,该查询参数中包含该ID。

 <body> <form> <!-- Disable the search bar until the socket is connected --> <input type="search" name="q" placeholder="Search" disabled> </form> <div id="results"></div> <script src="/socket.io/socket.io.js"></script> <script> var resultsElement = document.querySelector("#results"); var search = document.querySelector("form [type=search]"); var socket = io("http://localhost:3000"); socket.on("connect", function(){ search.disabled = false; }); socket.on("results", function(results){ for(var i = 0;i < results.length;i++){ var result = document.createElement("div"); result.textContent = results[i]; resultsElement.appendChild(result); } }); document.querySelector("form").addEventListener("submit", function(event){ fetch("/search?socketID=" + encodeURIComponent(socket.id) + "&q=" + encodeURIComponent(search.value)); event.preventDefault(); }); </script> </body> 

服务器

当服务器收到search请求时,它使用查询参数中发送的套接字ID获取套接字,并开始将结果发送回客户端。

 var app = require("http").createServer(handler); var io = require("socket.io")(app); var fs = require("fs"); var url = require("url"); app.listen(3000); function handler(req, res) { var query = url.parse(req.url, true).query; if(req.url.startsWith("/search")){ var results = ["things", "stuff", "items"]; // Server-side IDs have "/#" in front of them var socket = io.sockets.connected["/#" + query.socketID]; if(socket){ // Get and send "search results" var interval = setInterval(function(){ var popped = results.pop(); if(popped){ socket.emit("results", [query.q + " " + popped]); }else{ clearInterval(interval); } }, 1000); } res.writeHead(204); res.end(); }else{ fs.readFile(__dirname + "/index.html", function(err, data) { res.writeHead(200); res.end(data); }); } }