原生 JavaScript 发送 GET 请求需用 XMLHttpRequest 对象:先 new XMLHttpRequest(),再 open('GET', url, true) 配置异步请求,URL 拼接参数并 encodeURIComponent 编码,最后通过 onload 判断 xhr.status 处理响应,onerror 捕获网络错误。

用原生 JavaScript 发送 GET 请求,核心是使用 XMLHttpRequest 对象(简称 XHR)。它无需依赖任何库,兼容性好,适合理解底层原理或轻量场景。
创建并配置 XHR 实例
先新建一个 XMLHttpRequest 实例,再调用 open() 方法设置请求方式、URL 和是否异步:
-
open('GET', 'https://api.example.com/data', true)—— 第三个参数true表示异步(推荐),设为false会阻塞页面(已不建议) - GET 请求的参数通常拼在 URL 后面,如
'/api/user?id=123&name=john',注意手动做 URL 编码(用encodeURIComponent()处理含特殊字符的值)
监听响应并处理数据
通过 onload 事件获取成功响应,用 onerror 捕获网络错误。注意:HTTP 状态码如 404、500 不触发 onerror,需手动判断 status:
在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。
xhr.onload = function() { if (xhr.status >= 200 && xhr.statusxhr.onerror = function() { console.error('网络请求失败'); }- 若后端返回 JSON,可用
JSON.parse(xhr.responseText)解析(也可直接设xhr.responseType = 'json',此时xhr.response就是解析后的对象)
发送请求
调用 send() 方法发起请求。GET 请求不需要传参,直接 xhr.send() 即可:
立即学习“Java免费学习笔记(深入)”;
- 不要写
xhr.send(null)或xhr.send(undefined),空参数调用更简洁 - 如果需要设置请求头(如
Authorization),在send()前用xhr.setRequestHeader()添加(GET 一般不需要)
完整示例
以下是一个安全、可读的 GET 请求片段:
function httpGet(url) {
const xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.responseType = 'json';
xhr.onload = function() {
if (xhr.status >= 200 && xhr.status < 300) {
console.log('成功:', xhr.response);
} else {
console.error('HTTP 错误:', xhr.status, xhr.statusText);
}
};
xhr.onerror = function() {
console.error('网络错误,请检查连接');
};
xhr.send();
}
// 使用示例(带参数)
const params = new URLSearchParams({ id: 123, name: '张三' });
httpGet(`/api/user?${params}`); // 自动编码,推荐

















