」工欲善其事,必先利其器。「—孔子《論語.錄靈公》
首頁 > 程式設計 > 使用 Node.js 和 MongoDB 建立 URL 縮短應用程式

使用 Node.js 和 MongoDB 建立 URL 縮短應用程式

發佈於2024-07-30
瀏覽:631

Building a URL Shortener App with Node.js and MongoDB

建立 URL 縮短服務是深入使用 Node.js 和 MongoDB 進行全端開發的好方法。在本部落格中,我們將逐步介紹建立 URL 縮短器應用程式的過程,該應用程式允許使用者將長 URL 轉換為縮短版本並追蹤其使用情況。

先決條件

要學習本教程,您應該:

  • 已安裝 Node.js
  • JavaScript與Express.js基礎
  • MongoDB 資料庫(您可以使用 MongoDB Atlas 作為雲端解決方案)

項目設定

第 1 步:初始化項目

首先,為您的專案建立新目錄並使用 npm 對其進行初始化:

mkdir url-shortener-app
cd url-shortener-app
npm init -y

步驟2:安裝依賴項

接下來,安裝必要的依賴:

npm install express mongoose cors dotenv
npm install --save-dev nodemon

第三步:專案結構

建立以下資料夾結構:

url-shortener-app/
├── controllers/
│   └── urlController.js
├── models/
│   └── urlModel.js
├── routes/
│   └── urlRoutes.js
├── .env
├── index.js
├── package.json

建構後端

第 4 步:設定 Express 伺服器

在index.js檔案中,設定Express伺服器並連接到MongoDB:

const express = require('express');
const mongoose = require('mongoose');
const urlRoutes = require('./routes/urlRoutes');
const cors = require('cors');

const app = express();
app.use(express.json());

require("dotenv").config();

const dbUser = process.env.MONGODB_USER;
const dbPassword = process.env.MONGODB_PASSWORD;

// Connect to MongoDB
mongoose
    .connect(
        `mongodb srv://${dbUser}:${dbPassword}@cluster0.re3ha3x.mongodb.net/url-shortener-app`,
        { useNewUrlParser: true, useUnifiedTopology: true }
    )
    .then(() => {
        console.log("Connected to MongoDB database!");
    })
    .catch((error) => {
        console.error("Connection failed!", error);
    });

app.use(cors({
    origin: "*",
}));

app.get('/', (req, res) => {
    res.send('Welcome to URL Shortener API');
});

app.use('/api', urlRoutes);

const PORT = process.env.PORT || 5000;
app.listen(PORT, () => {
    console.log(`Server is running on port ${PORT}`);
});

在根目錄下建立.env文件,用於存放環境變數:

MONGODB_USER=yourMongoDBUsername
MONGODB_PASSWORD=yourMongoDBPassword

第 5 步:定義 URL 模型

在 models/urlModel.js 檔案中,定義 URL 的架構:

const mongoose = require('mongoose');

const urlSchema = new mongoose.Schema({
    originalUrl: { type: String, required: true },
    shortUrl: { type: String, required: true, unique: true },
    clicks: { type: Number, default: 0 },
    expirationDate: { type: Date },
    createdAt: { type: Date, default: Date.now },
});

module.exports = mongoose.model('Url', urlSchema);

第 6 步:建立路線

在routes/urlRoutes.js檔案中,定義API的路由:

const express = require('express');
const { createShortUrl, redirectUrl, getUrls, getDetails, deleteUrl } = require('../controllers/urlController');
const router = express.Router();

router.post('/shorten', createShortUrl);
router.get('/urls', getUrls);
router.get('/:shortUrl', redirectUrl);
router.get('/details/:shortUrl', getDetails);
router.delete('/delete/:shortUrl', deleteUrl);

module.exports = router;

第 7 步:實作控制器

在controllers/urlController.js檔案中,實作控制器功能:

const Url = require('../models/urlModel');

