Upfetch：JavaScript-Désでフェッチするための改善された代替手段。ウェブ

Upfetchは、HTTPリクエストの作成方法を改善することを約束するJavaScriptライブラリです。軽く、安全で、使いやすいように設計されたアップフェッチは、従来のフェッチAPIの近代的な代替品として際立っています。

1.2kbのGzipと依存性がないだけで、 アップフェッチ 非常に軽いです。アプリケーションを遅くすることはなく、既存のプロジェクトに簡単に統合できます。

アップフェッチ ネイティブフェッチAPIを拡張します。つまり、追加の賢明なデフォルト機能の恩恵を受けながら、すべての標準フェッチオプションを使用できます。

スキームの検証

の主要な資産の1つアップフェッチ おかげで回答を検証しているということです ゾッド、 バリボット または arktype。したがって、返品は分析され、要求された構成に応答する必要があります。
これにより、受け取ったデータが期待に沿っていることが保証され、エラーのリスクが低下します。

import { upfetch } from './upfetch';
import { z } from 'zod';

const user = await upfetch('https://api.monsite.fr/users/1', {
  schema: z.object({
    id: z.number(),
    name: z.string(),
    avatar: z.string().url(),
  }),
});

リクエストのデフォルトリクエスト

デフォルト値をbase手またはヘッダーとして1回だけ定義し、どこでも使用できます。

const upfetch = up(fetch, () => ({
   baseUrl: 'https://api.monsite.fr',
   timeout: 30000,
}))

簡略化された要求パラメーター

クエリパラメーターであなたの人生を簡素化することもできます。クラシックなフェッチAPIを使用すると、これがある場合があります。

fetch(
   `https://api.monsite.fr/todos?search=${search}&skip=${skip}&take=${take}`,
)

と アップフェッチ、設定を自動的にマッピングできます。

upfetch('/todos', {
   params: { search, skip, take },
})

自動クエリボディ管理

アップフェッチ JSONのリクエストボディのシリアル化を自動的に管理します。これにより、各リクエストで手動で実行する必要がありません。
標準のフェッチで：

fetch('https://api.moniste.fr/todos', {
   method: 'POST',
   headers: { 'Content-Type': 'application/json' },
   body: JSON.stringify({ title: 'New Todo' }),
})

と アップフェッチ ：

upfetch('/todos', {
   method: 'POST',
   body: { title: 'New Todo' },
})

私はあなたを残します ドキュメントを閲覧します upfetchの他の機能を発見するために！