目录
钥匙要点
什么是Websocket?什么是socket.io?
…with:
>广播在聊天频道上收到的消息
>我们还需要将我的查询分类并将我的查询限制为最后10条消息,因为它包含时间戳,我们将使用MongoDB生成的_id(尽管在更可扩展的情况下,您将需要在聊天消息中创建一个专用时间戳),我们将限制函数调用以将结果限制在10条消息中。
在Azure
>
>我可以在我的Node.js Chatroom Web应用程序中添加多媒体支持吗?这可以通过集成Cloudinary或AWS S3(以存储和检索多媒体文件)等第三方服务或AWS S3来完成。您还可以使用socket.io实时发送和接收多媒体数据。
任何聊天室网络应用程序的功能。对于Node.js应用程序,您可以使用Passport.js,Passport.js是处理用户身份验证的流行中间件。它支持各种身份验证策略,包括本地用户名和密码,Oauth和JWT。
>我如何处理Node.js Chatroom Web中的错误App?
首页 web前端 js教程 构建一个node.js供电的聊天室网络应用:节点,mongodb和套接字

构建一个node.js供电的聊天室网络应用:节点,mongodb和套接字

Feb 20, 2025 am 09:30 AM

构建一个node.js供电的聊天室网络应用:节点,mongodb和套接字

钥匙要点

  • >该教程提供了使用node.js,mongodb和socket.io构建实时聊天室应用程序的逐步指南。聊天室将完全部署在云中。
  • >
  • >教程解释了如何使用socket.io创建基于双向事件的实时交流应用程序。它简化了大量使用Websocket的过程。
  • >
  • >教程显示了如何记录用户加入和离开聊天室以及如何在聊天频道上收到的消息传播到套接字上的所有其他连接。>>>>>>>>>
  • >教程演示了如何将聊天消息保存到mongoDB数据库,以及如何发射收到的最后10条消息,以向加入聊天室的每个新用户提供上下文。
  • >
  • >教程以聊天系统的结尾,能够向所有其他连接的客户端广播通过WebSocket收到的消息。系统将消息保存到数据库,并为每个新用户检索最后10条消息。
  • >
本文是Microsoft的Web开发技术系列的一部分。感谢您支持使SitietPoint成为可能的合作伙伴。 >该教程将使用可选的Visual Studio和Node.js工具作为开发环境。我为这两个工具免费下载提供了链接。这是中级文章的初学者 - 您有望了解HTML5和JavaScript。 第1部分 - Node.js

简介

第2部分 - 欢迎使用node.js和azure

第3部分 - 使用node.js,mongo and socket.io 构建后端
第4部分 - 使用Bootstrap构建聊天室UI

第5部分 - 将聊天室与WebSockets连接

第6部分 - 结局和调试远程node.js应用

第3部分 - 使用node.js,socket.io和mongo

建立聊天室后端

欢迎使用动手Node.js教程系列的第3部分:构建一个Node.js驱动的聊天室Web应用程序。 在本期中,我将向您展示如何使用您现有的基于Express的Node.js应用程序来创建聊天室后端,并提供WebSocket支持。

什么是Websocket?什么是socket.io?

websocket是一种协议,旨在允许Web应用程序通过Web浏览器和Web服务器之间的TCP(即进行双向通信)创建一个完整的通道。它与HTTP完全兼容,并使用TCP端口编号80。WebSocket允许Web应用程序成为实时,并支持客户端和服务器之间的高级交互。它得到了多个浏览器的支持,包括Internet Explorer,Google Chrome,Firefox,Safari和Opera。

> socket.io是一个JavaScript库和node.js模块,可让您简单,快速地创建基于双向事件的实时双向通信应用。它简化了大量使用Websocket的过程。我们将使用socket.io v1.0来制作我们的聊天室应用。

>

>将socket.io添加到package.json

package.json是一个包含与项目相关的各种元数据的文件,包括其依赖关系。 NPM可以使用此文件下载项目所需的模块。看一下package.json及其可以包含的交互式解释。>

>让我们将socket.io添加到项目中。有两种方法可以做到。

>

