JavaScript Fetch API
Fetch APIインターフェースを使用すると、WebブラウザーはWebサーバーに対してHTTP要求を行うことができます。
😀XMLHttpRequestはもう必要ありません。
ブラウザのサポート
表の数字は、FetchAPIを完全にサポートする最初のブラウザバージョンを示しています。
Chrome 42 | Edge 14 | Firefox 40 | Safari 10.1 | Opera 29 |
Apr 2015 | Aug 2016 | Aug 2015 | Mar 2017 | Apr 2015 |
FetchAPIの例
次の例では、ファイルをフェッチしてコンテンツを表示します。
例
fetch(file)
.then(x => x.text())
.then(y => myDisplay(y));
Fetchはasyncとawaitに基づいているため、上記の例は次のように理解しやすい場合があります。
例
async function getText(file) {
let x = await fetch(file);
let y = await x.text();
myDisplay(y);
}
またはさらに良い:xとyの代わりに理解しやすい名前を使用してください:
例
async function getText(file) {
let myObject = await fetch(file);
let myText = await myObject.text();
myDisplay(myText);
}