Генерация sitemap xml: Sitemap . XML Sitemaps

Генерация карты сайта

Ежемесячная рассылка CSSSR

Новости, свежие статьи и многое другое

e-mail

Отправляя данную форму, я подтверждаю своё согласие на получение рекламных и информационных материалов, а также факт своего ознакомления и согласия с Политикой конфиденциальности


Приём-приём! На связи Игорь — JS-разработчик команды «Восток». Представляю вам рассказ о том, как я, работая над задачей по нашему сайту, вынес решение в публичный NPM пакет.

Проблема

Пару месяцев назад мы переписали фронтенд нашего сайта на React. Все страницы также рендерятся на сервере для индексации поисковиками. Для улучшения этого процесса роботам нужно давать подсказки. Одной из таких подсказок является карта сайта — sitemap.xml. Так как у нас периодически добавляются новые страницы, то встал вопрос — можно ли автоматизировать обновление карты сайта при деплое новой версии сайта? И я начал поиски.

Поиски решений

Первым результатом поисков было issue в репозитории react-router, где обсуждали эту же задачу. Но там дали только направление и код, который возвращает список путей из конфигурации React Router. Это позволило понять, что автоматизировать нашу задачу можно!

Самое интересное, что пользователь, который подсказал это решение, создал у себя репозиторий react-router-sitemap, но кроме файла лицензии и Readme там ничего не было. Видимо руки не дошли. 🙂

Далее необходимо было найти решение, которое трансформировало бы пути в XML формат карты сайта. Ну тут долго искать не пришлось, а вот выбирать предстояло. Решений очень много.

Так как сайт мы собираем с помощью Webpack, то было решено использовать плагин, который встраивался бы в нашу систему сборки. API у этого плагина простое. На вход он принимает hostname сайта, массив путей и путь, куда сохранить полученный результат.

Решение для трансформирования путей в XML формат карты сайта выбрано, одной проблемой меньше. Осталось написать парсер конфигурации React Router. Поехали!

Реализация своего решения

У React Router в API есть функция, которая нам поможет — createRoutes. На вход подается конфигурация маршрутов, а на выходе получается массив объектов, которые описывают все возможные пути в вашем приложении. Пути находятся в ключах path.

В итоге, я написал модуль, который рекурсивно обходит массив объектов и сохраняет пути в одноуровневый массив. Ниже представлен код этого модуля:

sitemap/react-router-parser.js

// Формирует строку с путём, включая родительский путь, если он есть.
const generatePath = (base, path = '') => {
  base = base.length && base[base.length - 1] !== '/' ? base + '/' : base
  return base + path
}
// Парсит отдельный объект массива. Записывает путь в результирующий массив,
// если у этого пути есть вложенные пути, то для них вызывается функция parseRoutes.
// И так рекурсивно в глубину.
const processRoute = (store = [], baseRoute = '', route) => { const path = generatePath(baseRoute, route.path) const childRoutes = route.childRoutes if (childRoutes && childRoutes.length) { parseRoutes(store, path, childRoutes) } store.push(path) } // Обходит массивы с объектами и возвращает массив с путями. const parseRoutes = (store = [], baseRoute = '', routes) => { const isArray = Array.isArray(routes) if (!isArray) { store.push(generatePath(baseRoute, routes.path)) } else { routes.forEach(processRoute.bind(null, store, baseRoute)) } return store } export default parseRoutes

Результат, который возвращает этот модуль, можно подавать в Webpack плагин, но есть несколько нюансов.

Во-первых, не все пути должны попадать в карту сайта. Во-вторых, у нас в проекте есть динамические маршруты, следовательно, в результирующем массиве будут примерно такие пути —

/project/:projectName.

Это никуда не годится. \/offert/] const result = filterPaths(paths, config) // [‘/’]

С заменой параметров только один вопрос — как получить параметры для динамических путей? Так как сайт статичный и данные для таких путей у нас хранятся в JSON файлах, то проблем с этим не возникло. Была написана такая функция:

sitemap/replace-params.js