如果您一直关注教程系列,并且在Visual Studio设置中进行了一个项目,请右键单击项目的NPM部分,然后选择“安装新的NPM软件包……”

  1. >打开窗口后,搜索“ socket.io”,选择顶部结果,然后检查“添加到package.json”复选框。单击“安装软件包”按钮。这将将socket.io安装到您的项目中,并将其添加到package.json文件中。
package.json 构建一个node.js供电的聊天室网络应用:节点,mongodb和套接字

构建一个node.js供电的聊天室网络应用:节点,mongodb和套接字如果您在OS X或Linux上,则可以通过在项目文件夹的根部运行以下命令来实现与上面的操作。

<span>{
</span>  <span>"name": "NodeChatroom",
</span>  <span>"version": "0.0.0",
</span>  <span>"description": "NodeChatroom",
</span>  <span>"main": "app.js",
</span>  <span>"author": {
</span>    <span>"name": "Rami Sayar",
</span>    <span>"email": ""
</span>  <span>},
</span>  <span>"dependencies": {
</span>    <span>"express": "3.4.4",
</span>    <span>"jade": "*",
</span>    <span>"socket.io": "^1.0.6",
</span>    <span>"stylus": "*"
</span>  <span>}
</span><span>}</span>
登录后复制
登录后复制
登录后复制
    >将socket.io添加到app.js
  1. 下一步是将socket.io添加到app.js。您可以通过替换以下代码来实现这一目标……
>
<span>npm install --save socket.io</span>
登录后复制
登录后复制
登录后复制

…with:

>这将在称为服务的变量中捕获HTTP服务器,并通过该http服务器,以便socket.io模块可以连接到它。最后一个代码块采用服务变量并执行启动HTTP服务器的侦听功能。>
http<span>.createServer(app).listen(app.get('port'), function(){
</span>  <span>console.log('Express server listening on port ' + app.get('port'));
</span><span>});</span>
登录后复制
登录后复制
登录后复制
记录用户加入并离开

>

>理想情况下,我们想记录加入聊天室的用户。以下代码可以通过挂接回调函数在每个连接事件上通过Websocket到我们的HTTP服务器执行的来实现。在回调函数中,我们调用Console.log记录该用户已连接的。我们可以在致电serve.listen后添加此代码。
<span>var serve = http.createServer(app);
</span><span>var io = require('socket.io')(serve);
</span>
serve<span>.listen(app.get('port'), function() {
</span>    <span>console.log('Express server listening on port ' + app.get('port'));
</span><span>});</span>
登录后复制
登录后复制
>
<span>{
</span>  <span>"name": "NodeChatroom",
</span>  <span>"version": "0.0.0",
</span>  <span>"description": "NodeChatroom",
</span>  <span>"main": "app.js",
</span>  <span>"author": {
</span>    <span>"name": "Rami Sayar",
</span>    <span>"email": ""
</span>  <span>},
</span>  <span>"dependencies": {
</span>    <span>"express": "3.4.4",
</span>    <span>"jade": "*",
</span>    <span>"socket.io": "^1.0.6",
</span>    <span>"stylus": "*"
</span>  <span>}
</span><span>}</span>
登录后复制
登录后复制
登录后复制

要为用户断开连接时做同样的事情,我们必须连接每个插座的断开事件。在上一个代码块的控制台日志之后,在内部添加以下代码。

>
<span>npm install --save socket.io</span>
登录后复制
登录后复制
登录后复制

>最后,代码看起来像这样:

>
http<span>.createServer(app).listen(app.get('port'), function(){
</span>  <span>console.log('Express server listening on port ' + app.get('port'));
</span><span>});</span>
登录后复制
登录后复制
登录后复制

>广播在聊天频道上收到的消息

>

> socket.io为我们提供了一个称为emit的函数以发送事件。>

在聊天频道上收到的任何消息都将通过回调中的广播标志调用EMIT。

>最后,代码看起来像这样:
<span>var serve = http.createServer(app);
</span><span>var io = require('socket.io')(serve);
</span>
serve<span>.listen(app.get('port'), function() {
</span>    <span>console.log('Express server listening on port ' + app.get('port'));
</span><span>});</span>
登录后复制
登录后复制
>

