🌐
「この動き、APIではどのリクエストを使えば良いんだ？」というときの確認方法
「この動き、APIではどのリクエストを使えば良いんだ？」というとき、ブラウザのデベロッパーツールにあるNetworkタグが有効です。
ちょうどZennには公式なAPIに関するドキュメントが無いようなので、「Zennでユーザの記事一覧を取得したい場合」を例に手順を示します。
Chromeの画面を例にしますが、基本的に他のブラウザでも似たような方法で確認できると思います。
-
F12を押してデベロッパーツールを立ち上げ、Networkタブを開きます
-
Fetch/XHRをクリックします
-
記事一覧を取得したいユーザページを開きます
※自身のページを見たい場合は右上のユーザ名を選択 -
実行結果のログが表示されます
-
NameをクリックすることでAPIの内容を確認します
Headersではどのようなリクエストがなされたかの情報を確認できます。
Responseでは、返却されたデータを確認できます。
レスポンス全文（2024/6/15時点）
{
"articles": [
{
"id": 268141,
"post_type": "Article",
"title": "【超初心者向け】これだけは知っとけPostman",
"slug": "c0d713e2bfd3cc",
"comments_count": 0,
"liked_count": 2,
"body_letters_count": 4000,
"article_type": "tech",
"emoji": "📮",
"is_suspending_private": false,
"published_at": "2024-05-02T10:13:40.207+09:00",
"body_updated_at": "2024-05-02T10:12:18.448+09:00",
"source_repo_updated_at": null,
"pinned": false,
"path": "/rokota/articles/c0d713e2bfd3cc",
"user": {
"id": 156715,
"username": "rokota",
"name": "ころたろ",
"avatar_small_url": "https://res.cloudinary.com/zenn/image/fetch/s--KcUIUcEb--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_70/https://storage.googleapis.com/zenn-user-upload/avatar/d4210a0096.jpeg"
},
"publication": null
},
{
"id": 263108,
"post_type": "Article",
"title": "【Windows】コマンドプロンプト【意外と使える】",
"slug": "ab3efa74026217",
"comments_count": 0,
"liked_count": 0,
"body_letters_count": 2508,
"article_type": "tech",
"emoji": "🧑💻",
"is_suspending_private": false,
"published_at": "2024-04-23T09:00:00.674+09:00",
"body_updated_at": "2024-04-23T08:56:12.941+09:00",
"source_repo_updated_at": null,
"pinned": false,
"path": "/rokota/articles/ab3efa74026217",
"user": {
"id": 156715,
"username": "rokota",
"name": "ころたろ",
"avatar_small_url": "https://res.cloudinary.com/zenn/image/fetch/s--KcUIUcEb--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_70/https://storage.googleapis.com/zenn-user-upload/avatar/d4210a0096.jpeg"
},
"publication": null
},
{
"id": 256702,
"post_type": "Article",
"title": "案件ジョイン時「とりあえず資料読んどいて」と言われたときの進め方を考える",
"slug": "ccd1aed917d478",
"comments_count": 2,
"liked_count": 1,
"body_letters_count": 3123,
"article_type": "idea",
"emoji": "📚",
"is_suspending_private": false,
"published_at": "2024-04-13T10:00:00.397+09:00",
"body_updated_at": "2024-05-26T13:29:01.065+09:00",
"source_repo_updated_at": null,
"pinned": false,
"path": "/rokota/articles/ccd1aed917d478",
"user": {
"id": 156715,
"username": "rokota",
"name": "ころたろ",
"avatar_small_url": "https://res.cloudinary.com/zenn/image/fetch/s--KcUIUcEb--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_70/https://storage.googleapis.com/zenn-user-upload/avatar/d4210a0096.jpeg"
},
"publication": null
},
{
"id": 254995,
"post_type": "Article",
"title": "アウトプット人間を目指して（30日目）",
"slug": "d8b4673d6e4958",
"comments_count": 0,
"liked_count": 2,
"body_letters_count": 3286,
"article_type": "idea",
"emoji": "🐣",
"is_suspending_private": false,
"published_at": "2024-03-31T12:00:00.954+09:00",
"body_updated_at": "2024-05-26T13:30:03.735+09:00",
"source_repo_updated_at": null,
"pinned": false,
"path": "/rokota/articles/d8b4673d6e4958",
"user": {
"id": 156715,
"username": "rokota",
"name": "ころたろ",
"avatar_small_url": "https://res.cloudinary.com/zenn/image/fetch/s--KcUIUcEb--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_70/https://storage.googleapis.com/zenn-user-upload/avatar/d4210a0096.jpeg"
},
"publication": null
},
{
"id": 253642,
"post_type": "Article",
"title": "Yahoo! 3.11サイトへ遷移させる釣り投稿に対して思うこと",
"slug": "3a2b4a45962d83",
"comments_count": 0,
"liked_count": 1,
"body_letters_count": 1904,
"article_type": "idea",
"emoji": "🔥",
"is_suspending_private": false,
"published_at": "2024-03-12T18:03:10.036+09:00",
"body_updated_at": "2024-05-26T13:28:25.027+09:00",
"source_repo_updated_at": null,
"pinned": false,
"path": "/rokota/articles/3a2b4a45962d83",
"user": {
"id": 156715,
"username": "rokota",
"name": "ころたろ",
"avatar_small_url": "https://res.cloudinary.com/zenn/image/fetch/s--KcUIUcEb--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_70/https://storage.googleapis.com/zenn-user-upload/avatar/d4210a0096.jpeg"
},
"publication": null
},
{
"id": 251689,
"post_type": "Article",
"title": "アウトプット人間を目指して（開始7日目）",
"slug": "70b9e650ee3241",
"comments_count": 0,
"liked_count": 2,
"body_letters_count": 2751,
"article_type": "idea",
"emoji": "🥚",
"is_suspending_private": false,
"published_at": "2024-03-09T12:01:00.422+09:00",
"body_updated_at": "2024-05-26T13:29:46.136+09:00",
"source_repo_updated_at": null,
"pinned": false,
"path": "/rokota/articles/70b9e650ee3241",
"user": {
"id": 156715,
"username": "rokota",
"name": "ころたろ",
"avatar_small_url": "https://res.cloudinary.com/zenn/image/fetch/s--KcUIUcEb--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_70/https://storage.googleapis.com/zenn-user-upload/avatar/d4210a0096.jpeg"
},
"publication": null
}
],
"next_page": null
}
PayloadではPUSHなどで送信する情報の確認ができます。
PreviewではResponseを整形された形で見ることができます。
なお、Networkタブで表示されるリクエストは使用者が制限されている場合があります。
実際に使えるかはPostman等で確認をします。
Postmanの使い方は以下を参考にしてください
ちなみにZennの場合はURLをそのまま叩くだけで良いみたいです。
https://zenn.dev/api/articles?page=1&username=rokota&count=96&order=latest
Discussion