const replaceParams = (paths, rules) => {
  const regexRules = Object.keys(rules).map((key) => {
    return new RegExp(':' + rules[key].param)
  })
  return paths.reduce((result, path, index) => {
    let current = [path]
    if (index === 1) {
      result = [result]
    }
    regexRules.forEach((regex) => {
      if (!regex.test(path)) {
        return
      }
      const { values } = rules[path]
      current = values.map((value) => {
        return path.replace(regex, value)
      })
    })
    return result.concat(current)
  })
}

На вход она принимает массив путей и конфигурацию такого вида:

{
  '/project/:projectName': { // путь, в котором нужно заменить параметры
    param: 'projectName', // имя параметра, которое нужно заменить на значение
    values: ['foo', 'bar'], // значения, которые нужно подставить на место параметра
  },
}

Пример работы этой функции:

const paths = ['projects/:projectName']
const config = {
  'projects/:projectName': {
    param: 'projectName',
    values: ['foo', 'bar'],
  },
}
const result = replaceParams(paths, config) // [’projects/foo’, ’projects/bar’]

Нужные функции написаны, осталось объединить их в один модуль и внедрить в сборку.

\/jobs\/.+\/.+/] const paramsConfig = { ‘/jobs/:jobName’: { param: ‘jobName’, values: vacancies, }, } const rawRoutes = createRoutes(routes) const paths = parser([], », rawRoutes) const filteredPaths = filterPaths(paths, filterConfig) const result = replaceParams(filteredPaths, paramsConfig) export default result

Так как мы используем ES2015 синтаксис, то пришлось обернуть этот модуль ещё в один скрипт, чтобы траспайлить его:

sitemap/index.js