>将消息保存到NOSQL数据库
io<span>.on('connection', function (socket) {
</span>    <span>console.log('a user connected');
</span><span>});</span>
登录后复制

>聊天室应将聊天消息保存到简单的数据存储中。通常,有两种方法可以保存到节点中的数据库。您可以使用特定于数据库的驱动程序,也可以使用ORM。在本教程中,我将向您展示如何将消息保存到MongoDB。当然,您可以使用您喜欢的任何其他数据库,包括postgresql或mysql等SQL数据库。

>您应该确保您有一个可以连接到的mongodb。您可以使用第三方服务来托管MongoDB,例如Mongohq或Mongolab。看看本教程,以查看如何使用Azure中的蒙古插件创建MongoDB。当您到达“创建应用程序”部分时,您可以停止阅读,只需确保在以后可以轻松访问的Mongolab_uri。

>创建了一个mongoDB后,您将拥有数据库的mongolab_uri - 在您已复制到剪贴板的连接信息下,您将需要确保URI可用于应用程序。在源代码管理工具中,将诸如此URI之类的敏感信息(例如此URI)或配置文件中添加到最佳实践。您可以在Azure Web应用程序的“配置”菜单(例如在您使用的教程中)中将值添加到连接字符串列表中,也可以将其添加到应用程序设置列表中(带有uname customConnstr_mongolab_uri)。在本地计算机上,您可以将其添加到环境变量中,名称customconnstr_mongolab_uri和uri的值。

下一步是在我们的项目中增加对MongoDB的支持。您可以通过将以下行添加到package.json中的依赖项对象中来做到这一点。确保将您的更改保存到文件中。

在解决方案资源管理器中,在项目的NPM部分上右键单击右键单击,以显示右键单击上下文菜单。单击内容菜单中的“安装丢失的软件包”以安装MongoDB软件包,以便可以用作模块。

我们希望导入该模块,以便能够在app.js中使用mongoDB client对象。您可以在第一个需要('')函数调用(例如在第11行)之后添加以下代码行。
<span>{
</span>  <span>"name": "NodeChatroom",
</span>  <span>"version": "0.0.0",
</span>  <span>"description": "NodeChatroom",
</span>  <span>"main": "app.js",
</span>  <span>"author": {
</span>    <span>"name": "Rami Sayar",
</span>    <span>"email": ""
</span>  <span>},
</span>  <span>"dependencies": {
</span>    <span>"express": "3.4.4",
</span>    <span>"jade": "*",
</span>    <span>"socket.io": "^1.0.6",
</span>    <span>"stylus": "*"
</span>  <span>}
</span><span>}</span>
登录后复制
登录后复制
登录后复制

我们希望使用我们在customConnstr_mongolab_uri环境变量中使用的URI连接到数据库。连接后,我们想插入插座连接中收到的聊天消息。

>
<span>npm install --save socket.io</span>
登录后复制
登录后复制
登录后复制
如您在上面的代码中所看到的,我们使用process.env对象获取环境变量值。我们进入数据库中的集合,并将其称为插入函数,并使用对象中的内容。

现在,每条消息都将保存到我们的MongoDB数据库中。>

发射最后10条消息

>当然,我们不希望我们的用户在加入聊天室后会感到迷失,因此我们应该确保将接收到的最后10条消息发送到服务器,因此至少我们可以给他们一些上下文。为此,我们需要连接mongodb。在这种情况下,我避免将所有套接字代码与数据库的一个连接包装,以便我仍然可以使服务器运行,即使它丢失了数据库连接。

>我们还需要将我的查询分类并将我的查询限制为最后10条消息,因为它包含时间戳,我们将使用MongoDB生成的_id(尽管在更可扩展的情况下,您将需要在聊天消息中创建一个专用时间戳),我们将限制函数调用以将结果限制在10条消息中。

>

>我们将从MongoDB中流式传输结果,以便我可以在它们到达时尽快将其发射到聊天室中。

上面的代码可以按照上一段中的解释来完成该作业。

>部署到Azure

http<span>.createServer(app).listen(app.get('port'), function(){
</span>  <span>console.log('Express server listening on port ' + app.get('port'));
</span><span>});</span>
登录后复制
登录后复制
登录后复制
>您可以按照过去的教程(例如第2部分)重新部署Azure。

