如何在 VPS 上安装 Express(Node.js 框架)并设置 Socket.io

简介: 如何在 VPS 上安装 Express(Node.js 框架)并设置 Socket.io

本文将学到什么


  • 如何使用 Node Version Manager(NVM)安装 NodeJS 0.10.16
  • 如何安装 NodeJS 的 Express web 应用程序框架
  • 如何设置一个简单的 Express 项目
  • 如何在 Express 中设置 socket.io
  • 实时向客户端发送简单消息
  • 如何使用客户端 JavaScript 监听消息

步骤 1:设置 NodeJS


注意:如果您已经知道已安装了 NodeJS v0.10.16,则可以跳过此步骤

Node Version Manager(NVM)是一个帮助在 Linux 机器上安装各种 NodeJS 版本的工具。为了使用 NVM,请确保已安装 gitcurl

使用 SSH 连接到您的 VPS(droplet)。

如果您尚未安装这些软件,请使用系统的软件包管理器进行安装。例如,在 Ubuntu 或 Debian 上,您可以运行:

```
sudo apt-get install curl git
```

现在,您需要运行 NVM 安装脚本:

curl https://raw.github.com/creationix/nvm/master/install.sh | sh

重要:您现在必须注销并使用 SSH 重新连接到您的服务器。

通过在终端中输入 nvm 来测试 nvm 命令是否有效。如果没有收到 command not found 错误,则已正确设置了 NVM。

要安装最新版本的 Node(本文撰写时为 0.10.16),只需输入:

nvm install 0.10.16

然后等待安装完成。如果安装成功,您应该会看到输出:Now using node v0.10.16

在终端中输入 node -v 来确保您正在使用指定的版本。您应该会得到输出:v0.10.16

步骤 2:设置 Express


Express 是 Node 的 Web 应用程序框架。它简洁灵活。要开始使用 Express,您需要使用 NPM 安装该模块。只需简单地输入:

npm install -g express

这将安装 Express 命令行工具,该工具将帮助创建一个基本的 Web 应用程序。安装 Express 后,请按照以下步骤创建一个空的 Express 项目:

mkdir socketio-test
cd socketio-test
express
npm install

这些命令将在我们刚创建的目录中创建一个空的 Express 项目 socketio-test。然后运行 npm install 来获取运行应用程序所需的所有依赖项。要测试空应用程序,请运行 node app,然后在浏览器中导航至 http://yourDropletIp-or-domainName:3000。您应该会收到一个简单的欢迎消息,内容为:“Welcome to Express”。

如果您看到欢迎消息,则表示您已经准备好并运行了一个基本的 Express 应用程序!

在继续之前,请确保使用 Ctrl+C 键盘命令关闭您的 VPS。

步骤 3:将 Socket.io 安装到您的 Express 应用程序中


首先,简要介绍一下 Socket.io 是什么。Socket.io 是一个实时的 JavaScript 库。简而言之,它是一个 WebSocket API,根据浏览器的能力确定要建立的正确连接类型,无论是 AJAX 长轮询、Flash,甚至只是普通的 WebSocket。

那么,如何开始使用它呢?首先,您需要一个 Socket.io 服务器。我们已经准备好并等待的 Express 服务器,我们只需要添加上 socket 库。为此,我们需要将其添加到 package.json 文件中。

您的初始文件可能看起来像这样:

{
  "name": "application-name",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node app.js"
  },
  "dependencies": {
    "express": "3.3.5",
    "jade": "*"
  }
}

现在在 “dependencies” 区域添加一个新字段:

"socket.io": "latest",

您的最终文件应该看起来像这样:

{
  "name": "application-name",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node app.js"
  },
  "dependencies": {
    "socket.io": "latest",
    "express": "3.3.5",
    "jade": "*"
  }
}

现在再次运行 npm install 来安装 socket 库。

第 4 部分:服务器代码


现在我们已经设置好所有的依赖项,可以开始编写代码了!打开 Express 应用程序文件夹中的 app.js 文件。在其中,您会看到一堆自动生成的代码,删除所有这些代码,然后使用以下示例代码:

/**
 * Module dependencies.
 */
 
var express = require('express')
  , routes = require('./routes')
  , http = require('http');
 
var app = express();
var server = app.listen(3000);
var io = require('socket.io').listen(server); // this tells socket.io to use our express server
 
app.configure(function(){
  app.set('views', __dirname + '/views');
  app.set('view engine', 'jade');
  app.use(express.favicon());
  app.use(express.logger('dev'));
  app.use(express.static(__dirname + '/public'));
  app.use(express.bodyParser());
  app.use(express.methodOverride());
  app.use(app.router);
});
 
app.configure('development', function(){
  app.use(express.errorHandler());
});
 
app.get('/', routes.index);
 
 
console.log("Express server listening on port 3000");

这个示例文件只是重新组织了自动生成的代码,并添加了 var io = require('socket.io').listen(server); 这一行,告诉 socket.io 监听并使用我们的 Express 服务器。如果运行您的 node 应用程序,您应该会看到输出:info - socket.io started

现在我们如何将消息传输给用户呢?

在您的 app.js 文件中,在最后一行下面添加以下行:

io.sockets.on('connection', function (socket) {
    console.log('A new user connected!');
    socket.emit('info', { msg: 'The world is round, there is no up or down.' });
});

这将在新用户连接到服务器时发送一个新的 socket 消息。现在我们只需要一种方法来在客户端与 VPS 进行交互。

第五部分:客户端代码


进入 Express 应用程序中的 public/javascripts 文件夹,添加一个名为 client.js 的新文件,并将以下代码放入其中:

// 连接到 socket 服务器
var socket = io.connect(); 
// 如果从 socket 服务器接收到 "info" 事件,则在控制台打印接收到的数据
socket.on('info', function (data) {
    console.log(data);
});

这段代码很简单,但它演示了使用 Socket.io 可以做什么。现在我们只需要将脚本包含到我们的主页面中。

进入 Express 应用程序中的 views 文件夹,打开 layout.jade 文件。Express 不使用普通的 HTML 来渲染页面,它使用一个名为 Jade 的模板引擎。(有关 Jade 的更多信息可以在这里找到)Jade 相对于普通的 HTML 更简单、更清晰。要添加我们的客户端脚本并添加 Socket.io 客户端库,我们只需要在 link(rel='stylesheet', href='/stylesheets/style.css') 下方添加以下两行代码:

script(type='text/javascript', src="/socket.io/socket.io.js")
script(type='text/javascript', src='javascripts/client.js')

确保它们在相同的缩进级别上,并且不要混合使用制表符和空格。这将导致 Jade 抛出错误。

切换回到 socketio-test 目录:

cd socketio-test

保存布局文件,并再次使用 node app 启动 Express 应用程序。

第六部分:测试


现在再次在浏览器中导航到 http://yourDropletIp-or-domainName:3000,并打开开发者工具控制台。您应该在日志中看到类似以下内容:

Object {msg: "The world is round, there is no up or down."}

这是一条实时从 VPS 直接发送到客户端的消息。


