使用 Node.js 创建您自己的 URL 缩短器

使用 Node.js 创建您自己的 URL 缩短器

URL 缩短器是一种有用的工具,可以使长而复杂的 URL 变得更短并且更易于共享。在本教程中,我们将使用 JavaScript 创建一个 URL 缩短器。

为了创建 URL 缩短器,我们将使用 Node.js 和 Express 框架。Node.js是一个服务器端 JavaScript 平台,允许我们在 Web 浏览器之外运行 JavaScript 代码。 Express 是一个快速、简约的 Node.js Web 框架,提供了一组用于构建 Web 应用程序的功能。

第 1 步:设置

在开始之前,我们需要设置我们的项目。为此,请为您的项目创建一个新目录并在终端中运行以下命令:

csharp 复制代码
npm init -y

此命令将初始化一个新的 Node.js 项目并在项目目录中创建一个 package.json 文件。

接下来,我们需要安装所需的依赖项。在终端中运行以下命令:

复制代码
npm install express shortid

此命令将安装expressshortid,这是一个用于生成唯一ID的库。

第2步:创建服务器

在此步骤中,我们将使用 Express 创建服务器。在项目目录中创建一个名为的新文件server.js并添加以下代码:

ini 复制代码
const express = require('express');
const shortId = require('shortid');

const app = express();

app.listen(3000, () => {
  console.log('Server started on port 3000');
});

该代码导入expressshortid,定义app,然后在端口 3000 上启动服务器,将消息记录到控制台以确认服务器已启动。

第 3 步:创建 URL 缩短器

现在我们已经设置了服务器,我们可以创建 URL 缩短器。将以下代码添加到server.js

ini 复制代码
...

const urls = {};

app.get('/shorten', (req, res) => {
  const url = req.query.url;
  const id = shortId.generate();

  urls[id] = url;

  res.send(`http://localhost:3000/${id}`);
});

app.get('/:id', (req, res) => {
  const id = req.params.id;
  const url = urls[id];

  if (url) {
    res.redirect(url);
  } else {
    res.sendStatus(404);
  }
});

...

此代码导入该shortid库并创建一个名为 urls 的空对象来存储原始 URL 及其相应的缩短 URL。

我们定义的第一个路由处理 URL 缩短。

当使用 url 查询参数发出 GET 请求时/shorten,代码会使用shortid库生成唯一 ID,并将原始 URL 存储在 urls 对象中,并以 ID 作为键。然后,它将缩短的 URL 作为响应发送回客户端。

第二条路由处理从缩短的 URL 到原始 URL 的重定向。当向 发出 GET 请求时/:id,代码使用 URL 参数中的 ID 从 urls 对象检索原始 URL。如果原始 URL 存在,代码会将客户端重定向到原始 URL。否则,它会发送 404 状态代码。

第 4 步:测试 URL 缩短器

要测试 URL 缩短程序,请通过在终端中运行以下命令来启动服务器:

vbscript 复制代码
node server.js

打开您的网络浏览器并转至http://localhost:3000/shorten?url=https://blog.javascripttoday.com。这将生成一个缩短的 URL 并将其显示在您的浏览器中。

然后,您可以复制缩短的 URL 并将其粘贴到浏览器中以测试重定向。这应该会将您重定向到原始 URL。

完整实施

ini 复制代码
const express = require('express');
const shortId = require('shortid');

const app = express();

const urls = {};

app.get('/shorten', (req, res) => {
  const url = req.query.url;
  const id = shortId.generate();

  urls[id] = url;

  res.send(`http://localhost:3000/${id}`);
});

app.get('/:id', (req, res) => {
  const id = req.params.id;
  const url = urls[id];

  if (url) {
    res.redirect(url);
  } else {
    res.sendStatus(404);
  }
});


app.listen(3000, () => {
  console.log('Server started on port 3000');
});

结论

在本教程中,我们学习了如何使用 JavaScript 和 Node.js 构建简单的 URL 缩短器。我们已经介绍了路由和生成唯一 ID 的基础知识。

有很多方法可以改进这个 URL 缩短器,我们将在接下来的几篇文章中介绍其中的方法,其中我们将添加错误处理、前端,最后我们将部署应用程序。

相关推荐
神仙别闹9 小时前
基于VUE+Node.JS实现(Web)学生组队网站
前端·vue.js·node.js
BXCQ_xuan11 小时前
基于Node.js的健身会员管理系统的后端开发实践
后端·mysql·node.js
wt_cs11 小时前
身份证实名认证接口数字时代的信任基石-node.js实名认证集成
开发语言·node.js·php
李剑一13 小时前
写一个vitepress新建文章脚本,自动化创建链接,别再手写了!
前端·node.js·vitepress
名字越长技术越强1 天前
Node.js学习
学习·node.js
知识分享小能手1 天前
JavaScript学习教程,从入门到精通,Ajax与Node.js Web服务器开发全面指南(24)
开发语言·前端·javascript·学习·ajax·node.js·html5
dwqqw1 天前
opencv图像库编程
前端·webpack·node.js
layman05281 天前
node.js 实战——(fs模块 知识点学习)
javascript·node.js
本本啊1 天前
node 启动本地应用程序并设置窗口大小和屏幕显示位置
前端·node.js
全栈派森1 天前
Next15 + Prisma + Auth5 实战讲解
react.js·node.js·next.js