当前位置：首页 > JavaScript

js实现同步ajax

2026-02-02 15:32:01JavaScript

同步 AJAX 实现方法

在 JavaScript 中，同步 AJAX 请求可以通过 XMLHttpRequest 对象的 open 方法将第三个参数设置为 false 来实现。这种方式会阻塞代码执行，直到请求完成。

js实现同步ajax

var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://api.example.com/data', false); // 同步请求
xhr.send();

if (xhr.status === 200) {
    console.log(xhr.responseText);
} else {
    console.error('请求失败');
}

同步 AJAX 的替代方案

由于同步 AJAX 会阻塞主线程，导致糟糕的用户体验，现代开发中推荐使用异步 AJAX 配合 Promise 或 async/await 来模拟同步效果。

js实现同步ajax

async function fetchData() {
    try {
        const response = await fetch('https://api.example.com/data');
        const data = await response.json();
        console.log(data);
    } catch (error) {
        console.error('请求失败', error);
    }
}

fetchData();

注意事项

同步 AJAX 在现代前端开发中已被弃用，主线程阻塞会导致页面无响应。所有主流浏览器已警告或限制在主线程中使用同步 XMLHttpRequest。

Fetch API 和 axios 等现代库不支持同步请求，这是出于性能考虑。如需顺序操作，应使用 Promise 链或 async/await。

fetch('https://api.example.com/data')
    .then(response => response.json())
    .then(data => {
        console.log(data);
        return fetch('https://api.example.com/next');
    })
    .then(response => response.json())
    .catch(error => console.error(error));