结论

总而言之,我们有一个聊天系统,能够向所有其他连接的客户端广播通过Websocket收到的消息。该系统将消息保存到数据库并检索最后10条消息,以向连接聊天室的每个新用户提供上下文。

敬请期待第4部分!

>

第4部分 - 在这里构建使用Bootstrap的聊天室UI。您可以按照我的Twitter帐户来保持最新和其他文章的最新信息。

在Azure

上进行节点的更多学习

要在节点上进行更多深入学习,我的课程可在Microsoft Virtual Academy上找到。

或类似节点主题上的一些较短的格式视频:>

六部分系列:用node.js

构建应用程序

漫步在节点(coding4fun)

  • 本文是Microsoft的Web Dev技术系列的一部分。我们很高兴与您共享Spartan项目及其新的渲染引擎。在Modern.ie

  • 经常询问有关构建node.js供电的聊天室网络应用程序的问题(常见问题解答)

    >如何确保使用Node.js,MongoDB和Socket.io?

    安全性构建的Chatroom Web应用程序的安全性是任何Web应用程序的重要方面。对于使用node.js,mongodb和socket.io构建的聊天室Web应用程序,您可以实施多种安全措施。首先,使用HTTP而不是HTTP来确保您的服务器和客户端之间的所有通信都已加密。其次,验证所有传入数据以防止SQL注入攻击。第三,使用JWT(JSON Web令牌)进行用户身份验证。最后,定期将您的所有依赖项更新到其最新版本,以避免潜在的安全漏洞。

    我可以将其他数据库与node.js集成在一起的聊天室Web应用程序?高度灵活,可以与各种数据库集成。尽管MongoDB是由于其可伸缩性和灵活性而是一种流行的选择,但您也可以根据您的特定需求使用其他数据库,例如MySQL,PostgreSQL或SQLITE。数据库的选择在很大程度上取决于您应用程序的数据要求和数据库的特定功能。

    >如何缩放我的node.js chatroom Web应用程序来处理更多用户? node.js聊天室网络应用程序,您可以使用负载平衡器在多个服务器上分发传入的流量。您还可以使用node.js中的聚类模块来创建所有共享服务器端口的子进程。此外,请考虑使用MongoDB等NOSQL数据库,该数据库可以轻松地进行水平扩展以处理更多数据。

    >

    我可以将其他实时技术而不是socket.io用于我的Chatroom Web应用程序? >是的,您可以使用其他几种实时技术,而不是socket.io。其中包括Websocket,服务器范围事件(SSE)以及Pusher或Firebase(例如Pusher或Firebase)的第三方服务。这些技术中的每一个都有其自己的优点和劣势,因此选择取决于您的特定需求。

    >

    >我如何测试我的node.js聊天室Web应用程序以确保其正常工作?是开发过程的重要组成部分。对于Node.js聊天室Web应用程序,您可以使用Mocha或Jest等测试框架编写单元测试和集成测试。您还可以使用邮递员或失眠等工具进行API测试。此外,请考虑使用柏树或木偶等端到端测试工具模拟用户交互并确保您的应用程序按预期工作。

    >如何将我的node.js聊天室Web应用程序部署到实时服务器?>有几个平台可让您部署Node.js Chatroom Web应用程序。其中包括Heroku,AWS,Google Cloud和Azure。每个平台都有其自己的部署过程,但是通常,您需要创建一个帐户,设置一个新项目并遵循平台的说明以部署您的应用程序。

    >我可以在我的Node.js Chatroom Web应用程序中添加多媒体支持吗?这可以通过集成Cloudinary或AWS S3(以存储和检索多媒体文件)等第三方服务或AWS S3来完成。您还可以使用socket.io实时发送和接收多媒体数据。

    >如何将用户身份验证添加到我的node.js chatroom web应用程序?

    任何聊天室网络应用程序的功能。对于Node.js应用程序,您可以使用Passport.js,Passport.js是处理用户身份验证的流行中间件。它支持各种身份验证策略,包括本地用户名和密码,Oauth和JWT。

    >我可以将其他前端框架与node.js一起使用我的聊天室Web应用程序?是后端技术,可以与任何前端框架或库一起使用。虽然教程使用普通的HTML和CSS,但您可以使用React,Angular或Vue.js(例如React,Angular或vue.js)来构建更复杂和交互式的用户界面。

    >

    >我如何处理Node.js Chatroom Web中的错误App?

    错误处理是任何Web应用程序的重要组成部分。在Node.js中,您可以使用中间件处理错误。这涉及创建一个有四个参数的特殊功能:错误,请求,响应等。然后,您可以使用此函数记录错误,向客户端发送错误响应,甚至将用户重定向到错误页面。