function generateUniqueId(length) {
    const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
    let result = '';
    for (let i = 0; i  {
    const { originalUrl } = req.body;
    const shortUrl = generateUniqueId(5);
    const urlRegex = new RegExp(/^(http|https):\/\/[^ "] $/);
    if (!urlRegex.test(originalUrl))
        return res.status(400).json('Invalid URL');
    const url = await Url.findOne({ originalUrl });
    if (url) {
        res.json(url);
        return;
    }
    const expirationDate = new Date();
    expirationDate.setDate(expirationDate.getDate()   7);
    const newUrl = new Url({ originalUrl, shortUrl, expirationDate });
    await newUrl.save();
    res.json(newUrl);
};

const redirectUrl = async (req, res) => {
    const { shortUrl } = req.params;
    const url = await Url.findOne({ shortUrl });
    if (!url || (url.expirationDate && url.expirationDate  {
    try {
        const urls = await Url.find({}).sort({ _id: -1 });
        res.json(urls);
    } catch (error) {
        res.status(500).json({ message: 'Server Error' });
    }
};

const getDetails = async (req, res) => {
    try {
        const { shortUrl } = req.params;
        const url = await Url.findOne({ shortUrl });
        if (url) {
            res.json(url);
        } else {
            res.status(404).json('URL not found');
        }
    } catch (error) {
        res.status(500).json({ message: 'Server Error' });
    }
};

const deleteUrl = async (req, res) => {
    try {
        const { shortUrl } = req.params;
        await Url.findOneAndDelete({ shortUrl });
        res.json('URL deleted');
    } catch (error) {
        res.status(500).json({ message: 'Server Error' });
    }
};

module.exports = { createShortUrl, redirectUrl, getDetails, getUrls, deleteUrl };

運行應用程式

使用下列指令啟動伺服器:

npm run dev

此指令將使用 Nodemon 啟動您的伺服器,當您變更程式碼時,Nodemon 會自動重新啟動伺服器。

結論

在本部落格中,我們使用 Node.js 和 MongoDB 建立了一個簡單的 URL 縮短器應用程式。該應用程式允許用戶縮短 URL、追蹤其使用情況並透過到期日期進行管理。該專案是學習全端開發的一個很好的起點,並且可以透過使用者身份驗證、自訂 URL 別名等其他功能進行擴充。

探索程式碼

存取 GitHub 儲存庫以詳細探索程式碼。


您可以根據您的喜好隨意定制博客,並在需要時提供更多詳細信息或解釋。

版本聲明 本文轉載於:https://dev.to/manthanank/building-a-url-shortener-app-with-nodejs-and-mongodb-bhh?1如有侵犯,請聯絡[email protected]刪除
最新教學 更多>
  • 如何使用 Git LFS 將大檔案推送到 git 儲存庫
    如何使用 Git LFS 將大檔案推送到 git 儲存庫
    所以我最近正在做一個項目,我必須使用高解析度資產,因此它們的尺寸很大。我無法將文件推送到我的存儲庫。每當我嘗試時,我都會收到以下錯誤: 遠端:錯誤:檔案 file.csv 為 182.47 MB​​;這超出了 GitHub 的檔案大小限制 100.00 MB 遠端:錯誤:GH001:偵測到大檔案。您...
    程式設計 發佈於2024-11-02
  • Return 語句的放置如何影響 For 迴圈功能?
    Return 語句的放置如何影響 For 迴圈功能?
    For 循環中的Return 語句放置在這個特定情況下,在make_list 函數中放置return 語句會妨礙程式的預期功能。 return 語句應位於函數末尾,而不是在 for 迴圈內。 for 循環迭代 3 次,對應 3 個 pet 條目。然而,過早放置的 return 語句會過早終止函數,只...
    程式設計 發佈於2024-11-02
  • 現在已經九月了嗎?
    現在已經九月了嗎?
    大家早安,MonDEV快樂☕ 我們已經全面回歸,而九月重返 PC 的原因之一就是 Preptember! 那些從早期就開始關注時事通訊的人以及那些關注開源世界的人已經知道了,但在10 月份有一個持續一個月的活動,即Hacktoberfest;如果我們願意的話,我們可以將其定義為開源節,邀請我們所有...
    程式設計 發佈於2024-11-02
  • 為什麼錯誤的 return 語句會導致 for 迴圈中程式過早終止?
    為什麼錯誤的 return 語句會導致 for 迴圈中程式過早終止?
    for 循環中錯誤的返回語句在此編程問題中,用戶在創建允許用戶輸入三種動物的程序時遇到困難。該程式旨在用包含名稱、動物類型和年齡的 Pet 物件填入清單。然而,在輸入第一個動物後,程式突然結束。 經過分析,問題很明顯出在 make_list 函式中 return 語句的位置。 for 迴圈重複實作程...
    程式設計 發佈於2024-11-02
  • Item 避免使用其他類型更合適的字串
    Item 避免使用其他類型更合適的字串
    1。避免使用字串替代其他資料類型: 字串旨在表示文本,但經常被誤用來表示數字、枚舉或聚合結構。 如果資料本質上是數字,請使用 int、float 或 BigInteger 等類型,而不是 String。 String age = "30"; // incorreto int age = 30;...
    程式設計 發佈於2024-11-02
  • 如何使用sync.WaitGroup防止Go並發死鎖?
    如何使用sync.WaitGroup防止Go並發死鎖?
    解決 Goroutines 死鎖在這種情況下,您在 Go 並發代碼中遇到了死鎖錯誤。讓我們深入研究這個問題並提供一個有效的解決方案。 該錯誤是由於生產者和消費者的行為不匹配而發生的。在生產者函數中實現的生產者在有限的時間內在通道 ch 上發送值。然而,存在於主函數中的消費者無限期地運行,無休止地嘗試...
    程式設計 發佈於2024-11-02
  • 如何處理文字檔案中的 Unicode 文字:無錯誤編寫的完整指南
    如何處理文字檔案中的 Unicode 文字:無錯誤編寫的完整指南
    文本文件中的Unicode 文本:無錯誤寫作綜合指南從Google 文件中提取的編碼資料可能具有挑戰性,尤其是當遇到需要轉換為HTML 使用的非ASCII 符號時。本指南提供了處理 Unicode 文字並防止編碼錯誤的解決方案。 最初,在資料檢索期間將所有內容轉換為 Unicode 並將其寫入檔案似...
    程式設計 發佈於2024-11-02
  • EchoAPI 與 Insomnia:結合實例進行綜合比較
    EchoAPI 與 Insomnia:結合實例進行綜合比較
    作为一名全栈开发人员,我知道拥有一流的工具来调试、测试和记录 API 是多么重要。 EchoAPI 和 Insomnia 是两个出色的选项,每个选项都有自己独特的特性和功能。让我带您了解这些工具,比较它们的功能和优点,给您一些实际示例,并帮助您决定何时使用 EchoAPI 或 Insomnia。 ...
    程式設計 發佈於2024-11-02
  • 出發時間和持續時間|程式設計教學
    出發時間和持續時間|程式設計教學
    介紹 本實驗旨在測試您對 Go 的時間和持續時間支援的理解。 時間 下面的程式碼包含如何在 Go 中使用時間和持續時間的範例。但是,程式碼的某些部分遺失了。您的任務是完成程式碼,使其按預期工作。 Go程式語言基礎知識。 熟悉 Go 的時間和持續時間支援。 $ ...
    程式設計 發佈於2024-11-02
  • 起重面試問答
    起重面試問答
    1. JavaScript 中什么是提升? 答案: 提升是执行上下文创建阶段为变量和函数分配内存的过程。在此过程中,为变量分配了内存,并为变量分配了值 undefined。对于函数,整个函数定义存储在内存中的特定地址,并且对其的引用放置在该特定执行上下文中的堆栈上。 ...
    程式設計 發佈於2024-11-02
  • 了解 JavaScript 中的文件物件模型 (DOM)
    了解 JavaScript 中的文件物件模型 (DOM)
    你好,神奇的 JavaScript 開發者? 瀏覽器提供了一個稱為文檔物件模型 (DOM) 的程式設計接口,它允許腳本(特別是 JavaScript)與網頁佈局進行互動。網頁的文檔物件模型 (DOM) 是一種分層樹狀結構,它將頁面的元件排列成對象,由瀏覽器在載入時建立。借助此範例,...
    程式設計 發佈於2024-11-02
  • 開始使用 SPRING BATCH 進行編程
    開始使用 SPRING BATCH 進行編程
    Introduction Dans vos projets personnels ou professionnels, Il vous arrive de faire des traitements sur de gros volumes de données. Le traite...
    程式設計 發佈於2024-11-02
  • 使用 CSS 讓您的 Github 個人資料脫穎而出
    使用 CSS 讓您的 Github 個人資料脫穎而出
    以前,自訂 Github 個人資料的唯一方法是更新圖片或更改名稱。這意味著每個 Github 設定檔看起來都一樣,自訂它或脫穎而出的選項很少。 從那時起,您可以選擇使用 Markdown 建立自訂部分。您可以包括您的履歷、您的興趣和嗜好,讓您的個人資料反映您的身分。這是任何人在訪問您的個人資料時看...
    程式設計 發佈於2024-11-02
  • TypeScript 實用程式類型:增強程式碼可重複使用性
    TypeScript 實用程式類型:增強程式碼可重複使用性
    TypeScript 提供內建實用程式類型,讓開發人員有效地轉換和重複使用類型,讓您的程式碼更加靈活和 DRY。在本文中,我們將探討關鍵實用程式類型,例如 Partial、Pick、Omit 和 Record,以協助您將 TypeScript 技能提升到新的水平。 Partial:使所有屬性可選 ...
    程式設計 發佈於2024-11-02
  • 電報 window.open(url, &#_blank&#);在ios上工作很奇怪
    電報 window.open(url, &#_blank&#);在ios上工作很奇怪
    我正在製作一個電報機器人,我想添加將一些資訊從小型應用程式轉發到聊天的選項。我決定使用 window.open(url, '_blank');在我在 iPhone 上嘗試之前它一直運作良好。我沒有轉發,而是分享(這是一件大事,我正好需要轉發一條訊息)。我有一些如何處理它的想法,但它們...
    程式設計 發佈於2024-11-02

免責聲明: 提供的所有資源部分來自互聯網,如果有侵犯您的版權或其他權益,請說明詳細緣由並提供版權或權益證明然後發到郵箱:[email protected] 我們會在第一時間內為您處理。

Copyright© 2022 湘ICP备2022001581号-3