JavaScript 获取请求 GET

在Web应用程序开发中，获取请求数据是非常普遍和重要的操作。JavaScript作为一种脚本语言，也可以通过发送HTTP请求获取请求数据。在本文中，我们将介绍如何使用JavaScript获取请求GET。

发送GET请求

使用JavaScript发送GET请求可以使用XMLHttpRequest对象，也可以使用fetch()方法。在这里我们将介绍这两种方式。

XMLHttpReqeuest

XMLHttpRequest对象是现代浏览器中常见的原生AJAX技术。它可以用于向服务器发送HTTP请求并获取响应。

let xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function () {
    if (this.readyState == 4 && this.status == 200) {
        console.log(this.responseText);
    }
};
xmlhttp.open("GET", "https://example.com/api/data", true);
xmlhttp.send();

上述代码会发送一个GET请求到https://example.com/api/data，并在获取响应后将响应文本打印在控制台中。

fetch()

fetch()方法是ES6中引入的新特性。它提供了一种简单和灵活的方式发送HTTP请求，并且支持Promise对象的链式调用。

fetch("https://example.com/api/data")
    .then(response => response.text())
    .then(data => console.log(data))
    .catch(error => console.log(error));

上述代码会发送一个GET请求到https://example.com/api/data，并在获取响应后将响应文本打印在控制台中。如果在请求过程中出现了错误，将会在控制台中输出错误信息。

发送带有参数的GET请求

使用JavaScript发送带有参数的GET请求可以通过将参数拼接到请求URL中的方式发送。

XMLHttpReqeuest

let xmlhttp = new XMLHttpRequest();
let url = "https://example.com/api/data?param1=value1&param2=value2";
xmlhttp.onreadystatechange = function () {
    if (this.readyState == 4 && this.status == 200) {
        console.log(this.responseText);
    }
};
xmlhttp.open("GET", url, true);
xmlhttp.send();

上述代码会发送一个带有param1和param2参数的GET请求到https://example.com/api/data，并在获取响应后将响应文本打印在控制台中。

fetch()

let url = "https://example.com/api/data?param1=value1&param2=value2";
fetch(url)
    .then(response => response.text())
    .then(data => console.log(data))
    .catch(error => console.log(error));

上述代码会发送一个带有param1和param2参数的GET请求到https://example.com/api/data，并在获取响应后将响应文本打印在控制台中。如果在请求过程中出现了错误，将会在控制台中输出错误信息。

总结

在Web应用程序开发中，获取请求数据是非常普遍和重要的操作。JavaScript作为一种脚本语言，可以通过发送HTTP请求获取请求数据。在本文中，我们介绍了如何使用JavaScript通过XMLHttpRequest对象和fetch()方法发送GET请求，并且也介绍了如何发送带有参数的GET请求。