如何同时打印 "PUT" 和 "POST" 方法?

How can I print the "PUT" and "POST" method at the same time?

这两个函数写在最下面的函数可以,而另一个不行。我也没有收到错误消息。我认为交易正在进行,但没有写任何东西。我怎样才能将两者都写入控制台?我将把控制台的打印输出放在下面。预先感谢您的回答。

class Request {
    constructor() {
        this.xhr = new XMLHttpRequest
    }

    post(url, data, callback) {
        this.xhr.open("POST", url)
        this.xhr.setRequestHeader("Content-type", "application/json")
        this.xhr.onload = () => {
            if (this.xhr.status === 201) {
                callback(null, this.xhr.responseText)
            } else {
                callback("Hata", null)
            }
        }
        this.xhr.send(JSON.stringify(data))
    }

    put(url, data, callback) {
        this.xhr.open("PUT", url)
        this.xhr.setRequestHeader("Content-type", "application/json")
        this.xhr.onload = () => {
            if (this.xhr.status === 200) {
                callback(null, this.xhr.responseText, callback)
            } else {
                callback("Hata", null)
            }
        }
        this.xhr.send(JSON.stringify(data))
    }
}

const request = new Request()



request.post("https://jsonplaceholder.typicode.com/albums", {
    userId: 9,
    title: "Thriller"
}, function (error, response) {
    if (error === null) {
        console.log(response);
    } else {
        console.log(error);
    }
})

request.put("https://jsonplaceholder.typicode.com/albums/9", {
    userId: 2,
    title: "Thriller"
}, function (error, response) {
    if (error === null) {
        console.log(response);
    } else {
        console.log(error);
    }
})
// Console Print
{
  "userId": 2,
  "title": "Thriller",
  "id": 9
}

您只创建了一个 Request 对象,名为 request。第一次调用 request.post() 使用 this.xhr 执行 POST,但在该异步过程完成之前,您调用 request.put() 执行 PUT,有效地忽略了之前的 POST.

解决这个问题的一个简单方法是创建两个 Request 对象:

const request = new Request()
const request2 = new Request()

request.post("https://jsonplaceholder.typicode.com/albums", {
    userId: 9,
    title: "Thriller"
}, function (error, response) {
    if (error === null) {
        console.log(response);
    } else {
        console.log(error);
    }
})

request2.put("https://jsonplaceholder.typicode.com/albums/9", {
    userId: 2,
    title: "Thriller"
}, function (error, response) {
    if (error === null) {
        console.log(response);
    } else {
        console.log(error);
    }
})

您也可以重构代码以改用 fetch()。其他可能的解决方案:

你应该使用你的 xhr 一次,而不是多次。要解决此问题,只需在您需要的每个方法中调用 const xhr = new XMLHttpRequest()