JavaScriptのfetch()でタイムアウトをsignalを使って設定する例
#WebブラウザのJavaScript #fetch #timeout
code:js
function timeoutGet(path, timeout) {
const controller = new AbortController();
const resPromise = fetch(path, {
signal: controller.signal,
});
setTimeout(() => {
controller.abort();
}, timeout);
return resPromise;
}
(async () => {
const start = new Date();
let error = null;
try {
await timeoutGet("https://ppng.io/mypath", 2000);
} catch(err) {
error = err;
}
const end = new Date();
console.log(error);
return ${(end - start) / 1000} sec, error: ${error};
})()
Nipp:
タイムアウトする前にresPromiseが成功したときにcontroller.abort()してもエラーは発生しないことをFirefoxで確認。
検証Nipp:
https://nipp.nwtgck.org/#/es2017,click_run,promise_wait/ZU9LasMwEN37FIPJQgLXTrtMSKG0kG0XOUBUdRobFMmMxqQh6O6VLDsxdKPPm3m/n8Fq7pwF7s7oBt4ji15xW82AhFsBoJ31nE4mZwwS7MDiBd6+HPH7HRVye98l9J/kzp3HuPuDrNtJN8kB+O5kldksJOsMVXEcRh2PfMgZhJCwe52YC4ZK9tk0PAKnLyEPZBchtkUoCqH81Wp4qOWonhXx1OhDMWZFgwxI5MaugzEzFjUP+Jv2yzJhTNdHslw8ztRFdTxH2iOLsmXu/aZp+t6e6s4152uvuC0reFmv16MjLLQzP/5rjsDUEbRi3YqYSk6Wc8B4jxv3Tmi//zVKE2ewNu4kRuKIEvJAFo6rm0ikJ/CsiCU08ByDBfCoqznYBla36RmqbJ6g8RGO2yJIIf8A