JavaScriptアプリケーションにおけるAPIの統合

APIを利用する際、最も一般的なHTTPメソッドはGETとPOSTです：

• GET：サーバーからデータを取得するために使用；
• POST：サーバーにデータを送信するために使用され、主にフォームの送信やJSONデータの送信時に利用。

GETリクエストの例

GETリクエストは、リソースを変更せずにサーバーからデータを取得。

fetchPost 関数は、fetch() メソッドを使用して指定されたエンドポイント（/posts/1）にリクエストを送信します。レスポンスを受信した後、データは JSON として解析され、投稿タイトルが抽出されて HTML の段落に表示されます。

POSTリクエストの例

POST リクエストはデータをサーバーに送信するもので、新しいリソースの作成やフォームデータの送信によく使用されます。

sendPostRequest 関数は、指定されたエンドポイント（/posts）に対して、method を 'POST' に設定してリクエストを送信します。ヘッダーには 'Content-Type': 'application/json' が含まれており、JSON データが送信されることを示します。body には、新しい投稿の詳細（title、body、userId など）が JSON 形式で含まれています。リクエスト後、サーバーからのレスポンスは JSON として解析され、作成された投稿のタイトルが HTML に表示されます。

ヘッダーの送信とさまざまな HTTP メソッド（GET、POST、PUT、DELETE）の扱い

異なる HTTP メソッドは、それぞれ異なる目的で使用されます。GET や POST に加えて、一般的なメソッドには以下があります：

• PUT：既存のリソースを更新する際に使用；
• DELETE：サーバーからリソースを削除する際に使用。

また、認証トークンやコンテンツタイプなどの追加情報を提供するために、任意の HTTP メソッドでヘッダーを送信できます。

PUT リクエスト例：データの更新

updatePost 関数は、指定されたエンドポイント（PUT）に /posts/1 リクエストを送信し、既存の投稿を更新します。リクエストには更新操作を指定するために method: 'PUT' が含まれ、headers には 'Content-Type': 'application/json' が設定されており、JSON 形式であることを示します。body には、id、更新された title、body、userId を含む JSON 形式のデータが含まれます。レスポンスを受信した後、JSON として解析され、更新されたタイトルが HTML に表示されます。

DELETE リクエスト例：データの削除

deletePost 関数は、特定のエンドポイント（DELETE）に /posts/1 リクエストを送信し、特定の投稿を削除します。method: 'DELETE' は操作内容を指定します。リクエスト後、response.ok でレスポンスのステータスを確認します。成功した場合は、HTML に成功メッセージ（「投稿が正常に削除されました。」）が表示されます。削除に失敗した場合は、代わりにエラーメッセージが表示されます。

APIリクエストにおけるクエリパラメータの使用

クエリパラメータは、URLに追加情報を送信するために使用されます。これには、データのフィルタリング、結果のソート、ページネーションされたレスポンスでのページ番号の指定などが含まれます。

クエリパラメータ付きのGETリクエスト

fetchPostsByUser 関数は、クエリパラメータ（userId=1）を含むAPIエンドポイントにリクエストを送信し、指定されたユーザーに属する投稿のみをフィルタリングします。userId はクエリパラメータとしてURLに直接追加されます。フィルタリングされたデータを受信した後、この関数はそのユーザーの投稿数をHTMLに表示します。