Notion API で取得した BlockObject とそれを受け取った Component の Preview

- Contents -

H1 tag H2 tag H3 tag Bookmark : bookmark : bookmark : bookmark Lists リスト・数字1 数字1 Call outs 絵文字なしコールアウト Callout 電球 quoute 引用 Speatch Bubbles Callout Gear Callout Robot Callout Unicorn 埋め込み・SNS Image : image : embed : embed メンション Instagram URL : bookmark : embed 　　実はエラーになるが、本家Notionの埋め込みでもエラーとなる。　　おそらく提供されているembedコードに間違いがあると思われる。X, Twitter 　　　少し面倒だが、Xのドメイン : embed : embed : video URL埋め込みリンク : bookmark URL 文字リンク構造ブロック : column_list normal text Normal Var : divider 応用ブロックトグルおりたたみ表示トグル広げて記述 ToDo List ToDo List Checked ToDo List内での改行コード def hello_world(): print("Hello, World!")print("This is inLine code")数式 : equation テーブル : table : table 埋め込みファイル : file : audio : video : pdf テキスト赤色のテキスト const colorClasses = { gray: 'text-gray-500', brown: 'text-brown-500', orange: 'text-orange-500', yellow: 'text-yellow-500', green: 'text-green-500', blue: 'text-blue-500', purple: 'text-purple-500', pink: 'text-pink-500', red: 'text-red-500', default: 'text-black', gray_background: 'bg-gray-100', brown_background: 'bg-brown-100', orange_background: 'bg-orange-100', yellow_background: 'bg-yellow-100', green_background: 'bg-green-100', blue_background: 'bg-blue-100', purple_background: 'bg-purple-100', pink_background: 'bg-pink-100', red_background: 'bg-red-100', };非対応　 Facebook movie : image 　 X 新しいX.comドメインの埋め込みは非対応。こうなる👇️: embed 　面倒だが、XでコピーしたURLのドメインメンション NotionPageへのデータベース内へのメンションリンク日付のメンション: 人物のメンション:

H1 tag

H2 tag

H3 tag

Bookmark

Lists

リスト・

数字1

数字1

Call outs

📣

絵文字なしコールアウト

💡

Callout 電球

quoute 引用

Speatch Bubbles

Callout Gear

Callout Robot

Callout Unicorn

埋め込み・SNS

Image

対応したNotionブロック

JSON

