首页 > web前端 > js教程 > Express.js 基础知识:初学者指南 - Node.js 教程系列 - 第 10 部分

Express.js 基础知识:初学者指南 - Node.js 教程系列 - 第 10 部分

Barbara Streisand
发布: 2024-09-27 06:33:02
原创
673 人浏览过

Express.js Basics: A Beginner

简介:

嘿那里!如果您是 Node.js 新手,您可能听说过 Express.js——一个用于构建 Web 服务器和 API 的轻量级、快速且灵活的框架。在本指南中,我将引导您了解 Express 的基础知识,向您展示入门是多么容易。

准备好了吗?让我们潜入吧!


1.安装 Express

首先,让我们安装 Express。确保您的计算机上设置了 Node.js 和 npm(Node 的包管理器)。准备好后,打开终端并运行以下命令:

npm install express
登录后复制

繁荣!您刚刚在项目中安装了 Express。就这么简单。


2.创建您的第一个 Express 服务器

现在,让我们构建一些东西!以下是您如何创建一个超级简单的 Express 服务器,该服务器侦听请求并在有人访问您的网站时以“Hello World”进行响应。

const express = require('express');  // Import Express
const app = express();  // Initialize your Express app

app.get('/', (req, res) => {  // Set up a route for GET requests to the root URL
  res.send('Hello World');  // Send a response
});

app.listen(3000, () => {  // Tell the app to listen on port 3000
  console.log('Server is running on port 3000');
});
登录后复制

如果您使用 Node app.js 运行此程序并在浏览器中打开 http://localhost:3000,您将看到“Hello World”。启动并运行服务器就是这么简单!


3.什么是中间件?

您可能经常听说过“中间件”这个术语。简而言之,中间件只是一个在接收请求和发送响应之间执行的函数。

让我们看一个简单的例子:

app.use((req, res, next) => {
  console.log('Request received');
  next();  // Moves to the next middleware or route
});
登录后复制

在这种情况下,每次发出请求时,都会将“请求已收到”记录到控制台。 next() 函数在这里至关重要,因为它允许请求继续到下一个中​​间件函数或路由处理程序。如果没有它,请求将停止,并且不会发送任何响应。

如果您有兴趣详细了解中间件的工作原理,请查看了解 Express.js 和 Node.js 中的中间件。它涵盖了不同类型的中间件,例如路由器级中间件和错误处理中间件。


4.路由:应用程序的主干

路由是您在应用程序中设置不同 URL 的方式。您已经看到了根 (/) 路径的基本路由,但您还可以处理其他 HTTP 方法,例如 POST,以处理表单提交或数据更新。

app.post('/submit', (req, res) => {
  res.send('Form submitted!');
});
登录后复制

现在,当用户向 /submit 提交表单时,此路由将处理它。您可以根据需要创建任意数量的路线 - Express 让一切变得简单!


5.提供静态文件

如果您想提供图像、CSS 文件或其他静态资源怎么办?快递已满足您!只需将这些文件放入一个文件夹(例如 public)中,然后告诉 Express 在哪里可以找到它们:

app.use(express.static('public'));
登录后复制

现在,公共文件夹中的任何文件(例如 style.css 或图像)都可以通过浏览器直接访问。


6.处理 JSON 数据

在现代应用程序中,您经常需要处理 JSON 数据——可能来自表单或 API 请求。 Express 让这变得超级简单:

app.use(express.json());  // Add this middleware to parse JSON

app.post('/data', (req, res) => {
  console.log(req.body);  // Access the parsed JSON data
  res.send('Data received!');
});
登录后复制

现在,当带有 JSON 数据的 POST 请求发送到 /data 时,Express 会自动解析 JSON,您可以在 req.body 中访问它。很简单吧?


把一切都包起来

这就是 Express.js 的快速简单介绍!只需几行代码,您就学会了如何:

  • 安装 Express,
  • 设置基本服务器,
  • 使用中间件,
  • 处理不同的路线,
  • 提供静态文件,
  • 并使用 JSON 数据。

Express 是一个功能强大的框架,使构建 Web 服务器和 API 变得有趣而简单。当您变得更加熟悉时,您可以开始探索更高级的功能,例如路由器、错误处理,甚至与数据库集成。


快速旅程的专业提示

  • 使用nodemon:当您进行更改时,它会自动重新启动您的服务器。只需运行 npm install -g nodemon 并使用nodemon app.js 而不是node app.js。
  • 构建您的应用程序:随着项目的发展,您将希望将路线和控制器组织到单独的文件中。这可以使您的代码保持干净且易于管理。

我希望本指南能帮助您开始使用 Express!不断尝试,不知不觉中,您就会像专业人士一样构建出色的网络应用程序。

编码愉快!

以上是Express.js 基础知识:初学者指南 - Node.js 教程系列 - 第 10 部分的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:dev.to
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板