Делаем 301 редирект на Node.js для Nuxt.js

Статья для тех, кому лень включать мозги и хочется быстро сделать 301 редирект для сайта на Nuxt.js. Код будем писать на Node.js (т.е на JavaScript, просто он будет выполняться на сервере), а подключим его с помощью serverMidleware.

Шаг 1

В папке проекта создаем файл и папку (там где nuxt.config.js): 301.json и serverMiddleware.

Шаг 2

Содержимое 301.json будет выглядеть как-то так:

Для удобства прикладываю ссылку на Github, там будет лежать код для файлов: 301.json и serverMiddleware/seo.js (мы его в следующем шаге напишем).

На скриншоте я попытался отобразить два возможных сценария перенаправления. Первый - мы перебрасываем пользователя на сторонний сайт. Второй - перебрасываем пользователя на другую страницу внутри нашего сайта. Т.е from это откуда перенаправляем, а to куда.

Шаг 3

Топаем в папку serverMiddleware и внутри нее создаем файл seo.js. Содержимое seo.js будет выглядеть как-то так:

Код доступен по ссылке на Github для скачивания.

Здесь мы подключаем массив из файла 301.json, который лежит в главной папке проекта. Далее Node.js ищет соответствие между актуальным url адресом, на который кто-то зашел (это req.url) и r.from. Последний это адрес, откуда будет происходить перенаправление. Если соответствие между req.url и r.from найдено, происходит перенаправление.

Шаг 4

В главной папке проекта есть файл nuxt.config.js, давайте там подключим нашу новую серверную настройку. Открываем nuxt.config.js и записываем туда такие строки…

На самом верху подключаем модуль:

import serveStatic from 'serve-static'

И далее в теле файла nuxt.config.js подключаем нужный нам файл из папки serverMiddleware:

...
serverMiddleware: [
 '~/serverMiddleware/seo.js'
],
...

Для наглядности примера приложу скриншот из моего проекта.

Сохраняем новое содержимое файла и Nuxt.js начинает автоматически пересобирать проект, если в данный момент вы находитесь в режиме разработки (npm run dev).

Если проект уже лежит на хостинге, его нужно пересобрать самим с помощью SSH-команды:

npm run build

Или:

nuxt build

Данную команду нужно вызывать из папки где лежит проект (где nuxt.config.js). После "пересборки" необходимо перезапустить Node.js на хостинге.

Пример показан на хостинге Netangels.ru, у вас это может быть совсем по другому!

Спасибо за прочтение, если материал был полезен, поддержи меня доброй мыслью.