Генерация полных URL-адресов на Eleventy и Netlify

Question

Я работаю над блогом и веб-сайтом на базе Eleventy. Функции совместного использования в социальных сетях, такие как Facebook OpenGraph и Twitter-карты, должны иметь полные абсолютные URL-адреса на такие ресурсы, как изображения. Twitter особенно отвергает любые относительные URL-адреса изображений.

Предлагает ли Eleventy собственный способ создания полных URL-адресов? Поскольку Eleventy - это статический сайт, созданный, в отличие от размещенного веб-сервера, он не может получать эту информацию из заголовков HTTP, как другие системы. Сайт размещен на Netlify, если Netlify предоставляет какие-либо инструменты для генерации URL-адресов из JS. У меня уже есть несколько задач по созданию изображений с измененным размером с помощью Gulp.

В настоящее время я просто использую свою собственную конфигурацию сайта, подобную этой, для генерации URL-адресов в шаблонах Nunjucks:

{# page_twitter_image is a site root relative path to the image #}
{% if page_twitter_image %}
<meta name="twitter:image" content="{{ site_base_url }}{{ page_twitter_image }}" />
{% endif %}

Подробнее о создании URL-адресов здесь.

Answer 1

Насколько я знаю (на основании документации: https://www.11ty.dev/docs/data/) ответ отрицательный. Я думаю, что ваше решение имеет смысл.

Я подаю справку, чтобы можно было получить к этому доступ. Я думаю, это должно быть доступно в данных страницы и, возможно, через шорткоды / фильтры.

Answer 2

Официальный плагин RSS включает очень простой фильтр Nunjuck.absoluteUrl. Если вы добавите этот плагин, ваш код может быть:

<meta name="twitter:image" content="{{ page_twitter_image | url | absoluteUrl(site_base_url) }}" />

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

Answer 3

| Фильтр URL-адресов предварительно отложит базовый URL-адрес сайта до предполагаемой строки URL-адреса.