英文:
How unabort the aborted fetch
问题
const startFetch = document.querySelector("#startFetch");
const stopFetch = document.querySelector("#stopFetch");
const controller = new AbortController();
const todos = async() => {
fetch("https://jsonplaceholder.typicode.com/todos", {
signal: controller.signal,
})
.then((data) => data.json())
.then((todos) => {
console.log(todos);
})
.catch((err) => {
console.log(err.message);
});
};
startFetch.addEventListener("click", todos);
stopFetch.addEventListener("click", () => {
controller.abort();
});
<button id="startFetch">startFetch</button>
<button id="stopFetch">stopFetch</button>
I need to un-abort an aborted fetch
<details>
<summary>英文:</summary>
I aborted, fetched but I couldn't call the fetch again
const startFetch = document.querySelector(" #startFetch");
<!-- begin snippet: js hide: false console: true babel: false -->
<!-- language: lang-js -->
const stopFetch = document.querySelector("#stopFetch");
const controller = new AbortController();
const todos = async() => {
fetch("https://jsonplaceholder.typicode.com/todos", {
signal: controller.signal,
})
.then((data) => data.json())
.then((todos) => {
console.log(todos);
})
.catch((err) => {
console.log(err.message);
});
};
startFetch.addEventListener("click", todos);
stopFetch.addEventListener("click", () => {
controller.abort();
});
<!-- language: lang-html -->
<button id="startFetch">startFetch</button>
<button id="stopFetch">stopFetch</button>
<!-- end snippet -->
I need to un-abort an aborted fetch
</details>
# 答案1
**得分**: 1
无法。一个被中止的获取操作关闭了连接,你需要发起一个单独的新请求。一个被中止的信号保持了其状态,你需要创建一个新的信号(以及一个新的 `AbortController`)。
```javascript
const stopFetch = document.querySelector("#stopFetch");
let controller;
const todos = async() => {
controller = new AbortController();
fetch("https://jsonplaceholder.typicode.com/todos", {
signal: controller.signal,
})
.then(data => data.json())
.then(todos => {
console.log(todos);
}, err => {
console.log(err.message);
}).finally(() => {
controller = null;
});
};
startFetch.addEventListener("click", todos);
stopFetch.addEventListener("click", () => {
if (controller) {
controller.abort();
} else {
console.log("no active request");
}
});
<button id="startFetch">startFetch</button>
<button id="stopFetch">stopFetch</button>
英文:
You cannot. An aborted fetch closed the connection, you need to make a separate new request. An aborted signal stays keeps that state, you need to create a new signal (and a new AbortController
).
<!-- begin snippet: js hide: false console: true babel: null -->
<!-- language: lang-js -->
const stopFetch = document.querySelector("#stopFetch");
let controller;
const todos = async() => {
controller = new AbortController();
fetch("https://jsonplaceholder.typicode.com/todos", {
signal: controller.signal,
})
.then(data => data.json())
.then(todos => {
console.log(todos);
}, err => {
console.log(err.message);
}).finally(() => {
controller = null;
});
};
startFetch.addEventListener("click", todos);
stopFetch.addEventListener("click", () => {
if (controller) {
controller.abort();
} else {
console.log("no active request");
}
});
<!-- language: lang-html -->
<button id="startFetch">startFetch</button>
<button id="stopFetch">stopFetch</button>
<!-- end snippet -->
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论