本文概述
- 要求
- 实现
Socket.IO为你处理大量技术替代方案带来的顺畅降级, 以实现双向近距离通信流(Web套接字, ajax长轮询, 闪存等)。此外, 它可以为你处理浏览器的不一致和不同的支持级别, 并且至少在目前, 它比使用普通的Web套接字更容易使用。
在本文中, 你将在几分钟内学习如何轻松使用Socket.IO和Express Framework, 这是极简主义的Web框架。
要求 在Node.js控制台中执行以下命令, 在项目上安装Express:
npm install express --save
同样, 在你的项目中安装Socket.IO, 并在Node.js控制台中执行以下命令:
npm install socket.io --save
你就可以开始了!
实现 为了正确使用Express和Socket.IO, 我们需要使用node.js的http模块, 因为它将由服务器负责。变量服务器是createServer方法的返回对象(该方法将express app作为第一个参数), 并且服务器变量将在socket.io模块的listen方法中用作第一个参数。
在任意位置创建文件(名为server.js), 并在其上添加以下代码:
注意:要单独启动服务器, listen方法需要从服务器变量而不是应用程序本身执行。你需要了解这一点, 以防止出现诸如” SocketIO:err_connection_refused” 之类的已知错误。
var http = require('http');
var express = require('express');
var app = express();
var server = http.createServer(app);
// Pass a http.Server instance to the listen methodvar io = require('socket.io').listen(server);
// The server should start listeningserver.listen(80);
// Register the index route of your app that returns the HTML fileapp.get('/', function (req, res) {console.log("Homepage");
res.sendFile(__dirname + '/index.html');
});
// Expose the node_modules folder as static resources (to access socket.io.js in the browser)app.use('/static', express.static('node_modules'));
// Handle connectionio.on('connection', function (socket) {console.log("Connected succesfully to the socket ...");
var news = [{ title: 'The cure of the Sadness is to play Videogames', date:'04.10.2016'}, { title: 'Batman saves Racoon City, the Joker is infected once again', date:'05.10.2016'}, { title: "Deadpool doesn't want to do a third part of the franchise", date:'05.10.2016'}, { title: 'Quicksilver demand Warner Bros. due to plagiarism with Speedy Gonzales', date:'04.10.2016'}, ];
// Send news on the socketsocket.emit('news', news);
socket.on('my other event', function (data) {console.log(data);
});
});
我们的服务器端代码应首先使用。如你所见, 当浏览器与套接字之间存在传入连接时, 我们将在Node控制台中打印” 已成功连接到套接字” 消息, 并将一些信息发送到浏览器中的活动套接字(在这种情况下, 我们将发送一个简单的对象, 其中包含一些” 新闻” 以呈现在index.html文件中)。
注意:app.use(‘ / static’ )行将显示服务器中的node_modules文件夹, 以便访问index.html中的socket.io.js文件。你可以删除此行, 然后从socket.io文件夹中复制socket.io.js, 然后直接将其复制到index.html所在的目录中, 以防你不想公开此文件夹。
同样, 我们刚刚将索引路由(/)添加了一个文件作为返回值(index.html), 该文件将包含以下代码:
<
!DOCTYPE html>
<
html>
<
head>
<
meta charset="utf-8">
<
title>
Socket.io<
/title>
<
/head>
<
body>
<
h1>
Express and socket.io<
/h1>
<
div id="news-list">
<
/div>
<
script src="http://www.srcmini.com/static/socket.io/node_modules/socket.io-client/socket.io.js">
<
/script>
<
script>
var socket = io('http://localhost:80');
socket.on('news', function (data) {var div = document.getElementById("news-list");
console.log("Rendering news : ", data);
for(var i = 0;
i <
data.length;
i++){var newsItem = data[i];
div.innerHTML += "<
h3>
" + newsItem.title + ' <
small>
'+ newsItem.date + "<
/small>
<
/h3>
<
br>
";
}socket.emit('my other event', { my: 'data' });
});
<
/script>
<
/body>
<
/html>
声明套接字变量将打开浏览器和服务器之间的连接(通过套接字), 这将导致在server.js文件中执行on(” connection” )方法, 并发送将在其中处理的信息风景。
现在, 你只需要测试一下!在节点控制台中执行server.js文件并执行以下命令:
node server.js
在你喜欢的浏览器中导航到http:// localhost:80, 套接字连接应该正常工作(并且按照我们的逻辑计划, 将绘制新闻):
文章图片
【如何在Node.js中的Express Framework中正确使用Socket.IO】玩得开心 !
推荐阅读
- 如何在Node Web服务器中为HTTPS连接创建所需的.pem证书
- 建立多供应商电子商务网站的最大好处
- 送餐应用和服务如何改变社会
- 如何使用Curl通过重定向从URL下载文件
- 专用代理与共享代理–选择哪种()
- 软件资产管理是建立更安全网络的关键吗()
- 如何使用Swift 5在MacOS中实现文件和目录选择器
- SEO趋势将关注2020
- 效能评估理论方法及应用-效能评估系统软件方法有哪些