{
  "object": "block",
  "id": "12083811-5c88-80f7-a56e-cf1fb486c224",
  "parent": {
    "type": "page_id",
    "page_id": "6a6174fe-389e-4801-8da8-f62d88672fde"
  },
  "created_time": "2024-10-15T06:33:00.000Z",
  "last_edited_time": "2024-10-21T06:27:00.000Z",
  "created_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "last_edited_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "has_children": false,
  "archived": false,
  "in_trash": false,
  "type": "image",
  "image": {
    "caption": [
      {
        "type": "text",
        "text": {
          "content": "対応したNotionブロック",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "対応したNotionブロック",
        "href": null
      }
    ],
    "type": "file",
    "file": {
      "url": "https://prod-files-secure.s3.us-west-2.amazonaws.com/33aab3b9-f114-454a-9e23-ed5a17aea264/3e1b1692-8319-4937-babe-2a847b92be79/image.png?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=ASIAZI2LB4663KBOB46S%2F20251022%2Fus-west-2%2Fs3%2Faws4_request&X-Amz-Date=20251022T072815Z&X-Amz-Expires=3600&X-Amz-Security-Token=IQoJb3JpZ2luX2VjEG8aCXVzLXdlc3QtMiJHMEUCIHzO4WHH%2Feo35RPsJNgZRSjkfMlbyeb%2F7SMNjXPOZSvHAiEAlZ4ooOO2fEEYUTP04tTvGzbU4NuSDcrPGmA68H5YQGAq%2FwMIKBAAGgw2Mzc0MjMxODM4MDUiDBi9Z47Q57doU%2Bc%2B3SrcA%2BFgDrkJOwD%2FlGN4uIzLsMllZKeExkDOoFXaMo4wO0bq8BrQN%2BIQWBDpv0I59VC1KZ8UYN9O%2FXzVOA%2FbsSnlDsI7tafKYH487oRGYAQv5IesudVFHUZFEYeAA6SxyeWIpxCzTwkN4EGrwiuMafoV7UPFQ8wiFu1Dn4O%2FT4Fw%2BExxd12Nk59lGwC1oq5NKLcCBr%2B0avWNCM3SJuzHpc6sky%2FrK7Y2hsS5YcwWpXWYuT24rlmCwTdnyOBPzP8R7dcXWF%2FqTfydrVOujHu%2BlVk6ZxjYyZnrpU4%2FqPu5OAC5YXZiU1vOq%2BOFauZKtXLzBZ34%2FWrRVxbwoMxwieX39zAYVS3sKsFWxw4F2uP3yFNwjidR%2Fa3Tg8ZV%2FSbo6MM1av7706gPIhmVzfisvK2yfx7k1YlODF%2Bz%2FIfc57N3cnxNhZSzRIzuzvQiVYgC6OxvRF2%2BH9kdAR%2B1h8cez2Zu1es9e769KSOlOuGTEXH7b4yfnow%2Bgi0I%2FixIMLlz4ZT13drQF6vxUNmYqTuce64AeqDIPNtpjXZwDiD%2B4ZZzyWMAlxoz3a%2BBWn9bDmOZjT3gCNKkT397VCl7WfDNIbGNipvsRMGQSH53ExjTao598fuJCYArfBZ%2Bo6LhV5tdiJH9MOWC4scGOqUBgG%2BvENTlxKZSFe46A6ioWwPs2NFnyHDIxq45im3oqz0UF%2B%2BNngwGgTzmDtnz3fTUb4GoJ%2Ba%2B6B0WgKo4QaAtXKOjgQRWo9GHQ%2F5P37qWha3u2iPnQBm1bSsQiwwxxbRENyMDXsDNI0eCbPnpCuXrwX%2FrnDJcn9rWMzskDGUgWkHyPGnZRYoLQZ0%2FBrkUrpH7M2pyJ%2F04EvXj9CIvTA8w2ewATQq%2B&X-Amz-Signature=51dc9389a0eba84f73dca7e498f65515326ea52a4453fe6d630b45bfe7eeb0d9&X-Amz-SignedHeaders=host&x-amz-checksum-mode=ENABLED&x-id=GetObject",
      "expiry_time": "2025-10-22T08:28:15.064Z"
    }
  }
}

View on Facebook

Faceboook

View this post on Instagram

Instagram

メンション https://www.instagram.com/p/C-5w4V0yAAQ/?utm_source=ig_web_copy_link&igsh=MzRlODBiNWFlZA==

JSON

{
  "object": "block",
  "id": "12083811-5c88-80f4-9b11-f27e20363897",
  "parent": {
    "type": "page_id",
    "page_id": "6a6174fe-389e-4801-8da8-f62d88672fde"
  },
  "created_time": "2024-10-15T08:21:00.000Z",
  "last_edited_time": "2024-10-15T08:21:00.000Z",
  "created_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "last_edited_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "has_children": false,
  "archived": false,
  "in_trash": false,
  "type": "paragraph",
  "paragraph": {
    "rich_text": [
      {
        "type": "text",
        "text": {
          "content": "メンション ",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "メンション ",
        "href": null
      },
      {
        "type": "mention",
        "mention": {
          "type": "link_mention",
          "link_mention": {
            "href": "https://www.instagram.com/p/C-5w4V0yAAQ/?utm_source=ig_web_copy_link&igsh=MzRlODBiNWFlZA==",
            "title": "Notion on Instagram: \"Make with Notion, Notion’s first ever in-person conference, is happening on Thursday, October 24, at Pier 27 in San Francisco! 🔷 makewithnotion.com | #makewithnotion  For a limited time, secure your spot for 10% off with code [MWN10] → Or register to join us virtually for free, from anywhere in the world.\"",
            "padding": 63,
            "icon_url": "https://static.cdninstagram.com/rsrc.php/v3/yI/r/VsNE-OHk_8a.png",
            "iframe_url": "https://embed.notion.co/api/iframe?app=1&theme=light&url=https%3A%2F%2Fwww.instagram.com%2Fp%2FC-5w4V0yAAQ%2F%3Futm_source%3Dig_web_copy_link%26igsh%3DMzRlODBiNWFlZA%3D%3D&key=656ac74fac4fff346b811dca7919d483",
            "description": "1,555 likes, 19 comments - notionhq on August 20, 2024: \"Make with Notion, Notion’s first ever in-person conference, is happening on Thursday, October 24, at Pier 27 in San Francisco! 🔷 makewithnotion.com | #makewithnotion  For a limited time, secure your spot for 10% off with code [MWN10] → Or register to join us virtually for free, from anywhere in the world.\".",
            "link_author": "notionhq",
            "padding_top": 284,
            "link_provider": "Instagram",
            "thumbnail_url": "https://scontent.cdninstagram.com/v/t51.29350-15/456433390_1819671668522354_8392520064032113881_n.jpg?stp=dst-jpg_e15_s480x480&_nc_ht=scontent.cdninstagram.com&_nc_cat=102&_nc_ohc=bQyCSDfptVoQ7kNvgE5MAGt&_nc_gid=9b2f5e41daf4436595dc715a97fa33fc&edm=AMO9-JQAAAAA&ccb=7-5&oh=00_AYDm5ptexVSELEBYGtj1ZJTF_7YAp1uPT5Z4oRhc2L885A&oe=6713EB8C&_nc_sid=cc8940"
          }
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "https://www.instagram.com/p/C-5w4V0yAAQ/?utm_source=ig_web_copy_link&igsh=MzRlODBiNWFlZA==",
        "href": "https://www.instagram.com/p/C-5w4V0yAAQ/?utm_source=ig_web_copy_link&igsh=MzRlODBiNWFlZA=="
      }
    ],
    "color": "default"
  }
}

TikTok

　　実はエラーになるが、本家Notionの埋め込みでもエラーとなる。

　　おそらく提供されているembedコードに間違いがあると思われる。

X, Twitter

　　　少し面倒だが、Xのドメイン x.com を旧 twitter.com に変更すれば埋め込める。

JSON

{
  "object": "block",
  "id": "12083811-5c88-80a7-97b2-cca01a58b614",
  "parent": {
    "type": "page_id",
    "page_id": "6a6174fe-389e-4801-8da8-f62d88672fde"
  },
  "created_time": "2024-10-15T23:52:00.000Z",
  "last_edited_time": "2024-10-20T13:40:00.000Z",
  "created_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "last_edited_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "has_children": false,
  "archived": false,
  "in_trash": false,
  "type": "paragraph",
  "paragraph": {
    "rich_text": [
      {
        "type": "text",
        "text": {
          "content": "　　　少し面倒だが、Xのドメイン ",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "　　　少し面倒だが、Xのドメイン ",
        "href": null
      },
      {
        "type": "text",
        "text": {
          "content": "x.com",
          "link": {
            "url": "http://x.com/"
          }
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "x.com",
        "href": "http://x.com/"
      },
      {
        "type": "text",
        "text": {
          "content": " を 旧 ",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": " を 旧 ",
        "href": null
      },
      {
        "type": "text",
        "text": {
          "content": "twitter.com",
          "link": {
            "url": "http://twitter.com/"
          }
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "twitter.com",
        "href": "http://twitter.com/"
      },
      {
        "type": "text",
        "text": {
          "content": " に変更すれば埋め込める。",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": " に変更すれば埋め込める。",
        "href": null
      }
    ],
    "color": "default"
  }
}

View on X

X

View on X

X Movie

Youtube

URL埋め込みリンク

URL 文字リンク Notion URL

構造ブロック

normal text

Normal Var

応用ブロック

トグルおりたたみ表示

トグル広げて記述

ToDo List

ToDo List Checked

ToDo List内での改行

コード

python

def hello_world():
    print("Hello, World!")

code block

print("This is inLine code")

数式

E = mc^2

テーブル

埋め込みファイル

File

JSON

{
  "object": "block",
  "id": "12083811-5c88-80bc-bc13-cac919ada0a7",
  "parent": {
    "type": "page_id",
    "page_id": "6a6174fe-389e-4801-8da8-f62d88672fde"
  },
  "created_time": "2024-10-15T06:35:00.000Z",
  "last_edited_time": "2024-10-22T00:26:00.000Z",
  "created_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "last_edited_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "has_children": false,
  "archived": false,
  "in_trash": false,
  "type": "file",
  "file": {
    "caption": [
      {
        "type": "text",
        "text": {
          "content": "File",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "File",
        "href": null
      }
    ],
    "type": "file",
    "file": {
      "url": "https://prod-files-secure.s3.us-west-2.amazonaws.com/33aab3b9-f114-454a-9e23-ed5a17aea264/66d873cc-34e6-41ba-8883-74c418a53627/FIle.txt?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=ASIAZI2LB4663KBOB46S%2F20251022%2Fus-west-2%2Fs3%2Faws4_request&X-Amz-Date=20251022T072815Z&X-Amz-Expires=3600&X-Amz-Security-Token=IQoJb3JpZ2luX2VjEG8aCXVzLXdlc3QtMiJHMEUCIHzO4WHH%2Feo35RPsJNgZRSjkfMlbyeb%2F7SMNjXPOZSvHAiEAlZ4ooOO2fEEYUTP04tTvGzbU4NuSDcrPGmA68H5YQGAq%2FwMIKBAAGgw2Mzc0MjMxODM4MDUiDBi9Z47Q57doU%2Bc%2B3SrcA%2BFgDrkJOwD%2FlGN4uIzLsMllZKeExkDOoFXaMo4wO0bq8BrQN%2BIQWBDpv0I59VC1KZ8UYN9O%2FXzVOA%2FbsSnlDsI7tafKYH487oRGYAQv5IesudVFHUZFEYeAA6SxyeWIpxCzTwkN4EGrwiuMafoV7UPFQ8wiFu1Dn4O%2FT4Fw%2BExxd12Nk59lGwC1oq5NKLcCBr%2B0avWNCM3SJuzHpc6sky%2FrK7Y2hsS5YcwWpXWYuT24rlmCwTdnyOBPzP8R7dcXWF%2FqTfydrVOujHu%2BlVk6ZxjYyZnrpU4%2FqPu5OAC5YXZiU1vOq%2BOFauZKtXLzBZ34%2FWrRVxbwoMxwieX39zAYVS3sKsFWxw4F2uP3yFNwjidR%2Fa3Tg8ZV%2FSbo6MM1av7706gPIhmVzfisvK2yfx7k1YlODF%2Bz%2FIfc57N3cnxNhZSzRIzuzvQiVYgC6OxvRF2%2BH9kdAR%2B1h8cez2Zu1es9e769KSOlOuGTEXH7b4yfnow%2Bgi0I%2FixIMLlz4ZT13drQF6vxUNmYqTuce64AeqDIPNtpjXZwDiD%2B4ZZzyWMAlxoz3a%2BBWn9bDmOZjT3gCNKkT397VCl7WfDNIbGNipvsRMGQSH53ExjTao598fuJCYArfBZ%2Bo6LhV5tdiJH9MOWC4scGOqUBgG%2BvENTlxKZSFe46A6ioWwPs2NFnyHDIxq45im3oqz0UF%2B%2BNngwGgTzmDtnz3fTUb4GoJ%2Ba%2B6B0WgKo4QaAtXKOjgQRWo9GHQ%2F5P37qWha3u2iPnQBm1bSsQiwwxxbRENyMDXsDNI0eCbPnpCuXrwX%2FrnDJcn9rWMzskDGUgWkHyPGnZRYoLQZ0%2FBrkUrpH7M2pyJ%2F04EvXj9CIvTA8w2ewATQq%2B&X-Amz-Signature=3c04627e70ae685af2a7f7550dcb6c12e04f9b892d89f6561c0cfdfa83144bbb&X-Amz-SignedHeaders=host&x-amz-checksum-mode=ENABLED&x-id=GetObject",
      "expiry_time": "2025-10-22T08:28:15.429Z"
    },
    "name": "FIle.txt"
  }
}

Loading audio...

Audio

JSON

{
  "object": "block",
  "id": "12083811-5c88-8085-a8b5-c3c2e1e26ec8",
  "parent": {
    "type": "page_id",
    "page_id": "6a6174fe-389e-4801-8da8-f62d88672fde"
  },
  "created_time": "2024-10-15T06:54:00.000Z",
  "last_edited_time": "2024-10-22T00:26:00.000Z",
  "created_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "last_edited_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "has_children": false,
  "archived": false,
  "in_trash": false,
  "type": "audio",
  "audio": {
    "caption": [
      {
        "type": "text",
        "text": {
          "content": "Audio",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "Audio",
        "href": null
      }
    ],
    "type": "file",
    "file": {
      "url": "https://prod-files-secure.s3.us-west-2.amazonaws.com/33aab3b9-f114-454a-9e23-ed5a17aea264/8216dbd6-1cb4-457e-b8b8-d7a1b9939d4b/Audio.mp3?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=ASIAZI2LB4663KBOB46S%2F20251022%2Fus-west-2%2Fs3%2Faws4_request&X-Amz-Date=20251022T072815Z&X-Amz-Expires=3600&X-Amz-Security-Token=IQoJb3JpZ2luX2VjEG8aCXVzLXdlc3QtMiJHMEUCIHzO4WHH%2Feo35RPsJNgZRSjkfMlbyeb%2F7SMNjXPOZSvHAiEAlZ4ooOO2fEEYUTP04tTvGzbU4NuSDcrPGmA68H5YQGAq%2FwMIKBAAGgw2Mzc0MjMxODM4MDUiDBi9Z47Q57doU%2Bc%2B3SrcA%2BFgDrkJOwD%2FlGN4uIzLsMllZKeExkDOoFXaMo4wO0bq8BrQN%2BIQWBDpv0I59VC1KZ8UYN9O%2FXzVOA%2FbsSnlDsI7tafKYH487oRGYAQv5IesudVFHUZFEYeAA6SxyeWIpxCzTwkN4EGrwiuMafoV7UPFQ8wiFu1Dn4O%2FT4Fw%2BExxd12Nk59lGwC1oq5NKLcCBr%2B0avWNCM3SJuzHpc6sky%2FrK7Y2hsS5YcwWpXWYuT24rlmCwTdnyOBPzP8R7dcXWF%2FqTfydrVOujHu%2BlVk6ZxjYyZnrpU4%2FqPu5OAC5YXZiU1vOq%2BOFauZKtXLzBZ34%2FWrRVxbwoMxwieX39zAYVS3sKsFWxw4F2uP3yFNwjidR%2Fa3Tg8ZV%2FSbo6MM1av7706gPIhmVzfisvK2yfx7k1YlODF%2Bz%2FIfc57N3cnxNhZSzRIzuzvQiVYgC6OxvRF2%2BH9kdAR%2B1h8cez2Zu1es9e769KSOlOuGTEXH7b4yfnow%2Bgi0I%2FixIMLlz4ZT13drQF6vxUNmYqTuce64AeqDIPNtpjXZwDiD%2B4ZZzyWMAlxoz3a%2BBWn9bDmOZjT3gCNKkT397VCl7WfDNIbGNipvsRMGQSH53ExjTao598fuJCYArfBZ%2Bo6LhV5tdiJH9MOWC4scGOqUBgG%2BvENTlxKZSFe46A6ioWwPs2NFnyHDIxq45im3oqz0UF%2B%2BNngwGgTzmDtnz3fTUb4GoJ%2Ba%2B6B0WgKo4QaAtXKOjgQRWo9GHQ%2F5P37qWha3u2iPnQBm1bSsQiwwxxbRENyMDXsDNI0eCbPnpCuXrwX%2FrnDJcn9rWMzskDGUgWkHyPGnZRYoLQZ0%2FBrkUrpH7M2pyJ%2F04EvXj9CIvTA8w2ewATQq%2B&X-Amz-Signature=363d9af5dcf7b59d6e49a16c9bc043c368be54ae2689d1912c127e6fbbb72dfa&X-Amz-SignedHeaders=host&x-amz-checksum-mode=ENABLED&x-id=GetObject",
      "expiry_time": "2025-10-22T08:28:15.485Z"
    }
  }
}

Loading video...

Movie

JSON

{
  "object": "block",
  "id": "12083811-5c88-80c0-a0b7-d038e51dab41",
  "parent": {
    "type": "page_id",
    "page_id": "6a6174fe-389e-4801-8da8-f62d88672fde"
  },
  "created_time": "2024-10-15T06:38:00.000Z",
  "last_edited_time": "2024-10-21T14:39:00.000Z",
  "created_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "last_edited_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "has_children": false,
  "archived": false,
  "in_trash": false,
  "type": "video",
  "video": {
    "caption": [
      {
        "type": "text",
        "text": {
          "content": "Movie",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "Movie",
        "href": null
      }
    ],
    "type": "file",
    "file": {
      "url": "https://prod-files-secure.s3.us-west-2.amazonaws.com/33aab3b9-f114-454a-9e23-ed5a17aea264/8b1ce6be-83a2-4e01-a048-fa5471d5a2d7/Video.mp4?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=ASIAZI2LB4663KBOB46S%2F20251022%2Fus-west-2%2Fs3%2Faws4_request&X-Amz-Date=20251022T072815Z&X-Amz-Expires=3600&X-Amz-Security-Token=IQoJb3JpZ2luX2VjEG8aCXVzLXdlc3QtMiJHMEUCIHzO4WHH%2Feo35RPsJNgZRSjkfMlbyeb%2F7SMNjXPOZSvHAiEAlZ4ooOO2fEEYUTP04tTvGzbU4NuSDcrPGmA68H5YQGAq%2FwMIKBAAGgw2Mzc0MjMxODM4MDUiDBi9Z47Q57doU%2Bc%2B3SrcA%2BFgDrkJOwD%2FlGN4uIzLsMllZKeExkDOoFXaMo4wO0bq8BrQN%2BIQWBDpv0I59VC1KZ8UYN9O%2FXzVOA%2FbsSnlDsI7tafKYH487oRGYAQv5IesudVFHUZFEYeAA6SxyeWIpxCzTwkN4EGrwiuMafoV7UPFQ8wiFu1Dn4O%2FT4Fw%2BExxd12Nk59lGwC1oq5NKLcCBr%2B0avWNCM3SJuzHpc6sky%2FrK7Y2hsS5YcwWpXWYuT24rlmCwTdnyOBPzP8R7dcXWF%2FqTfydrVOujHu%2BlVk6ZxjYyZnrpU4%2FqPu5OAC5YXZiU1vOq%2BOFauZKtXLzBZ34%2FWrRVxbwoMxwieX39zAYVS3sKsFWxw4F2uP3yFNwjidR%2Fa3Tg8ZV%2FSbo6MM1av7706gPIhmVzfisvK2yfx7k1YlODF%2Bz%2FIfc57N3cnxNhZSzRIzuzvQiVYgC6OxvRF2%2BH9kdAR%2B1h8cez2Zu1es9e769KSOlOuGTEXH7b4yfnow%2Bgi0I%2FixIMLlz4ZT13drQF6vxUNmYqTuce64AeqDIPNtpjXZwDiD%2B4ZZzyWMAlxoz3a%2BBWn9bDmOZjT3gCNKkT397VCl7WfDNIbGNipvsRMGQSH53ExjTao598fuJCYArfBZ%2Bo6LhV5tdiJH9MOWC4scGOqUBgG%2BvENTlxKZSFe46A6ioWwPs2NFnyHDIxq45im3oqz0UF%2B%2BNngwGgTzmDtnz3fTUb4GoJ%2Ba%2B6B0WgKo4QaAtXKOjgQRWo9GHQ%2F5P37qWha3u2iPnQBm1bSsQiwwxxbRENyMDXsDNI0eCbPnpCuXrwX%2FrnDJcn9rWMzskDGUgWkHyPGnZRYoLQZ0%2FBrkUrpH7M2pyJ%2F04EvXj9CIvTA8w2ewATQq%2B&X-Amz-Signature=a2f43451bb0714476970583e74e344a1266a2d4b0509ede81bd5cd101ad3aec2&X-Amz-SignedHeaders=host&x-amz-checksum-mode=ENABLED&x-id=GetObject",
      "expiry_time": "2025-10-22T08:28:15.493Z"
    }
  }
}

Loading PDF...

PDF

JSON

{
  "object": "block",
  "id": "12083811-5c88-80a9-ae27-c4e6eaa23ae3",
  "parent": {
    "type": "page_id",
    "page_id": "6a6174fe-389e-4801-8da8-f62d88672fde"
  },
  "created_time": "2024-10-15T07:49:00.000Z",
  "last_edited_time": "2024-10-23T07:35:00.000Z",
  "created_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "last_edited_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "has_children": false,
  "archived": false,
  "in_trash": false,
  "type": "pdf",
  "pdf": {
    "caption": [
      {
        "type": "text",
        "text": {
          "content": "PDF",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "PDF",
        "href": null
      }
    ],
    "type": "file",
    "file": {
      "url": "https://prod-files-secure.s3.us-west-2.amazonaws.com/33aab3b9-f114-454a-9e23-ed5a17aea264/63bf1eeb-cc84-401a-9179-da3929d06694/pdf.pdf?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=ASIAZI2LB4663KBOB46S%2F20251022%2Fus-west-2%2Fs3%2Faws4_request&X-Amz-Date=20251022T072815Z&X-Amz-Expires=3600&X-Amz-Security-Token=IQoJb3JpZ2luX2VjEG8aCXVzLXdlc3QtMiJHMEUCIHzO4WHH%2Feo35RPsJNgZRSjkfMlbyeb%2F7SMNjXPOZSvHAiEAlZ4ooOO2fEEYUTP04tTvGzbU4NuSDcrPGmA68H5YQGAq%2FwMIKBAAGgw2Mzc0MjMxODM4MDUiDBi9Z47Q57doU%2Bc%2B3SrcA%2BFgDrkJOwD%2FlGN4uIzLsMllZKeExkDOoFXaMo4wO0bq8BrQN%2BIQWBDpv0I59VC1KZ8UYN9O%2FXzVOA%2FbsSnlDsI7tafKYH487oRGYAQv5IesudVFHUZFEYeAA6SxyeWIpxCzTwkN4EGrwiuMafoV7UPFQ8wiFu1Dn4O%2FT4Fw%2BExxd12Nk59lGwC1oq5NKLcCBr%2B0avWNCM3SJuzHpc6sky%2FrK7Y2hsS5YcwWpXWYuT24rlmCwTdnyOBPzP8R7dcXWF%2FqTfydrVOujHu%2BlVk6ZxjYyZnrpU4%2FqPu5OAC5YXZiU1vOq%2BOFauZKtXLzBZ34%2FWrRVxbwoMxwieX39zAYVS3sKsFWxw4F2uP3yFNwjidR%2Fa3Tg8ZV%2FSbo6MM1av7706gPIhmVzfisvK2yfx7k1YlODF%2Bz%2FIfc57N3cnxNhZSzRIzuzvQiVYgC6OxvRF2%2BH9kdAR%2B1h8cez2Zu1es9e769KSOlOuGTEXH7b4yfnow%2Bgi0I%2FixIMLlz4ZT13drQF6vxUNmYqTuce64AeqDIPNtpjXZwDiD%2B4ZZzyWMAlxoz3a%2BBWn9bDmOZjT3gCNKkT397VCl7WfDNIbGNipvsRMGQSH53ExjTao598fuJCYArfBZ%2Bo6LhV5tdiJH9MOWC4scGOqUBgG%2BvENTlxKZSFe46A6ioWwPs2NFnyHDIxq45im3oqz0UF%2B%2BNngwGgTzmDtnz3fTUb4GoJ%2Ba%2B6B0WgKo4QaAtXKOjgQRWo9GHQ%2F5P37qWha3u2iPnQBm1bSsQiwwxxbRENyMDXsDNI0eCbPnpCuXrwX%2FrnDJcn9rWMzskDGUgWkHyPGnZRYoLQZ0%2FBrkUrpH7M2pyJ%2F04EvXj9CIvTA8w2ewATQq%2B&X-Amz-Signature=e3811c4f951d8434d6cc530b1210408b8efe8c563387f20181e21f477984599e&X-Amz-SignedHeaders=host&x-amz-checksum-mode=ENABLED&x-id=GetObject",
      "expiry_time": "2025-10-22T08:28:15.429Z"
    }
  }
}

テキスト

赤色のテキスト黄色の背景青色の背景

JSON

{
  "object": "block",
  "id": "12183811-5c88-804e-890e-fffbbe0ca406",
  "parent": {
    "type": "page_id",
    "page_id": "6a6174fe-389e-4801-8da8-f62d88672fde"
  },
  "created_time": "2024-10-16T03:30:00.000Z",
  "last_edited_time": "2024-10-24T06:57:00.000Z",
  "created_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "last_edited_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "has_children": false,
  "archived": false,
  "in_trash": false,
  "type": "paragraph",
  "paragraph": {
    "rich_text": [
      {
        "type": "text",
        "text": {
          "content": "赤色のテキスト  ",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "red"
        },
        "plain_text": "赤色のテキスト  ",
        "href": null
      },
      {
        "type": "text",
        "text": {
          "content": "黄色の背景",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "yellow_background"
        },
        "plain_text": "黄色の背景",
        "href": null
      },
      {
        "type": "text",
        "text": {
          "content": " ",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "red"
        },
        "plain_text": " ",
        "href": null
      },
      {
        "type": "text",
        "text": {
          "content": "青色の背景",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "blue_background"
        },
        "plain_text": "青色の背景",
        "href": null
      }
    ],
    "color": "default"
  }
}

javascript

const colorClasses = {
  gray: 'text-gray-500',
  brown: 'text-brown-500',
  orange: 'text-orange-500',
  yellow: 'text-yellow-500',
  green: 'text-green-500',
  blue: 'text-blue-500',
  purple: 'text-purple-500',
  pink: 'text-pink-500',
  red: 'text-red-500',
  default: 'text-black',
  gray_background: 'bg-gray-100',
  brown_background: 'bg-brown-100',
  orange_background: 'bg-orange-100',
  yellow_background: 'bg-yellow-100',
  green_background: 'bg-green-100',
  blue_background: 'bg-blue-100',
  purple_background: 'bg-purple-100',
  pink_background: 'bg-pink-100',
  red_background: 'bg-red-100',
};

src\components\notion\RichText.tsx

JSON

{
  "object": "block",
  "id": "12983811-5c88-804e-b722-ef5d7c9b69b0",
  "parent": {
    "type": "page_id",
    "page_id": "6a6174fe-389e-4801-8da8-f62d88672fde"
  },
  "created_time": "2024-10-24T06:56:00.000Z",
  "last_edited_time": "2024-10-24T06:57:00.000Z",
  "created_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "last_edited_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "has_children": false,
  "archived": false,
  "in_trash": false,
  "type": "code",
  "code": {
    "caption": [
      {
        "type": "text",
        "text": {
          "content": "src\\components\\notion\\RichText.tsx",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "src\\components\\notion\\RichText.tsx",
        "href": null
      }
    ],
    "rich_text": [
      {
        "type": "text",
        "text": {
          "content": "const colorClasses = {\n  gray: 'text-gray-500',\n  brown: 'text-brown-500',\n  orange: 'text-orange-500',\n  yellow: 'text-yellow-500',\n  green: 'text-green-500',\n  blue: 'text-blue-500',\n  purple: 'text-purple-500',\n  pink: 'text-pink-500',\n  red: 'text-red-500',\n  default: 'text-black',\n  gray_background: 'bg-gray-100',\n  brown_background: 'bg-brown-100',\n  orange_background: 'bg-orange-100',\n  yellow_background: 'bg-yellow-100',\n  green_background: 'bg-green-100',\n  blue_background: 'bg-blue-100',\n  purple_background: 'bg-purple-100',\n  pink_background: 'bg-pink-100',\n  red_background: 'bg-red-100',\n};",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "const colorClasses = {\n  gray: 'text-gray-500',\n  brown: 'text-brown-500',\n  orange: 'text-orange-500',\n  yellow: 'text-yellow-500',\n  green: 'text-green-500',\n  blue: 'text-blue-500',\n  purple: 'text-purple-500',\n  pink: 'text-pink-500',\n  red: 'text-red-500',\n  default: 'text-black',\n  gray_background: 'bg-gray-100',\n  brown_background: 'bg-brown-100',\n  orange_background: 'bg-orange-100',\n  yellow_background: 'bg-yellow-100',\n  green_background: 'bg-green-100',\n  blue_background: 'bg-blue-100',\n  purple_background: 'bg-purple-100',\n  pink_background: 'bg-pink-100',\n  red_background: 'bg-red-100',\n};",
        "href": null
      }
    ],
    "language": "javascript"
  }
}

非対応

　 Facebook movie

facebookの動画も埋め込めるが、狭すぎる画面(スマホ)だと画面からはみ出てしまう。非推奨,。

JSON

{
  "object": "block",
  "id": "12683811-5c88-8077-913a-d05e6c79cad1",
  "parent": {
    "type": "page_id",
    "page_id": "6a6174fe-389e-4801-8da8-f62d88672fde"
  },
  "created_time": "2024-10-21T08:05:00.000Z",
  "last_edited_time": "2024-10-21T08:06:00.000Z",
  "created_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "last_edited_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "has_children": false,
  "archived": false,
  "in_trash": false,
  "type": "image",
  "image": {
    "caption": [
      {
        "type": "text",
        "text": {
          "content": "facebookの動画も埋め込めるが、狭すぎる画面(スマホ)だと画面からはみ出てしまう。非推奨,。",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "facebookの動画も埋め込めるが、狭すぎる画面(スマホ)だと画面からはみ出てしまう。非推奨,。",
        "href": null
      }
    ],
    "type": "file",
    "file": {
      "url": "https://prod-files-secure.s3.us-west-2.amazonaws.com/33aab3b9-f114-454a-9e23-ed5a17aea264/7bd0a4eb-0b19-4c11-8862-ab6154b5769b/image.png?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=ASIAZI2LB4663KBOB46S%2F20251022%2Fus-west-2%2Fs3%2Faws4_request&X-Amz-Date=20251022T072815Z&X-Amz-Expires=3600&X-Amz-Security-Token=IQoJb3JpZ2luX2VjEG8aCXVzLXdlc3QtMiJHMEUCIHzO4WHH%2Feo35RPsJNgZRSjkfMlbyeb%2F7SMNjXPOZSvHAiEAlZ4ooOO2fEEYUTP04tTvGzbU4NuSDcrPGmA68H5YQGAq%2FwMIKBAAGgw2Mzc0MjMxODM4MDUiDBi9Z47Q57doU%2Bc%2B3SrcA%2BFgDrkJOwD%2FlGN4uIzLsMllZKeExkDOoFXaMo4wO0bq8BrQN%2BIQWBDpv0I59VC1KZ8UYN9O%2FXzVOA%2FbsSnlDsI7tafKYH487oRGYAQv5IesudVFHUZFEYeAA6SxyeWIpxCzTwkN4EGrwiuMafoV7UPFQ8wiFu1Dn4O%2FT4Fw%2BExxd12Nk59lGwC1oq5NKLcCBr%2B0avWNCM3SJuzHpc6sky%2FrK7Y2hsS5YcwWpXWYuT24rlmCwTdnyOBPzP8R7dcXWF%2FqTfydrVOujHu%2BlVk6ZxjYyZnrpU4%2FqPu5OAC5YXZiU1vOq%2BOFauZKtXLzBZ34%2FWrRVxbwoMxwieX39zAYVS3sKsFWxw4F2uP3yFNwjidR%2Fa3Tg8ZV%2FSbo6MM1av7706gPIhmVzfisvK2yfx7k1YlODF%2Bz%2FIfc57N3cnxNhZSzRIzuzvQiVYgC6OxvRF2%2BH9kdAR%2B1h8cez2Zu1es9e769KSOlOuGTEXH7b4yfnow%2Bgi0I%2FixIMLlz4ZT13drQF6vxUNmYqTuce64AeqDIPNtpjXZwDiD%2B4ZZzyWMAlxoz3a%2BBWn9bDmOZjT3gCNKkT397VCl7WfDNIbGNipvsRMGQSH53ExjTao598fuJCYArfBZ%2Bo6LhV5tdiJH9MOWC4scGOqUBgG%2BvENTlxKZSFe46A6ioWwPs2NFnyHDIxq45im3oqz0UF%2B%2BNngwGgTzmDtnz3fTUb4GoJ%2Ba%2B6B0WgKo4QaAtXKOjgQRWo9GHQ%2F5P37qWha3u2iPnQBm1bSsQiwwxxbRENyMDXsDNI0eCbPnpCuXrwX%2FrnDJcn9rWMzskDGUgWkHyPGnZRYoLQZ0%2FBrkUrpH7M2pyJ%2F04EvXj9CIvTA8w2ewATQq%2B&X-Amz-Signature=150f0d17db70148710a0ae55c6d1dee97f0af4199e38bdce6efa7d2bb410c739&X-Amz-SignedHeaders=host&x-amz-checksum-mode=ENABLED&x-id=GetObject",
      "expiry_time": "2025-10-22T08:28:15.373Z"
    }
  }
}

　 X 新しいX.comドメインの埋め込みは非対応。こうなる👇️

View on X

x.comの新しいドメインだと読み込めない。

　面倒だが、XでコピーしたURLのドメイン x.com を twitter.com に変更すれば埋め込める。

JSON

{
  "object": "block",
  "id": "12583811-5c88-8031-b0d4-e05720e628b7",
  "parent": {
    "type": "page_id",
    "page_id": "6a6174fe-389e-4801-8da8-f62d88672fde"
  },
  "created_time": "2024-10-20T13:38:00.000Z",
  "last_edited_time": "2024-10-24T06:57:00.000Z",
  "created_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "last_edited_by": {
    "object": "user",
    "id": "c04915d3-b13f-4c06-a6d4-b210d7d0bd30"
  },
  "has_children": true,
  "archived": false,
  "in_trash": false,
  "type": "paragraph",
  "paragraph": {
    "rich_text": [
      {
        "type": "text",
        "text": {
          "content": "　  面倒だが、XでコピーしたURLのドメイン ",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "　  面倒だが、XでコピーしたURLのドメイン ",
        "href": null
      },
      {
        "type": "text",
        "text": {
          "content": "x.com",
          "link": {
            "url": "http://x.com/"
          }
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "x.com",
        "href": "http://x.com/"
      },
      {
        "type": "text",
        "text": {
          "content": " を ",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": " を ",
        "href": null
      },
      {
        "type": "text",
        "text": {
          "content": "twitter.com",
          "link": {
            "url": "http://twitter.com/"
          }
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": "twitter.com",
        "href": "http://twitter.com/"
      },
      {
        "type": "text",
        "text": {
          "content": " に変更すれば埋め込める。",
          "link": null
        },
        "annotations": {
          "bold": false,
          "italic": false,
          "strikethrough": false,
          "underline": false,
          "code": false,
          "color": "default"
        },
        "plain_text": " に変更すれば埋め込める。",
        "href": null
      }
    ],
    "color": "default"
  }
}

メンション

NotionPageへのデータベース内へのメンションリンク

日付のメンション: 2024-10-05

人物のメンション: @Anonymous