以上是构建一个node.js供电的聊天室网络应用:节点,mongodb和套接字的详细内容。更多信息请关注PHP中文网其他相关文章!

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

Video Face Swap

Video Face Swap

使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

前端热敏纸小票打印遇到乱码问题怎么办? 前端热敏纸小票打印遇到乱码问题怎么办? Apr 04, 2025 pm 02:42 PM

前端热敏纸小票打印的常见问题与解决方案在前端开发中,小票打印是一个常见的需求。然而,很多开发者在实...

神秘的JavaScript:它的作用以及为什么重要 神秘的JavaScript:它的作用以及为什么重要 Apr 09, 2025 am 12:07 AM

JavaScript是现代Web开发的基石,它的主要功能包括事件驱动编程、动态内容生成和异步编程。1)事件驱动编程允许网页根据用户操作动态变化。2)动态内容生成使得页面内容可以根据条件调整。3)异步编程确保用户界面不被阻塞。JavaScript广泛应用于网页交互、单页面应用和服务器端开发,极大地提升了用户体验和跨平台开发的灵活性。

谁得到更多的Python或JavaScript? 谁得到更多的Python或JavaScript? Apr 04, 2025 am 12:09 AM

Python和JavaScript开发者的薪资没有绝对的高低,具体取决于技能和行业需求。1.Python在数据科学和机器学习领域可能薪资更高。2.JavaScript在前端和全栈开发中需求大,薪资也可观。3.影响因素包括经验、地理位置、公司规模和特定技能。

如何实现视差滚动和元素动画效果,像资生堂官网那样?
或者:
怎样才能像资生堂官网一样,实现页面滚动伴随的动画效果? 如何实现视差滚动和元素动画效果,像资生堂官网那样? 或者: 怎样才能像资生堂官网一样,实现页面滚动伴随的动画效果? Apr 04, 2025 pm 05:36 PM

实现视差滚动和元素动画效果的探讨本文将探讨如何实现类似资生堂官网(https://www.shiseido.co.jp/sb/wonderland/)中�...

JavaScript难以学习吗? JavaScript难以学习吗? Apr 03, 2025 am 12:20 AM

学习JavaScript不难,但有挑战。1)理解基础概念如变量、数据类型、函数等。2)掌握异步编程,通过事件循环实现。3)使用DOM操作和Promise处理异步请求。4)避免常见错误,使用调试技巧。5)优化性能,遵循最佳实践。

JavaScript的演变:当前的趋势和未来前景 JavaScript的演变:当前的趋势和未来前景 Apr 10, 2025 am 09:33 AM

JavaScript的最新趋势包括TypeScript的崛起、现代框架和库的流行以及WebAssembly的应用。未来前景涵盖更强大的类型系统、服务器端JavaScript的发展、人工智能和机器学习的扩展以及物联网和边缘计算的潜力。

如何使用JavaScript将具有相同ID的数组元素合并到一个对象中? 如何使用JavaScript将具有相同ID的数组元素合并到一个对象中? Apr 04, 2025 pm 05:09 PM

如何在JavaScript中将具有相同ID的数组元素合并到一个对象中?在处理数据时,我们常常会遇到需要将具有相同ID�...

Zustand异步操作:如何确保useStore获取的最新状态? Zustand异步操作:如何确保useStore获取的最新状态? Apr 04, 2025 pm 02:09 PM

zustand异步操作中的数据更新问题在使用zustand状态管理库时,经常会遇到异步操作导致数据更新不及时的问题。�...

See all articles