首页 > 解决方案 > 如何将内容丰富的富文本格式化为 RSS 提要的可读 html?

问题描述

概括

我试图弄清楚如何将内容丰富的 JSON 数据格式化为我网站上的 RSS 提要的可读 HTML。我正在处理我的gatsby-config.js文件,所以我不能import使用任何插件。所以我需要解决这个问题。

相关信息

当我使用 // 'content:encoded': JSON.stringify(edge.node.body.json)它时,它会向我显示数据,但它是未格式化的。

这是我的代码gatsby-config.js

(我已经注释掉了 content:encoded 并且它给了我在生产模式下的描述,这是一件好事。但我无法达到用 json 博客内容显示整个博客的地步。

{
      resolve: `gatsby-plugin-feed`,
      options: {
        query: `
          {
            site {
              siteMetadata {
                title
                author
                description
                email
                siteUrl
                site_url: siteUrl
              }
            }
          }
        `,

        setup: ({ query: { site } }, options) => ({
          ...options,
          title: "Gimmix' RSS Feed",
          description: site.siteMetadata.description,
          site_url: site.siteMetadata.siteUrl,
          feed_url: `${site.siteMetadata.siteUrl}/rss.xml`,
          image_url: 'https://i.postimg.cc/JnqZPb3f/Gx-FAVICON.png',
          webMaster: `${site.siteMetadata.author} ${site.siteMetadata.email}`,
          managingEditor: site.siteMetadata.author,
          copyright: `${new Date().getFullYear()} ${site.siteMetadata.title}`,
          language: 'nl',
          generator: 'GatsbyJS',
          custom_namespaces: {},
          custom_elements: [{}],
        }),

        feeds: [
          {
            serialize: ({ query: { site, allContentfulBlogPost } }) => {
              return allContentfulBlogPost.edges.map((edge) => {
                return {
                  title: edge.node.title,
                  author: site.siteMetadata.author,
                  description: edge.node.subtitle,
                  date: edge.node.publishedDate,
                  url: `${site.siteMetadata.siteUrl}/blog/${edge.node.slug}`,
                  guid: `${site.siteMetadata.siteUrl}/blog/${edge.node.slug}`,
                  custom_elements: [
                    {
                      // 'content:encoded': edge.node.body.json,
                    },
                  ],
                };
              });
            },
            query: `
              {
                allContentfulBlogPost(sort: { fields: publishedDate, order: DESC }) {
                  edges {
                    node {
                      title
                      subtitle
                      slug
                      publishedDate
                      body {
                        json
                      }
                    }
                  }
                }
              }
            `,

            output: '/rss.xml',
            title: "Gimmix' RSS Feed",
            // optional configuration to insert feed reference in pages:
            // if `string` is used, it will be used to create RegExp and then test if pathname of
            // current page satisfied this regular expression;
            // if not provided or `undefined`, all pages will have feed reference inserted
            match: '^/blog/',
            // optional configuration to specify external rss feed, such as feedburner
            link: 'https://feeds.feedburner.com/GimmixWMB',
          },
        ],
      },
    },

环境

现场项目https ://gimmix.nl

rss xml 链接https ://gimmix.nl/rss.xml

feedburner(实时 RSS 提要)https ://feeds.feedburner.com/GimmixWMB

System:
    OS: macOS 10.15.7
    CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Shell: 5.7.1 - /bin/zsh
  Binaries:
    Node: 13.11.0 - ~/.nvm/versions/node/v13.11.0/bin/node
    Yarn: 1.22.10 - /usr/local/bin/yarn
    npm: 6.14.8 - ~/.nvm/versions/node/v13.11.0/bin/npm
  Languages:
    Python: 2.7.16 - /usr/bin/python
  Browsers:
    Chrome: 86.0.4240.75
    Safari: 14.0
  npmPackages:
    gatsby: ^2.24.73 => 2.24.73
    gatsby-image: ^2.4.21 => 2.4.21
    gatsby-plugin-canonical-urls: ^2.3.13 => 2.3.13
    gatsby-plugin-catch-links: ^2.3.15 => 2.3.15
    gatsby-plugin-eslint: ^2.0.8 => 2.0.8
    gatsby-plugin-feed: ^2.5.14 => 2.5.14
    gatsby-plugin-google-analytics: ^2.3.17 => 2.3.17
    gatsby-plugin-google-tagmanager: ^2.3.15 => 2.3.15
    gatsby-plugin-manifest: ^2.4.34 => 2.4.34
    gatsby-plugin-netlify: ^2.3.17 => 2.3.17
    gatsby-plugin-nprogress: ^2.3.13 => 2.3.13
    gatsby-plugin-offline: ^3.2.31 => 3.2.31
    gatsby-plugin-react-helmet: ^3.3.14 => 3.3.14
    gatsby-plugin-robots-txt: ^1.5.3 => 1.5.3
    gatsby-plugin-sass: ^2.3.16 => 2.3.16
    gatsby-plugin-sharp: ^2.6.40 => 2.6.40
    gatsby-plugin-sitemap: ^2.4.15 => 2.4.15
    gatsby-plugin-smoothscroll: ^1.2.0 => 1.2.0
    gatsby-remark-embedder: ^3.0.0 => 3.0.0
    gatsby-remark-images: ^3.3.33 => 3.3.33
    gatsby-remark-images-contentful: ^2.3.19 => 2.3.19
    gatsby-remark-relative-images: ^2.0.2 => 2.0.2
    gatsby-source-contentful: ^2.3.51 => 2.3.51
    gatsby-source-filesystem: ^2.3.34 => 2.3.34
    gatsby-transformer-remark: ^2.8.38 => 2.8.38
    gatsby-transformer-sharp: ^2.5.17 => 2.5.17
  npmGlobalPackages:
    gatsby-cli: 2.12.101
``

标签: jsonxmlrssgatsbycontentful

解决方案



推荐阅读