Question

我正在使用rss-parser解析RSS feed，并将结果显示在列表中。

数据将这样添加到状态：

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?）？

Answer 1

您可以使用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)

Answer 2

您可以使用HTML解析器，例如https://www.npmjs.com/package/fast-html-parser并获得src属性。

从RSS Feed显示图像

2 个答案: