Marshrutlash - Node.js bilan server dasturlash

Marshrutlash - so'rovni to'g'ri ishlovchiga yo'naltirish. Express da u app.METOD(yol, ishlovchi) shaklida yoziladi.

Yo'l parametrlari #

JavaScript

import express from "express";

const app = express();

app.get("/talabalar/:id", (sorov, javob) => {
    javob.json({ id: sorov.params.id, turi: typeof sorov.params.id });
});

app.get("/guruh/:guruh/talaba/:id", (sorov, javob) => {
    javob.json(sorov.params);
});

const server = app.listen(0);
const port = server.address().port;
const asos = `http://localhost:${port}`;

console.log(await (await fetch(asos + "/talabalar/42")).json());
console.log(await (await fetch(asos + "/guruh/A1/talaba/7")).json());

server.close();

Natija

{ id: '42', turi: 'string' }
{ guruh: 'A1', id: '7' }

Parametrlar doim satr

sorov.params.id "42" - satr, son emas. URL da hamma narsa matn bo'lib keladi.

Bu 6-bo'limdagi process.env bilan bir xil tuzoq:

JavaScript

if (sorov.params.id === 42) { }     // hech qachon rost emas

Uni aylantirish va tekshirish kerak:

JavaScript

const id = Number(sorov.params.id);
if (!Number.isInteger(id) || id < 1) {
    return javob.status(400).json({ xato: "id noto'g'ri" });
}

Tekshiruvsiz Number("salom") NaN beradi va u ma'lumotlar bazasiga tushib, kutilmagan natija keltiradi.

So'rov qatori #

JavaScript

import express from "express";

const app = express();

app.get("/qidir", (sorov, javob) => {
    const sahifa = Number(sorov.query.sahifa ?? 1);
    javob.json({
        so: sorov.query.so ?? null,
        sahifa,
        tartib: sorov.query.tartib ?? "yangi",
    });
});

const server = app.listen(0);
const port = server.address().port;
const asos = `http://localhost:${port}`;

console.log(await (await fetch(asos + "/qidir?so=node&sahifa=3")).json());
console.log(await (await fetch(asos + "/qidir")).json());

server.close();

Natija

{ so: 'node', sahifa: 3, tartib: 'yangi' }
{ so: null, sahifa: 1, tartib: 'yangi' }

Manba	Qayerdan	Misol
`sorov.params`	Yo'lning bir qismi	`/talabalar/:id`
`sorov.query`	`?` dan keyin	`?sahifa=3`
`sorov.body`	So'rov tanasi	`POST` ma'lumoti

Ixtiyoriy parametr #

JavaScript

import express from "express";

const app = express();

app.get("/kitoblar{/:id}", (sorov, javob) => {
    if (sorov.params.id === undefined) {
        javob.json({ turi: "ro'yxat" });
        return;
    }
    javob.json({ turi: "bitta", id: sorov.params.id });
});

const server = app.listen(0);
const port = server.address().port;
const asos = `http://localhost:${port}`;

console.log(await (await fetch(asos + "/kitoblar")).json());
console.log(await (await fetch(asos + "/kitoblar/5")).json());

server.close();

Natija

{ turi: "ro'yxat" }
{ turi: 'bitta', id: '5' }

Express 5 da :id? sintaksisi olib tashlandi

Express 4 da ixtiyoriy parametr shunday yozilardi:

JavaScript

app.get("/kitoblar/:id?", ...);

Express 5 da bu xato tashlaydi:

Natija

Unexpected ? at index 6: /kitoblar/:id?

Yangi shakl - jingalak qavs: /kitoblar{/:id}. Qavs ichidagi qism ixtiyoriy bo'ladi.

Sabab: Express 5 yangi path-to-regexp kutubxonasiga o'tdi. Eski sintaksisning ba'zi shakllari chalkash va xavfsiz emas edi.

Eski qo'llanmalardagi kod shu yerda ko'p buziladi.

Joker belgi #

JavaScript

import express from "express";

const app = express();

app.get("/fayllar/*yol", (sorov, javob) => {
    javob.json({
        bolaklar: sorov.params.yol,
        massivmi: Array.isArray(sorov.params.yol),
        toliq: sorov.params.yol.join("/"),
    });
});

const server = app.listen(0);
const port = server.address().port;

const javob = await fetch(`http://localhost:${port}/fayllar/a/b/c.txt`);
console.log(await javob.json());

server.close();

Natija

{ bolaklar: [ 'a', 'b', 'c.txt' ], massivmi: true, toliq: 'a/b/c.txt' }

Joker belgi ham o'zgargan

Express 4 da nomsiz * ishlatilardi:

JavaScript

app.get("/fayllar/*", ...);      // Express 5 da XATO

Express 5 da jokerga nom berish shart: /fayllar/*yol.

Yana bir farq: natija massiv bo'ladi, satr emas. Yo'lni tiklash uchun .join("/") kerak.

E'tibor bering: foydalanuvchi bergan yo'lni to'g'ridan-to'g'ri faylga aylantirmang - unda .. bo'lishi mumkin. Buni 18-bo'limda ko'ramiz.

Tartib muhim #

JavaScript

import express from "express";

const app = express();

app.get("/talabalar/yangi", (s, j) => j.json({ shox: "aniq yo'l" }));
app.get("/talabalar/:id", (s, j) =>
    j.json({ shox: "parametr", id: s.params.id }));

const server = app.listen(0);
const port = server.address().port;
const asos = `http://localhost:${port}`;

console.log(await (await fetch(asos + "/talabalar/yangi")).json());
console.log(await (await fetch(asos + "/talabalar/42")).json());

server.close();

Natija

{ shox: "aniq yo'l" }
{ shox: 'parametr', id: '42' }

Aniq yo'llarni yuqoriga qo'ying

Express marshrutlarni yuqoridan pastga tekshiradi va birinchi mos kelganida to'xtaydi.

Agar tartibni almashtirsak:

JavaScript

app.get("/talabalar/:id", ...);      // avval
app.get("/talabalar/yangi", ...);    // keyin - HECH QACHON ishlamaydi

/talabalar/yangi so'rovi birinchi marshrutga tushadi va id "yangi" bo'lib qoladi. Ikkinchi marshrut o'lik kod bo'lib qolaveradi.

Qoida: aniq yo'llar parametrli yo'llardan oldin.

Zanjirlash #

JavaScript

import express from "express";

const app = express();

app.route("/mahsulotlar")
    .get((s, j) => j.json({ amal: "ro'yxat" }))
    .post((s, j) => j.status(201).json({ amal: "yaratildi" }));

const server = app.listen(0);
const port = server.address().port;
const asos = `http://localhost:${port}`;

const olish = await fetch(asos + "/mahsulotlar");
console.log(olish.status, await olish.json());

const yaratish = await fetch(asos + "/mahsulotlar", { method: "POST" });
console.log(yaratish.status, await yaratish.json());

const ochirish = await fetch(asos + "/mahsulotlar", { method: "DELETE" });
console.log("DELETE:", ochirish.status);

server.close();

Natija

200 { amal: "ro'yxat" }
201 { amal: 'yaratildi' }
DELETE: 404

app.route(yol) bir xil yo'l uchun turli metodlarni bir joyga yig'adi.

Router bilan bo'lish #

JavaScript

import { Router } from "express";

export const talabalarMarshruti = Router();

talabalarMarshruti.get("/", (sorov, javob) => {
    javob.json({ royxat: ["Malika", "Husanboy"] });
});

talabalarMarshruti.get("/:id", (sorov, javob) => {
    javob.json({ id: sorov.params.id });
});

JavaScript

import express from "express";
import { talabalarMarshruti } from "./talabalar-marshrut.mjs";

const app = express();

app.use("/talabalar", talabalarMarshruti);

const server = app.listen(0);
const port = server.address().port;
const asos = `http://localhost:${port}`;

console.log(await (await fetch(asos + "/talabalar")).json());
console.log(await (await fetch(asos + "/talabalar/9")).json());

server.close();

Natija

{ royxat: [ 'Malika', 'Husanboy' ] }
{ id: '9' }

Router - kichik, mustaqil ilova. Uni alohida faylda yozib, app.use bilan biror prefiksga ulash mumkin.

Katta loyihada marshrutlar shunday bo'linadi: talabalar, buyurtmalar, hisobotlar - har biri o'z faylida.

404 ni o'zingiz boshqarish #

JavaScript

import express from "express";

const app = express();

app.get("/bor", (s, j) => j.json({ holat: "topildi" }));

app.use((sorov, javob) => {
    javob.status(404).json({
        xato: "yo'l topilmadi",
        yol: sorov.path,
    });
});

const server = app.listen(0);
const port = server.address().port;
const asos = `http://localhost:${port}`;

console.log(await (await fetch(asos + "/bor")).json());

const yoq = await fetch(asos + "/yoq-bunday");
console.log(yoq.status, await yoq.json());

server.close();

Natija

{ holat: 'topildi' }
404 { xato: "yo'l topilmadi", yol: '/yoq-bunday' }

Hamma marshrutdan keyin qo'yilgan app.use - "hech biri mos kelmadi" degani. Bu JSON API uchun qulay: mijoz HTML o'rniga tushunarli JSON oladi.

Amaliy topshiriq

:id parametrli marshrut yozing.
Parametr satr ekanini isbotlang.
Uni songa aylantirib, tekshiruv qo'shing.
sorov.query bilan sahifalashni yozing.
Express 4 uslubidagi :id? ni sinab, xatoni ko'ring.
Uni {/:id} shakliga o'tkazing.
Nomlangan joker belgi bilan yo'l oling.
Aniq va parametrli yo'llar tartibini almashtirib ko'ring.
Router ni alohida faylga chiqaring.
Maxsus 404 ishlovchisi qo'shing.

Xulosa #

sorov.params - yo'ldan, sorov.query - ? dan keyin; ikkalasi ham doim satr.
Parametrni songa aylantirib, albatta tekshiring.
Express 5 da :id? xato - ixtiyoriy parametr {/:id} shaklida yoziladi.
Joker belgiga nom berish shart (*yol) va natija massiv bo'ladi.
Marshrutlar yuqoridan pastga tekshiriladi - aniq yo'llarni yuqoriga qo'ying.
app.route() bir yo'lning metodlarini yig'adi.
Router marshrutlarni alohida fayllarga bo'lish imkonini beradi.
Hamma marshrutdan keyingi app.use - maxsus 404.

Keyingi bo'limda oraliq qatlamlarni o'rganamiz.

Yo'l parametrlari #

So'rov qatori #

Ixtiyoriy parametr #

Joker belgi #

Tartib muhim #

Zanjirlash #

Router bilan bo'lish #

404 ni o'zingiz boshqarish #

Xulosa #

Xatolik topdingizmi?