Отображение изображения из RSS-канала - PullRequest
0 голосов
/ 10 июля 2019

Я анализирую RSS-канал, используя rss-parser , отображая результаты в виде списка.

Данные добавляются в состояние следующим образом:

async getJobsData() {
    let feed = await parser.parseURL(
      "https://weworkremotely.com/categories/remote-design-jobs.rss"
    );

    this.setState({ data: feed.items });
  }

Текстовые поля просты, так как они появляются как <pubDate>Mon, 20 May 2019 10:36:42 +0000</pubDate> и добавляются в соответствующие элементы списка с помощью <span key={index}>{data.pubDate}</span>.

Ответ для изображений отформатирован по-разному.Он вставляется в общий ответ content как первый элемент.

title: [...]
pubDate: [...]
content: "<img src="https://we-work-remotely.imgix.net/logos/0015/7503/logo.gif?ixlib=rails-2.1.3&w=50&h=50&dpr=2&fit=fill&auto=compress" alt="Logo.gif?ixlib=rails 2.1" />

Как мне извлечь из этого поля только URL (https://we-work-remotely.imgix.net/logos/0015/7503/logo.gif?)?

Ответы [ 2 ]

1 голос
/ 10 июля 2019

Вы можете использовать DOMParser для анализа текстового представления в DOM.

Ниже приведен фрагмент кода img.src.

const imgText = `<img src="https://we-work-remotely.imgix.net/logos/0015/7503/logo.gif?ixlib=rails-2.1.3&w=50&h=50&dpr=2&fit=fill&auto=compress" alt="Logo.gif?ixlib=rails 2.1" />`
const doc = new DOMParser().parseFromString(imgText, 'text/html')

console.log(doc.body.firstElementChild.src)
0 голосов
/ 10 июля 2019

Вы можете использовать HTML-парсер, например, https://www.npmjs.com/package/fast-html-parser и получить атрибут src.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...