Reddit Fetch
Reddit Fetch
言語の選択

過去のコメントを最大3件、まずは小さなプレビューに

サーバー側のfetchで過去のコメントを少量取得し、HTTPとJSONを確認して表示へつなげます。キーの保管と、空の結果・失敗の区別も説明します。

APIキーを取得

リクエスト例

JavaScript

const response = await fetch("https://api.redditfetch.com/v1/comments?subreddit=javascript&limit=3", {
  headers: { Authorization: "Bearer YOUR_API_KEY" }
});
if (!response.ok) throw new Error(`HTTP ${response.status}`);
const payload = await response.json();
console.log(payload);

最初に画面の役割を決める

コメントのプレビューは、「受け取った記録のうち、何を利用者に見せられるか」という小さな問いから始められます。Reddit Fetchは、JavaScriptアプリケーションから独立した過去のRedditアーカイブを参照するためのサービスです。まず一つのコミュニティを選び、本文がない場合の表示も決めておきましょう。取得量を増やす前に、画面に必要な情報と、その情報が欠けたときの説明を整理できます。

例の要求はGET https://api.redditfetch.com/v1/comments?subreddit=javascript&limit=3です。subreddit=javascriptはコミュニティを選び、limit=3は取得件数の上限を3件にします。必ず3枚のカードが埋まるという意味ではありません。返る記録が少ない場合も、成功した応答が空の場合もあります。また、並んだコメントが同じ会話に属するとは限りません。並び順だけを根拠に返信関係を作らないでください。

要求をサーバーの中に置く

fetchはNode.jsのサーバープロセスで実行し、REDDIT_FETCH_API_KEYを非公開の設定から読み込みます。要求の前に値があることを確認してください。Authorization: Bearer <key>とX-API-Key: <key>の両方が使えます。例の<key>は保管した秘密情報を表すもので、ブラウザー向けJavaScriptへ埋め込む値ではありません。画面を見る利用者にアーカイブのキーを渡す必要はありません。

最初の試作では接続先を固定します。応答を確認した後、サーバーからブラウザーへプレビュー用の必要な情報だけを返せます。利用者が入力した任意のURLを、キー付き要求の送信先にしないでください。自分のアプリケーションの経路を誰が更新できるかも決めます。キーを隠すだけでは、その経路から有料要求を何度も実行できる問題までは解決しません。

空の結果と失敗を別の表示にする

fetchのPromiseが完了してもHTTP成功とは限りません。まずresponse.okを確認し、その後でJSONの解釈と必要なフィールドの検証へ進みます。ネットワーク例外は別の結果であり、応答を受信してもJSONの読み取りで失敗することがあります。これらをすべて「コメントなし」にまとめると、画面にも診断にも誤った意味を与えてしまいます。

コメントは平坦な記録の断片です。本文の有無を確かめ、欠けた値に対する表示を用意し、内容はテキストとして出力します。読み込み中、表示可能、空、失敗という状態はアプリケーション側で定義します。アーカイブの一回の結果が空でも、そのコミュニティにコメントがない証明にはなりません。3件の断片から完全な会話の木が得られたと考えることもできません。

次の更新を行う理由を選ぶ

成功した取得は空でも1クレジットを使います。料金は成功1000要求あたり$1で、最低$50の追加購入は50000有料クレジットです。試用クレジットの付与には条件があります。保存済みの応答をローカルで再利用するなら新たな取得は不要ですが、更新要求が成功すれば、表示内容が変わらなくても別の1クレジットを消費します。画面を開くたびに更新する必要があるかを検討してください。

このアーカイブはRedditと公式な提携関係がなく、ライブ配信でもありません。完全な網羅性、恒久的な利用可能性、応答の不変性は保証されません。プレビューには過去の記録であることを示し、アーカイブの順序を新着順として扱わないでください。キーのページではサーバー設定、ガイドでは失敗への対処、ドキュメントでは応答形式を確認できます。