[JavaScript]GETリクエスト行う簡潔な関数の作り方

getリクエストって書くのが面倒ですよね

かといって関数化してもasyncで複雑な書き方をしなくてはいけないので、関数化が地味に苦戦しました。

似たような経験をしている人がいるかもしれないので、短くて読みやすい簡単なgetリクエストの関数を紹介します

結論コード

結論コードは以下のとおりです

async function fetchData(url) {
    const response = await fetch(url);
    const text = await response.text(); 
    return text;
}

asyncは避け避けれませんが、コード自体が簡潔なのでだいぶ使いやすいと思います。

リクエストが返ってくるまで処理を止めたい場合はawaitをくっつけるだけですし、非同期でやりたい場合はawaitを付けないで関数を呼び出すだけです。

以外とこういうシンプルなコードって探すの難しいんですよね。

ですので今回、このコードを紹介させていただきました。

おまけ

ちなみに、下記のように書き換えればしっかりエラーにも対応できます

async function fetchData(url) {
    try {
                        
        const response = await fetch(url);
        if (!response.ok) throw new Error("error : " + response.status);

        const text = await response.text();
        return text;
        
    } catch (error) {
        console.error("error : ", error);
                        
        throw error;
    }
}

簡単なwebアプリなどの場合はエラーが返ってくることはほぼないので、ここまでしっかりエラーに対応せずとも冒頭の結論コードで十分だと思います

ですので冒頭の結論コードを基に、皆さんの作りたいものに合わせてお好みで弄るといいと思います

まとめ

いかがだったでしょうか

皆さんのプログラミングが楽になれば幸いです

ではまた！