JavaScript 使用 fetch 来检查资源是否可访问，但有超时

Question

几天前，我尝试实现一个函数来检查资源是否可访问。我对 JS 相当陌生，不得不重组我的完整代码，以实现这里在 SO 上建议的异步功能。

现在我已经让事情按预期工作，上面提到的答案是@adeneo。

但是，如果资源无法访问，该过程需要 2 分钟+，因此我想为fetch命令实现超时。

我在 GitHub 问题上遇到了这个答案：

var p = Promise.race([
fetch('/resource-that-may-take-a-while'),
new Promise(function (resolve, reject) {
setTimeout(() => reject(new Error('request timeout')), 5000)
})
])
p.then(response => console.log(response))
p.catch(error => console.log(error))

我真的不熟悉JS，在这里有点迷茫。

如何在我实现的函数中实现上面建议的超时，发布在我提到的 SO 问题上？

编辑：

由于就我而言，fetch('/resource-that-may-take-a-while')范围更广，因此我尝试将建议的Promise.race包装在我已经拥有的工作代码周围。

结果是一种实现两者的方法，即上一个 SO 问题中建议的函数和 GitHub 的超时建议。

function chk(target, times, delay) {
var p = Promise.race([
return new Promise((res, rej) => {
(function rec(i) {
fetch(target, {mode: 'no-cors'}).then((r) => {
res(r);
}).catch( err => {
if (times === 0)
return rej(err);
setTimeout(() => rec(--times), delay )
});
})(times);
}),
new Promise(function (resolve, reject) {
setTimeout(() => reject(new Error('request timeout')), 5000)
})
])
p.catch(error => console.log("timeout"));
}

这将导致行return new Promise((res, rej) => {Uncaught SyntaxError: Unexpected token return。

Answer 1

根据 mdn：

Promise.race(iterable) 方法返回一个承诺，只要可迭代对象中的一个承诺解析或拒绝，该方法就会解析或拒绝，并具有该承诺的值或原因。

您需要做的就是将 promise 传递到传递给Promise.race函数的数组中。您不必返回那里 - 但您可以返回chk函数的 Promise 以直接使用它，如下所示。p在chk或超时完成/失败时解决/拒绝

var p = Promise.race([
chk(t, 3, 1000),
new Promise(function (resolve, reject) {
setTimeout(() => reject(new Error('request timeout')), 5000)
})
])
p.catch(error => console.log('timeout'))
function chk (target, times, delay) {
return new Promise((res, rej) => {
(function rec (i) {
fetch(target, { mode: 'no-cors' }).then((r) => {
res(r)
}).catch(err => {
if (times === 0) {
return rej(err)
}
setTimeout(() => rec(--times), delay)
})
})(times)
})
}