// Из-за того, что у нас проекте используются cssModules, при импорте routes,
// по цепочке, начинают импортироваться стили, и node.js кидает ошибки.
// Было решено просто игнорировать эти импорты.
require.extensions['.css'] = function () {
  return null
}
// Включаем транспайлинг и полифил для использования новых методов,
// которых нет в ES5.
require('babel-register')
require('babel-polyfill')
// Экспортируем результат выполнения нашего модуля.
module.exports = require('.
/paths-builder').default

Приступаем к внедрению в сборку. Ниже представлена часть Webpack конфига, которая отвечает за создание карты сайта:

webpack.config.js

import paths from './sitemap';
import SitemapPlugin from 'sitemap-webpack-plugin';
const sitemapDist =  '../../static/sitemap.xml';
const hostname = process.env.BASE_URL;
const config = {
  ...,
  plugins: [
    ...,
    new SitemapPlugin(hostname, paths, sitemapDist),
    ...,
  ]
  ...,
};

Проверив локально работу данного плагина и убедившись, что все работает корректно, я отправил Pull Request.

Первый (и последний) фэйл

После проверки работы модуля в тестовом окружении обнаружилась критичная бага. По непонятным причинам Webpack плагин отказывался создавать файл по указанному ему пути. Ошибка возникала при попытке сохранить файл в директорию, отличную от нахождения Webpack конфига. С правами на запись было всё в порядке.

Разобраться, почему так происходит, у нас не вышло, и я отказался от Webpack плагина в пользу NPM скрипта.

Для генерации карты сайта был выбран самый популярный NPM пакет. Для его использования пришлось немного дополнить наш модуль, примерно так:

sitemap/index.js

require.extensions['.css'] = function () {
  return null
}
require('babel-register')
require('babel-polyfill')
const fs = require('fs')
const sm = require('sitemap')
const paths = require('./paths-builder').default
const sitemap = sm.createSitemap({
  hostname: process.env.BASE_URL,
  urls: paths.map((_path) => ({ url: _path })),
})
fs.writeFileSync('./static/sitemap.xml', sitemap.toString())

Для запуска модуля был объявлен скрипт в package.json:

{
  ...,
  "sitemap": "node ./sitemap",
  ...,
}

После проверки в тестовом окружении ошибок и проблем не возникло, и модуль был включен в ближайший деплой.

А может поделиться?

Модуль написан, внедрён и прекрасно работает. Казалось бы всё, можно отдыхать. Но я не остановился и решил, что надо его оформить в публичный NPM пакет. Всё-таки при поиске был вопрос ещё у одного пользователя по схожей задаче, а решения публичного нет. Заодно код причешу и попрактикуюсь в разработке open source решений (до этого я ничего сам не выпускал).

За пару недель работы по вечерам я справился с поставленной задачей и опубликовал NPM пакет react-router-sitemap.

Итог

За это время я переписал необходимые функции и предоставил возможность использования только необходимых функций из пакета. Покрыл основную часть кода тестами, написал документацию, часть которой генерируется из jsDoc комментариев в коде. Ну и конечно же внедрил в наш сайт.

Призываю не бояться, делиться своими внутренними разработками (если они не засекречены, конечно) и выпускать их в качестве NPM пакетов или просто в публичных репозиториях. Если будет интерес, то я расскажу подробнее о своём пути публикации NPM пакета и вообще про разработку open source библиотеки.

Если есть вопросы, пишите их в комментариях в блоге или твиттере. Готов на всё ответить.

Всем спасибо за внимание и до связи!

Ежемесячная рассылка CSSSR

Новости, свежие статьи и многое другое

e-mail

Отправляя данную форму, я подтверждаю своё согласие на получение рекламных и информационных материалов, а также факт своего ознакомления и согласия с Политикой конфиденциальности

Поделиться

Читайте также

  • Итоги 2022 от CSSSR. Год жизни уездного фронтира

    Максим Вислогуров

  • Итоги 2021 от CSSSR. Год длиной в железнодорожный состав

    Максим Вислогуров

Комментарии

Генератор карты сайта Sitemap.

xml для OpenCart v.1.4.x
Написать отзыв

Отправить отзыв

Артур, 06.12.2016, 11:47

Установил, карта с генерировалась, но когда когда вставляю URL в яндекс анализатор https://сайт/sitemap.xml пишет, что не удалось повторите позже…. Подскажите кто в курсе. Спасибо!

ответить10

Артур, 06.12.2016, 11:46

Установил, карта с генерировалась, но когда когда вставляю URL в яндекс анализатор https://сайт/sitemap.xml пишет, что не удалось повторите позже…. Подскажите кто в курсе. Спасибо!

ответить10

Ігор, 10.06.2015, 01:12

в мене в адмінке все один на один поналазило, як ісправить?

ответить10

alexandr, 05.03.2015, 15:50

версия 1,5,6. поставил, ругался немного. нужно вручную создать 2 файла в корне сайта — /sitemap.xml.gz и sitemap.xml поставить на них полный доступ.

ответить10

dfsdf sf sdfsdf, 20.02.2015, 14:32

Спасибо большое! Версия Версия 1.5.5.1.2. Все делал по инструкции все работает! Спс!

ответить10

babichsania, 27. 01.2015, 23:22

Установил на версию 1.5.6.4 — установил права доступа у пункте группа пользователей и все работает отлично!

ответить10

Habib0592, 04.07.2014, 09:48

<b>mydenz</b>,Система&gt;Пользователи&gt;Группы пользователей&gt; Главный администратор (изменить) &gt; Разрешён просмотр и внесение изменений (выделить все)<br /><br />У меня настройки не сохраняет и вместо карты белый экран https://temp-market.ru/sitemap.xml

ответить10

aleksei_t, 24.03.2014, 10:19

как разделить большую кату сайта ?

ответить10

mydenz, 02.03.2014, 10:52

а что значит &quot;В админке дать права на управление модулем&quot; где это сделать не понял?<br /><br />Люди подскажите что значит &quot;В админке дать права на управление модулем&quot;<br />Где это можно сделать ?<br /><br />Все сделал как в инструкции почему карта не открывается https://mds-shop.ru/sitemap. xml ??? Подскажите что сделать

ответить10

alexstyl, 08.01.2014, 00:40

<b>babichsania</b>, там про установку в текстовом файле написано. на ос1.5.6<br />выдает ошибку: Fatal error: Class &#039;Modelmodulesitemap&#039; not found in …… /system/engine/loader.php on line 46. Не ясно, где этот класс в исходнике найти…

ответить10

babichsania, 04.01.2014, 13:59

А как назначит права доступа? не могу понять…

ответить10

mabrur, 01.10.2013, 21:33

Все сделал, но на месте где должна быть карта сайта — белый экран. Что мне делать?

ответить10

Andeton, 05.09.2013, 16:24

а что значит &quot;В админке дать права на управление модулем&quot; чото не полян!

ответить10

Spartak_31C, 25.03.2013, 22:20

Работает на 1.5.4, жаль, что автоматом не обновляется

ответить10

dj_hummer, 30.11.2012, 20:14

а у меня вообще админка пропала после установки

ответить10

vic, 08. 11.2012, 14:33

<b>mchumak</b>, Спасибо

ответить10

mchumak, 08.11.2012, 12:11

на 1531 у меня ошибку выдает выше описана

ответить10

vic, 08.11.2012, 03:00

На 1531 работает?

ответить10

mchumak, 31.10.2012, 10:30

У меня ошибку вот такую выдает<br />Notice: Error: Could not load model catalog/sitemap! in /home/komplektma/komplektmarket.ru/docs/system/engine/loader.php on line 48<br />кто подскажет в чем дело?

ответить0-1

Waha, 21.05.2012, 14:29

У меня в админке модуля нету((, но вайл сайт мап он наполняет!

ответить10

Sitemap.XML Generator Online — создание карты сайта, бесплатный генератор XML карты сайта

 Добавить «lastmod»

 Добавить «приоритет»

 Добавить «changefreq»

 Игнорировать «nofollow»

 Уважайте «robots.txt»

Ограничение: не более 500 страниц сайта

Для проверки сайтов с количеством страниц от 500 и более используйте нашу бесплатную программу SiteAnalyzer >>


Игнорировать типы файлов:

Капча: обновить

 
(код показан на картинке)

Одним из критериев технической оптимизации сайта и его готовности к продвижению является наличие файла Sitemap. xml, который содержит полный набор релевантных страниц и отображает текущую структуру сайта. Этот файл используется поисковыми системами для поиска новых страниц сайта, а также с его помощью робот поисковой системы информируется о страницах, которые необходимо проиндексировать.

Помимо URL самих страниц, файл sitemap.xml содержит дополнительную информацию в виде метаданных с указанием для каждого URL:

  • дату последнего изменения
  • частота изменений
  • его приоритет на уровне сайта

Чтобы не тратить время на создание такого файла вручную, был разработан этот инструмент.
Генератор Sitemap предназначен для онлайн-генерации файла «sitemap.xml», который полностью соответствует стандартам XML и учитывается всеми поисковыми системами.

После создания карты сайта необходимо скопировать ее в корневую папку сайта и добавить директиву Sitemap в конец файла robots.txt — https://some-site.com/sitemap. xml.

П.С. Ограничение инструмента: не более 500 страниц .
Для проверки сайтов с количеством страниц от 500 и более используйте нашу бесплатную программу SiteAnalyzer >>

0 комментариев

Вы должны быть авторизованы, чтобы оставить комментарий.


Популярные инструменты SEO / Все инструменты

Релевантность текста

Текст Семантика

Средство проверки переадресации

Детектор CMS

Заголовок и шашка h2

Поиск субдоменов

Массовое индексирование сайта

             
URL Код состояния HTTP

Генератор карты сайта

Программа проверки robots. txt

Проверка возраста домена

Text Unique Checker

Генератор УУЛЕ

Извлекатель звеньев

             
      SiteAnalyzer

     

<< Назад

Карта сайта Создание XML? — Общее — Форум

дизайн (Джейсон Гипсон) 1

Недавно запустил новый сайт Webflow и размещаю его на Webflow. Интересно, что домашняя страница еще не проиндексирована, но одна внутренняя страница уже проиндексирована. У меня иногда это случалось даже с сайтом WordPress, и разобраться с ним было сложно, а иногда и невозможно с Google (нечасто случается в Bing).

SEO, конечно, важно, но оно постоянно меняется, поэтому я начал изучать еще кое-что. Вот то, что я знаю или, по крайней мере, думаю, что знаю.

Глядя на сгенерированную карту сайта, они не имеют приоритетов, назначенных страницам, частоте или датам. Еще одна вещь, которую я заметил, это то, что косая черта не используется с URL-адресом домашней страницы, и я почти уверен, что это должно быть. @cyberdave Так и должно быть?

При публикации сайта Webflow все страницы публикуются и обновляются с отметкой времени в формате HTML. – Последняя публикация: четверг, 06 августа 2015 г., 14:00:57 GMT+0000 (UTC) . Согласно нескольким источникам, я обнаружил, что это не очень хорошо для SEO. Это старая статья, но я думаю, что она все еще актуальна. Важно ли время «последнего изменения» в XML-файлах Sitemap? | SEO-форум | млн унций Если нет, может кто-нибудь поправить меня. WordPress прикрепляет даты публикации к страницам и статьям, по крайней мере, при использовании Yoast.

Имея это в виду, было бы лучше, если бы Webflow не генерировал дату в HTML и позволял пользователям добавлять опубликованные даты в карту сайта, используя протокол карты сайта sitemaps.org-Protocol? Или мы могли бы получить постраничный контроль над публикацией.

Я не эксперт по поисковой оптимизации, но мне очень повезло с ранжированием страниц. У меня есть один вопрос новичка… что означает .9 в urlset xmlns=»www.sitemaps.org — /schemas/sitemap/0.9/»>?

Дополнительная вспомогательная информация
http://webmasters.stackexchange.com/questions/19472/прямая косая черта на URL-адресах в файле карты сайта

jdesign (Джейсон Гипсон) 2

@thewonglv Могу я узнать мнение по этому вопросу? Просто хочу убедиться, что оптимизирую наилучшим образом.

кибердэйв (Дэйв С.) 3

Привет @jdesign, всего пара вещей. Webflow позволяет вставлять собственную карту сайта в поле карты сайта на вкладке SEO.

Хорошим местом для создания карты сайта является https://www.xml-sitemaps.com. Там вы можете сгенерировать различные параметры, которые должны быть в вашей карте сайта.

Затем перейдите на страницу настроек вашего сайта и нажмите на вкладку SEO. Там вы можете вставить поле sitemap.xml и создать карту сайта для своего сайта.

После создания карты сайта вы можете перейти в Инструменты Google для веб-мастеров и отправить карту сайта, используя свое доменное имя, например: www.mydomain.com/sitemap.xml.

Webflow не генерирует приоритеты карты сайта, частоту или даты, вы должны сделать это вручную. Что касается изменений в том, как работает отметка времени, вы можете создать элемент списка желаний, как вы хотите, чтобы это работало http://forum. webflow.com/category/feedback/wish-list

.9 означает, что это версия используемая схема карты сайта xml.

Надеюсь, это поможет. Если нет, пожалуйста, дайте мне знать — я буду рад помочь в дальнейшем!

Ура,
Дэйв

jdesign (Джейсон Гипсон) 4

@cyberdave Спасибо за ответ, это хорошая ссылка.

Я уже добавил свою собственную карту сайта с помощью генератора и отправил ее в Google. Но он добавил косую черту в конце, и я просто хотел убедиться, что можно использовать косую черту или ее следует опустить в зависимости от того, как Webflow обрабатывает файлы.

Я протестировал обе версии через Google и не получил ни одной ошибки, но я не уверен, что получу… думая, что проблема на самом деле в результатах поиска.

Добавлю удаление отметки времени HTML в список пожеланий. Возможно, другие смогут внести свой вклад, но я думаю, что одинаковая временная метка на всех страницах — не лучший план, а противоречие временной метки с датой последней публикации через карту сайта может быть еще хуже. Однако, если кто-то знает другое, я хотел бы услышать.

Спасибо!

кибердэйв (Дэйв С.) 5

Привет @jdesign, вы можете сделать карту сайта с косой чертой или без нее с технической точки зрения.

Эта статья может помочь вам при создании карты сайта: Официальный центральный блог Google для веб-мастеров: косая черта или не косая черта

Надеюсь, это поможет. Если нет, пожалуйста, дайте мне знать — я буду рад помочь в дальнейшем!

Ура,
Дэйв

1 Нравится

(Брайант Чоу) 6

К вашему сведению, временная метка «последняя публикация», которую мы записываем в HTML, не влияет на то, как Google индексирует ваш сайт. Он находится в блоке комментариев HTML, который поисковые роботы Google не анализируют.

2 лайков

(Джейсон Гипсон) 7

Хорошо. Я так не думал, но наткнулся на две статьи, которые, казалось, подразумевали, что метка времени была прочитана. Спасибо за разъяснение.

система (система) Закрыто 8

Эта тема была автоматически закрыта через 60 дней после последнего ответа.

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *