Дійсно, справді базова маршрутизація в Node.js за допомогою Express

Мета цієї історії - коротко пояснити, як працює маршрутизація в Express, будуючи простий - дуже простий - додаток Node.

Ми також використовуватимемо EJS, механізм шаблонів, який "дозволяє створювати HTML-розмітку за допомогою простого JavaScript", згідно з їх веб-сайтом. По суті, це дозволить нам створювати HTML-сторінки, які можуть відрізнятися залежно від запиту, який робить клієнт. Ми не будемо використовувати цю останню функцію, але вона чудова. В кінці цієї статті ви знайдете кілька ресурсів, де можна дізнатись більше.

Що таке маршрутизація? (У 2-х рядках)

Перш за все, давайте швидко (дуже швидко) поглянемо, що таке маршрутизація:

somewebsite.com/someroute

В основному це перенесення користувача (або деяких даних) з одного місця в інше. Це місце - це маршрут. Я ж казав тобі, що збираюся зробити це швидко.

Створення проекту

Ми збираємось створити вишуканий веб-сайт, щоб дізнатися, як працює маршрутизація в Express. Перевір:

Класно, правда? Але це все, що нам потрібно на даний момент.

Спочатку давайте створимо проект та встановимо пакунки. Просто запустіть у командному рядку наступне:

npm встановити expressnpm встановити ejs

Ви можете додатково додати тире збереження тире (я пишу - як " тире", оскільки Medium автоматично форматує його, і це не добре для цього), щоб зберегти його у файлі package.json . Але як це працює - це історія на інший день.

Тоді ми будемо вимагати Express та встановити для механізму перегляду EJS у нашому файлі app.js таким чином:

var express = require('express');var app = express();app.set('view engine', 'ejs');

Ми також включимо такий рядок, щоб наш додаток слухав запити:

app.listen(3000);

Обробка запитів GET

Вітаємо, все готово для обробки запитів! У HTTP є кілька типів запитів, але ми оброблятимемо лише запити GET, які використовуються для отримання даних із сервера. Для обробки такого роду запитів у Express ми використовуємо такий спосіб:

app.get('/about', function(req, res) { res.render('about');});

Давайте подивимось, що тут відбувається. Ми повідомляємо нашому серверу, що кожного разу, коли хтось вводить текст на якомусь веб-сайті.com/about , ми хочемо запустити функцію. Ця функція приймає два параметри, req (запит) і res (відповідь). Використовуючи об’єкт відповіді, ми відображаємо сторінку about .

Щоб це працювало, нам доведеться створити сторінку з назвою about.ejs у HTML. Ми також розмістимо його в папці, яка називається поданнями, у папці нашого проекту. Це папка, куди Express буде виглядати, щоб відтворити подання. Ось у вас є мега-комплекс про сторінку про сторінку, яку ми будемо використовувати для цього прикладу:

Приємно! Але що, якщо користувач не вводить жодного маршруту? Так само, як це робимо більшість разів, somewebsite.com ? Ну, дуже просто. Змініть / about на just / і відтворіть сторінку, яка вам подобається:

app.get('/', function(req, res) { res.render('home');});

Обробка неіснуючих маршрутів

Але що, якщо хтось введе маршрут, якого не існує? Можливо, ми не хочемо, щоб відображалася сторінка помилок за замовчуванням. Натомість нам потрібна власна, крута сторінка помилок.

Ну, хороша новина полягає в тому, що зробити це з Express дуже легко. Просто замініть параметр маршруту в методі get зірочкою і зробіть свою власну сторінку помилок приблизно так:

app.get('*', function(req, res) { res.render('error');});

Спробуйте!

Нарешті, давайте запустимо наш сервер із командного рядка (якщо припустимо, що сервер називається app.js )

вузол додаток

і подивіться, чи це працює! Введіть ім’я нашого сервера ( localhost , оскільки це локальний сервер, що працює на нашому комп’ютері) та порт ( у цьому випадку 3000 ) у нашому браузері:

localhost: 3000

Дивовижний!

Подальше читання

Ви можете дізнатися все, що вам потрібно знати про маршрутизацію, у посібнику Express, а на веб-сайті EJS також є багато корисних речей!

Сподіваюся, ця стаття була для вас корисною. Якщо це було, залиште коментар і заплескайте!

Щасливого кодування ... Або щасливої ​​маршрутизації, я думаю!