当前位置：首页 > news >正文

【4/20】Node.js 入门：设置后端服务器，实现一个简单 API 端点

news 2025/9/20 5:33:51

标签：Node.js、后端开发、服务器设置、API 端点、HTTP 服务器、入门教程、项目实践

前言

欢迎来到“前后端与数据库交互详解”系列的第4篇文章！在前三篇文章中，我们专注于前端：学习了 Vue.js 基础、动态 UI 和 HTTP 请求（如天气查询应用）。现在，前端需要后端支持——比如提供数据或处理提交。

本篇文章的焦点是 Node.js 入门，特别是设置后端服务器。我们将解释 Node.js 是什么、为什么用它构建服务器，并在结尾实现一个完整的“简单 API 端点”应用：一个返回问候消息的服务器端点，前端可以调用它（用第三篇的 HTTP 知识）。这将帮助您理解后端的基础：如何响应前端请求，最终连接数据库。

前提：您已安装 Node.js（从第一篇学过，如果没有，下载自 https://nodejs.org/）。我们用纯 Node.js 内置模块（http）构建，作为入门；未来引入框架如 Express。

一、Node.js 是什么？

Node.js 是一个开源的 JavaScript 运行环境，让 JS 运行在服务器端（而非浏览器）。它基于 Chrome 的 V8 引擎，高效处理 I/O 操作。

为什么用 Node.js？
- 全栈 JS：前后端都用 JS，学习曲线低（您已知 Vue 中的 JS）。
- 非阻塞 I/O：适合高并发，如实时应用（聊天室、API）。
- 生态丰富：NPM（Node Package Manager）有海量模块，如数据库连接。
- 对比其他：不像 PHP 或 Python 需要额外服务器（如 Apache），Node.js 内置服务器。
核心概念：
- 模块：Node.js 用 require 导入（如 const http = require('http');）。
- 事件驱动：用回调处理请求。
- 服务器：Node.js 可以创建 HTTP 服务器，监听端口（如 3000），响应 GET/POST。

在我们的系列中，Node.js 是后端基础：它处理前端的 HTTP 请求（如第三篇的 GET），未来存储数据到数据库。没有后端，前端只能用外部 API；用 Node.js，您能构建自定义服务。

二、设置后端服务器

设置服务器很简单：用 http 模块创建一个监听请求的实例。

基本步骤：
1. 创建文件（如 server.js）。
2. 导入 http。
3. 创建服务器：定义请求处理函数。
4. 监听端口：如 server.listen(3000)。
处理请求：
- 检查 req.method（GET/POST）和 req.url。
- 发送响应：用 res.end() 返回数据（JSON 或文本）。

例如，一个简单服务器：

const http = require('http');const server = http.createServer((req, res) => {res.end('Hello from Node.js!');
});server.listen(3000, () => {console.log('Server running on port 3000');
});

运行 node server.js，浏览器访问 http://localhost:3000，看到 “Hello from Node.js!”。

这展示了 Node.js 如何快速设置服务器。接下来，通过项目实践。

三、实现完整项目：简单 API 端点应用

项目目标：创建一个后端服务器，提供一个简单 API 端点（GET /api/greeting），返回 JSON 数据（如 {“message”: “Hello, World!”}）。这是一个独立的完整应用，可以运行，并用浏览器或前端（第三篇的 Axios）调用它。未来扩展为真实 API。

步骤 1: 创建项目文件夹

新建文件夹：mkdir simple-api-server。
进入：cd simple-api-server。
初始化 NPM（可选，但推荐）：npm init -y（创建 package.json）。

步骤 2: 编写服务器代码

新建 server.js 文件，输入以下代码：

const http = require('http');const server = http.createServer((req, res) => {// 设置响应头：允许跨域（CORS），返回 JSONres.setHeader('Content-Type', 'application/json');res.setHeader('Access-Control-Allow-Origin', '*');  // 允许所有来源访问（开发用）if (req.method === 'GET' && req.url === '/api/greeting') {// 处理 GET 请求，返回 JSONconst responseData = { message: 'Hello from Node.js API!', timestamp: new Date().toISOString() };res.statusCode = 200;res.end(JSON.stringify(responseData));} else if (req.method === 'POST' && req.url === '/api/echo') {// 处理 POST 请求，回显数据（示例）let body = '';req.on('data', chunk => { body += chunk; });req.on('end', () => {try {const parsedBody = JSON.parse(body);res.statusCode = 200;res.end(JSON.stringify({ received: parsedBody }));} catch (err) {res.statusCode = 400;res.end(JSON.stringify({ error: 'Invalid JSON' }));}});} else {// 其他路径：404res.statusCode = 404;res.end(JSON.stringify({ error: 'Not Found' }));}
});const PORT = 3000;
server.listen(PORT, () => {console.log(`Server running on http://localhost:${PORT}`);
});

解释：
- createServer：处理所有请求。
- GET /api/greeting：返回 JSON 对象（消息 + 时间戳）。
- POST /api/echo：接收 JSON body，回显它（演示 POST 处理）。
- CORS：允许前端调用（否则浏览器阻挡）。
- 错误处理：404 或无效 JSON。

步骤 3: 运行和测试

运行：node server.js（终端显示 “Server running”）。
测试 GET：
- 浏览器访问 http://localhost:3000/api/greeting，看到 JSON：{“message”:“Hello from Node.js API!”,“timestamp”:“…”}。
测试 POST（用工具如 Postman 或 curl）：
- 发送 POST 到 http://localhost:3000/api/echo，body: {“name”: “Test”}，响应：{“received”:{“name”:“Test”}}。
从前端调用：用第三篇的 Vue 项目，添加 Axios GET 到这个端点，显示消息。
这是一个完整的 API 应用！它展示了 Node.js 设置服务器并实现端点的作用。