Логотип YeaHub

База вопросов

Собеседования

Тренажёр

База ресурсов

Обучение

Навыки

Войти

Выбери, каким будет IT завтра — вместе c нами!

YeaHub — это полностью открытый проект, призванный объединить и улучшить IT-сферу. Наш исходный код доступен для просмотра на GitHub. Дизайн проекта также открыт для ознакомления в Figma.

© 2026 YeaHub

Документы

Медиа

Назад
Вопрос про React Router: server, seo

Как настроить маршрутизацию на стороне сервера в приложении с использованием React Router DOM?

Этот вопрос проверяет понимание серверной маршрутизации

Короткий ответ

Для маршрутизации на стороне сервера необходимо настроить сервер (например, Node.js с Express), чтобы он обрабатывал все запросы и направлял их на главный HTML-файл приложения React. React Router на клиенте берет на себя рендеринг компонентов на основе пути.

Длинный ответ

Настройка маршрутов на сервере:

Используйте Node.js и Express:

const express = require('express');
const path = require('path');
const app = express();
// Обслуживание статических файлов
app.use(express.static(path.join(__dirname, 'build')));
// Обработка всех запросов
app.get('*', (req, res) => {
	res.sendFile(path.join(__dirname, 'build', 'index.html'));
});
app.listen(3000, () => console.log('Сервер запущен на порту 3000'));

Почему это важно:

  • Сервер возвращает один и тот же HTML-файл для всех запросов.

  • React Router интерпретирует URL и рендерит соответствующий компонент.

Для серверного рендеринга (SSR):

  • Используйте библиотеки, такие как react-router-dom/server и react-dom/server для рендеринга компонентов на сервере.

import { StaticRouter } from 'react-router-dom/server';
const html = renderToString(
	<StaticRouter location={req.url}>
		<App />
	</StaticRouter>
);

Итог: Настройка маршрутов на сервере обеспечивает поддержку глубоких ссылок и предотвращает ошибки 404 при прямом доступе к странице.

Уровень

  • Рейтинг:

    2

  • Сложность:

    7

Навыки

  • React Router

    React Router

Ключевые слова

#server

#seo

Подпишись на React Developer в телеграм