目录
相关文章
|
13天前
|
Web App开发 JavaScript 前端开发
构建高效后端服务:Node.js与Express框架的实战指南
【9月更文挑战第6天】在数字化时代的潮流中,后端开发作为支撑现代Web和移动应用的核心,其重要性不言而喻。本文将深入浅出地介绍如何使用Node.js及其流行的框架Express来搭建一个高效、可扩展的后端服务。通过具体的代码示例和实践技巧,我们将探索如何利用这两个强大的工具提升开发效率和应用性能。无论你是后端开发的新手还是希望提高现有项目质量的老手,这篇文章都将为你提供有价值的见解和指导。
|
21天前
|
存储 JavaScript NoSQL
构建高效Web应用:使用Node.js和Express框架
【8月更文挑战第30天】本文将引导你了解如何使用Node.js和Express框架快速搭建一个高效的Web应用。通过实际的代码示例,我们将展示如何创建一个简单的API服务,并讨论如何利用中间件来增强应用功能。无论你是新手还是有经验的开发者,这篇文章都将为你提供有价值的见解。
|
8天前
|
SQL JavaScript 数据库
sqlite在Windows环境下安装、使用、node.js连接
sqlite在Windows环境下安装、使用、node.js连接
|
1天前
|
缓存 监控 JavaScript
构建高效后端服务:Node.js与Express框架的完美结合
【9月更文挑战第18天】在数字化时代的浪潮中,后端服务的效率和稳定性成为了企业竞争力的关键。本文将深入探讨如何使用Node.js和Express框架来构建一个既高效又稳定的后端服务,同时通过实际代码示例,展示如何优化性能并确保服务的高可用性。
|
4天前
|
JavaScript Linux 开发者
一个用于管理多个 Node.js 版本的安装和切换开源工具
【9月更文挑战第14天】nvm(Node Version Manager)是一个开源工具,用于便捷地管理多个 Node.js 版本。其特点包括:版本安装便捷,支持 LTS 和最新版本;版本切换简单,不影响开发流程;多平台支持,包括 Windows、macOS 和 Linux;社区活跃,持续更新。通过 nvm,开发者可以轻松安装、切换和管理不同项目的 Node.js 版本,提高开发效率。
|
8天前
|
Web App开发 缓存 JavaScript
构建高效后端服务:Node.js与Express框架的完美结合
【9月更文挑战第11天】本文将引导开发者探索如何利用Node.js和Express框架搭建一个高效的后端服务。文章不仅深入讲解了这两个工具的核心概念,还通过实际示例展示了它们的强大功能和易用性。读者将学会如何处理HTTP请求、设计RESTful API以及优化应用性能。无论你是初学者还是有经验的开发者,这篇文章都将为你提供宝贵的知识,帮助你在后端开发领域更进一步。
|
19天前
|
大数据 数据处理 分布式计算
JSF 逆袭大数据江湖!看前端框架如何挑战数据处理极限?揭秘这场技术与勇气的较量!
【8月更文挑战第31天】在信息爆炸时代,大数据已成为企业和政府决策的关键。JavaServer Faces(JSF)作为标准的 Java Web 框架,如何与大数据技术结合,高效处理大规模数据集?本文探讨大数据的挑战与机遇,介绍 JSF 与 Hadoop、Apache Spark 等技术的融合,展示其实现高效数据存储和处理的潜力,并提供示例代码,助您构建强大的大数据系统。
25 0
|
19天前
|
JavaScript 安全 数据安全/隐私保护
深入Node.js与Express:从表单接收到数据验证的完整指南——实战技巧揭秘后端开发中的表单处理流程
【8月更文挑战第31天】在Web开发中,处理表单数据至关重要。本文通过实例详细讲解了如何利用Node.js与Express框架接收和验证表单数据。首先,搭建环境并初始化一个简单的Express应用;接着,演示如何接收用户注册表单中的`username`和`email`字段;最后,引入`joi`模块进行数据验证,确保数据安全准确。掌握这些技能有助于开发者构建更安全、友好的Web应用。随着Node.js和Express的不断进步,未来将有更多高级功能值得期待。
26 0
|
23天前
|
JavaScript 前端开发 中间件
构建高效后端服务:Node.js与Express框架的完美搭档
【8月更文挑战第28天】在追求高性能、可扩展和易维护的后端开发领域,Node.js和Express框架的组合提供了一种轻量级且灵活的解决方案。本文将深入探讨如何利用这一组合打造高效的后端服务,并通过实际代码示例展示其实现过程。
|
24天前
|
JavaScript 中间件 API
深入浅出Node.js后端框架——Express
【8月更文挑战第27天】在这篇文章中,我们将一起探索Node.js的热门框架Express。Express以其简洁、高效的特点,成为了许多Node.js开发者的首选框架。本文将通过实例引导你了解Express的核心概念和使用方法,让你快速上手构建自己的Web应用。