解决AJAX请求重复发送的问题

<button>发送请求</button>

const btns = document.querySelectorAll('button');
let xhr = null;
let isSending = false // 标识变量 是否正在发送AJAX请求
btns[0].onclick = function () {
    // 判断标识变量
    if (isSending) {
        // 如果正在发送则取消该请求 创建一个新的
        xhr.abort();
    }
    // 创建对象
    // 因为在外部定义了xhr 所以这里的const要删除
    xhr = new XMLHttpRequest();
    // 修改标识变量的值
    isSending = true;
    // 初始化 设置请求方式和url
    xhr.open("GET", "http://127.0.0.1:8000/delay");
    // 发送
    xhr.send();
    xhr.onreadystatechange = function () {
        if (xhr.readyState === 4) {
            // 修改标识变量
            isSending = false;
        }
    }
}

// server.js
// 1. 引入express
const express = require('express');
// 2. 创建应用对象
const app = express();
// 3. 创建路由规则
// request是对请求报文的封装
// response是对响应报文的封装

app.get('/delay', (request, response) => {
    // 设置响应头 设置允许跨域
    response.setHeader('Access-Control-Allow-Origin', '*');
    // 设置响应体
    setTimeout(() => {
        response.send('hello ajax delay');
    }, 3000);
});

// 4. 监听端口启动服务
app.listen(8000, () => {
    console.log("服务已启动,8000端口监听中......");
})