Как преобразовать ссылку в markdown() для ссылки на favicon с помощью Google S2 Converter?

Question

Я хотел бы, чтобы у ссылок уценки был значок в преобразованной ссылке.

https://www.google.com/s2/favicons?domain=http://cnn.com- вернет значок из любого домена.

Помечено ( https://github.com/chjj/marked) - превратит все ссылки в моем коде в href's

• http://cnn.com/ становится <a href="http://cnn.com">http://cnn.com</a>

Итак, как бы я изменил mark.js так, чтобы - http://cnn.com/

станет <a href="http://cnn.com"><img src="https://www.google.com/s2/favicons?domain=http://cnn.com">http://cnn.com</a>

Я вижу эту строку 452 отмечено.js autolink: /^<([^ >]+(@|:\/)[^ >]+)>/, Ссылка: https://github.com/chjj/marked/blob/master/lib/marked.js

Я использую ExpressJS и NodeJS

Спасибо Роб

Answer 1

Вы можете переопределить метод визуализации.

Marked работает в два этапа: (1) он разбирает Markdown на связку токенов и (2) переводит эти токены в HTML. Поскольку вы не хотите изменять разбор Markdown (он уже правильно идентифицирует ссылки), но вы хотите изменить вывод HTML, вы хотите переопределить средство визуализации для ссылок.

var renderer = new marked.Renderer();

get_favicon = function (text) {
    // return replacement text here...
    var out = '<img src="https://www.google.com/s2/favicons?domain='
    out += text + '">' + text + '</a>'
    return out
}

renderer.link = function (href, title, text) {
  if (this.options.sanitize) {
    try {
      var prot = decodeURIComponent(unescape(href))
        .replace(/[^\w:]/g, '')
        .toLowerCase();
    } catch (e) {
      return '';
    }
    if (prot.indexOf('javascript:') === 0 || prot.indexOf('vbscript:') === 0 || prot.indexOf('data:') === 0) {
      return '';
    }
  }
  var out = '<a href="' + href + '"';
  if (title) {
    out += ' title="' + title + '"';
  }
  out += '>' + get_favicon(text) + '</a>';
  return out;
};
}

// Pass the custom renderer to marked with the input.
markdown(input, renderer=renderer)

Обратите внимание, что я просто взял метод ссылки по умолчанию и немного изменил его, чтобы передать text сквозь get_favicon функция. get_favicon функция принимает текстовую строку и возвращает текст замены (в данном случае изображение). Вероятно, это можно улучшить, поскольку не все ссылки будут содержать домен в качестве текстового содержимого. Если текст содержал больше, чем домен (путь, фрагмент, строка запроса и т. Д.), Используйте домен только для ссылки на значок. Или, если текст вообще не содержит ссылки (так как один и тот же рендер используется для всех ссылок, а не только для автоматических ссылок), текст должен быть возвращен без изменений. Я оставлю эти улучшения в качестве упражнения для читателя.

Answer 2

Вам не нужно связываться с отмеченным исходным кодом.

Это простое регулярное выражение должно сработать:

const markedOutput = '<a href="http://cnn.com">http://cnn.com</a>';
const withFavIcons = markedOutput.replace(/(<a[^>]+>)(https?:\/\/[^<]+)(<\/a>)/gi, (m, open, url, close) => {
    const favicon = '<img src="https://www.google.com/s2/favicons?domain=' + url + '">';
    const truncated = url.length > 50 ? url.slice(0, 47) + '...' : url;
    return open + favicon + truncated + close;
});