显示外壳 Notion API 和 Next.js

Question

由于这项出色的工作，我正在使用 Notion API、Next.js 和 Tailwind 创建我的投资组合：https://github.com/samuelkraft/notion-blog-nextjs

但是，您可能知道，托管在 Notion 上的图像有过期时间。我试着用 <img src={blog.cover.file.url}/> 但如果我从外部 link 在我的概念页面上上传封面，我的所有代码都会中断。我查看了这个文档：https://developers.notion.com/changelog/page-icons-cover-images-new-block-types-and-improved-page-file-properties 但我不知道如何提及它是外部 link.

你知道我该如何解决这个问题吗？

非常感谢

Answer 1

您需要使用 src={cover.external.url} 文档中提到的 https://developers.notion.com/changelog/page-icons-cover-images-new-block-types-and-improved-page-file-properties。

{
    "object": "database",
    "id": "96433ad8-3fbe-460f-a007-72311c4aa804",
    "cover": {
        "type": "external",
        "external": {
            "url": "https://website.domain/images/image.png"
        }
    },
    "icon": {
        "type": "emoji",
        "emoji": ""
    },
    // ... remaining properties
}

显示外壳 Notion API 和 Next.js

Display external cover Notion API with Next.js

next.js

notion-api