Как сделать сокращатель URL-адресов.

В этом проекте вы узнаете, как построить API с помощью express.js, как подключить его к бэкенду и как обрабатывать http-запросы.

форк или клонирование этого репозитория для ознакомления
 

Используемые пакеты NPM

• зависимости

cors
crc
express
mongodb
url

• dev зависимости ( npm i ${имя_пакета}—save-dev )

dotenv
nodemon

Инициализация проекта

Инициализируйте проект npm npm init -y и создайте файл api.js
 

Сборка сервера

  
Установите и импортируйте зависимости

1. Установите все зависимости, указанные выше. dev depedencies является необязательным.

      — nodemon используется для автоматического обновления файла сервера aka api.js
      - dotenv используется для загрузки переменных окружения в файл.
  
2. Импортируйте зависимости в api.js

const express = require("express");
const cors = require("cors");
const { crc32 } = require("crc");
const { MongoClient } = require("mongodb");
const { URL } = require("url");

 
** Запуск сервера

1. Создайте экземпляр экспресс-приложения, используя эту строку кода

const app = express();

 
2. Сделайте так, чтобы сервер мог получать json-файлы при POST-запросах

app.use(express.json());
app.use(express.urlencoded({ extended: true }));
app.use(cors());

 
3. Включите CORS на сервере. Это поможет вам контролировать доступ к серверу с разных адресов подробнее об этом здесь

app.use(cors());

 
4. Заставить сервер прослушивать порт

app.listen(process.env.PORT || 3030); 

process.env.PORT помогает в развертывании

Теперь у вас есть работающий сервер 🎉🎉🎉. Но сейчас он ничего не делает. Так что давайте это исправим…
 

Подключите ваш сервер к mongoDB

Если вы не знаете, как запустить mongodb локально. Вот ссылка, которая поможет вам начать

• Мы используем пакет npm monodb для подключения к базе данных

const dbName = "dbName";

let collection = null // Global Variable

let main = async () => {
  let url = "mongodb://localhost:27017";
  const client = new MongoClient(url);
  await client.connect();
  const db = client.db(dbName);
  collection = db.collection("urls");
  const deleteResult = await collection.deleteMany({});
  // deletes all entry after each restart
};

И вызываем функцию main().

Теперь ваш сервер подключен к вашей базе данных.
 

Функция сократителя ссылок

Мы будем использовать хэш-алгоритм CRC32 для сокращения URLS. Именно здесь в игру вступает пакет crc.

let createUrl = (url) => {
  let shortenedUrl = crc32(url).toString(16);
  return shortenedUrl;
};

Эта функция сокращает ваш URL до 8-символьной строки.
 

Создание и чтение из базы данных

Мы собираемся создать коллекцию с парой типа

{
  url:'original URL,
  shortenedUrl:'shrinked URL of the absolute URL
}
 

• Добавить URL в базу данных

let addUrl = async (url, shortenedUrl) => {
  const insertResult = await collection.insertOne({ shortenedUrl, url });
  return insertResult;
};

• Найти пару из базы данных

let findUrl = async (shortenedUrl) => {
  const findResult = await collection.find({ shortenedUrl }).toArray();
  return findResult;
};

Добавьте маршруты к вашему API

• Сокращение URL

Чтобы сократить URL, нам нужно создать POST-запрос в api.js

app.post("/shrink", async (req, res) => {
  ...
});

После того, как мы определили маршрут. Нам нужно обработать входящие запросы.

Получите URL из тела post-запроса и сократите его с помощью нашей предыдущей функции.

let { url } = req.body;
let shortenedUrl = createUrl(url);

 
Далее мы проверяем, есть ли сокращенный URL уже в нашей базе данных, используя функцию findUrl(). Если есть, мы возвращаем сокращенный URL или переходим к следующей части.

let result = await findUrl(shortenedUrl);
if (result.length >= 1) return res.json({ shortenedUrl });

 
Если сокращенный URL не существует, мы добавляем его в базу данных с помощью структуры, определенной ранее выше, и отправляем обратно сокращенный URL.

let status = await addUrl(url, shortenedUrl);
if (status?.acknowledged) return res.json({ shortenedUrl });
else return res.json({ error: true }); // Not to make the server crash

 
Маршрут ‘/shrink’ в одном фрагменте

app.post("/shrink", async (req, res) => {
  let { url } = req.body;
  let shortenedUrl = createUrl(url);
  let result = await findUrl(shortenedUrl);
  if (result.length >= 1) return res.json({ shortenedUrl });
  let status = await addUrl(url, shortenedUrl);
  if (status?.acknowledged) return res.json({ shortenedUrl });
  else return res.json({ error: true });
});

• Растянуть URL

Для растягивания URL мы определим GET-маршрут.

Сначала мы определим маршрут в api.js

app.get("/s/:shortUrl", async (req, res) => {
  ...
});

 
Параметр :shortUrl в разделе маршрута капсулирует всю секцию после ‘/s/’ в переменную.

Сначала мы проверяем, есть ли url в базе данных или нет. Если он есть в базе данных, мы перенаправляем пользователя на URL или отправляем сообщение 404.

let { shortUrl } = req.params;
let result = await findUrl(shortUrl);
if (result.length > 0) return res.redirect(result[0]?.url);
else res.json({ 404: "no URL found" });

 
Маршрут ‘/s/:shortUrl’ в одном фрагменте

app.get("/s/:shortUrl", async (req, res) => {
  let { shortUrl } = req.params;
  let result = await findUrl(shortUrl);
  if (result.length > 0) return res.redirect(result[0]?.url);
  else res.json({ 404: "no URL found" });
});

И вуаля, у вас есть рабочий сокращатель ссылок 🎉🎉🎉🎊
Вот рабочий сокращатель ссылок