Gatsby Source Contentful 4.x - 富文本 - 无法获取图像和超链接答案

【问题标题】：Gatsby Source Contentful 4.x - Rich Text - images and hyperlinks not fetchingGatsby Source Contentful 4.x - 富文本 - 无法获取图像和超链接
【发布时间】：2021-05-13 07:02:11
【问题描述】：

我有一个 gatsby 应用程序，我正在为此使用内容丰富的富文本。 contentful 最近对现在获取内容的方式进行了一些重大更改，我对如何从原始富文本文件中获取链接和图像感到很困惑。

以下是我目前拥有的代码，我通过它获取富文本。我看到了

标签和 s 以及所有内容，但是当我控制台记录返回到节点的嵌入式资产块和超链接时，什么都没有。

import React from 'react';
import { graphql, Link } from 'gatsby';
import Img from 'gatsby-image';
import { renderRichText } from 'gatsby-source-contentful/rich-text';

import { BLOCKS, MARKS, INLINES } from '@contentful/rich-text-types';

const Bold = ({ children }) => <span className="bold">{children}</span>;
const Text = ({ children }) => <p className="align-center">{children}</p>;

// Setting the rendering options. Same as:
// https://github.com/contentful/rich-text/tree/master/packages/rich-text-react-renderer
const options = {
    renderMark: {
        [MARKS.BOLD]: (text) => <Bold>{text}</Bold>
    },
    renderNode: {
        [INLINES.ENTRY_HYPERLINK]: ({ data }) => <Link to="/">{console.log(data)}</Link>,
        [BLOCKS.PARAGRAPH]: (node, children) => <Text>{children}</Text>,
        [BLOCKS.EMBEDDED_ASSET]: (node) => {
            console.log(node);
        }
    }
};
function privacy({ data }) {
    // console.log(data);

    const description = data.allContentfulBlogPost.nodes[0].bodyRichText;
    return <div>{description && renderRichText(description, options)}</div>;
}

export default privacy;
export const pageQuery = graphql`
    query MyQuery {
        allContentfulBlogPost {
            nodes {
                bodyRichText {
                    raw
                    references {
                        ... on ContentfulAsset {
                            # contentful_id is required to resolve the references
                            contentful_id
                            fluid(maxWidth: 600) {
                                ...GatsbyContentfulFluid_withWebp
                            }
                        }
                    }
                }
            }
        }
    }
`;

有人可以帮忙吗？

【问题讨论】：

标签： reactjs gatsby contentful

【解决方案1】：

好的，我找到了问题。我在引用中添加了以下内容，现在可以看到资产

 ... on ContentfulAsset {
          contentful_id
          __typename
          fixed(width: 1600) {
            width
            height
            src
            srcSet
          }
        }

【讨论】：

非常感谢。我找了好几个小时的答案...