使用XMLHttpRequest 封装一个http请求函数，并返回调用结果，直接给出代码案例

var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://example.com/some.file', true);
xhr.onload = function (e) {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
console.log(xhr.responseText);
} else {
console.error(xhr.statusText);
}
}
};
xhr.onerror = function (e) {
console.error(xhr.statusText);
};
xhr.send(null);

相关问题

js使用XMLHttpRequest 封装一个http请求，并返回调用结果，直接给出代码

### 回答1：

答：var xhr = new XMLHttpRequest();
xhr.open("GET", "http://example.com/ajax.php");
xhr.onreadystatechange = function(){
if (xhr.readyState == 4 && xhr.status == 200) {
var response = xhr.responseText;
// Do something with response
}
}
xhr.send();

### 回答2：
以下是使用XMLHttpRequest封装一个HTTP请求，然后返回调用结果的示例代码：

function httpRequest(url, method, params, callback) {
  const xhr = new XMLHttpRequest();
  xhr.open(method, url);
  xhr.setRequestHeader("Content-Type", "application/json");
  xhr.onreadystatechange = function() {
    if (xhr.readyState === XMLHttpRequest.DONE) {
      if (xhr.status === 200) {
        callback(null, JSON.parse(xhr.responseText));
      } else {
        callback(new Error("HTTP request failed"));
      }
    }
  };
  xhr.send(JSON.stringify(params));
}

// 使用示例
const url = "https://api.example.com/users";
const method = "POST";
const params = {
  username: "john",
  password: "1234"
};

httpRequest(url, method, params, function(error, response) {
  if (error) {
    console.error("HTTP request error:", error);
  } else {
    console.log("HTTP request response:", response);
  }
});

在这个示例中，我们定义了一个名为`httpRequest`的函数来进行HTTP请求。这个函数将接收URL、HTTP方法、请求参数以及一个回调函数作为参数。在函数体内部，我们创建了一个新的XMLHttpRequest对象，并进行了必要的设置，如设置请求方法、请求头以及回调函数。在回调函数中，我们通过`readyState`来检查请求状态，一旦请求完成，我们将使用`status`来检查HTTP响应的状态码。如果状态码为200，则调用回调函数，并传入`null`作为错误参数和解析后的响应体；否则，返回一个新的错误对象作为错误参数。

最后，我们展示了如何使用这个`httpRequest`函数来发起一个HTTP请求，并传入一个回调函数用于处理请求的结果。在回调函数内部，我们可以根据是否有错误来处理请求的结果。

### 回答3：
下面是使用XMLHttpRequest封装一个HTTP请求，并返回调用结果的JavaScript代码：

function httpRequest(method, url, data) {
  return new Promise(function(resolve, reject) {
    var xhr = new XMLHttpRequest();
    xhr.open(method, url, true);
    xhr.setRequestHeader('Content-Type', 'application/json');

    xhr.onload = function() {
      if (xhr.status >= 200 && xhr.status < 300) {
        resolve(xhr.responseText);
      } else {
        reject(xhr.statusText);
      }
    };

    xhr.onerror = function() {
      reject(xhr.statusText);
    };

    xhr.send(JSON.stringify(data));
  });
}

// 示例调用
httpRequest('GET', 'https://api.example.com/data')
  .then(function(response) {
    console.log('请求成功，返回结果：', response);
  })
  .catch(function(error) {
    console.error('请求出错：', error);
  });

上述代码中的`httpRequest`函数接受三个参数：请求方法（method），请求URL（url）和请求数据（data）。它返回一个`Promise`对象，用于处理异步操作的结果。

在函数内部，我们首先创建一个`XMLHttpRequest`对象，并通过`open`方法指定请求方法和URL。然后，使用`setRequestHeader`方法设置请求头部，这里我们假设请求数据是JSON格式。

接着，我们对`XMLHttpRequest`对象的`onload`和`onerror`事件进行监听，当请求成功时，`onload`事件将会被触发，并将响应结果通过`resolve`方法传递给`Promise`对象。当请求出错时，`onerror`事件将会被触发，我们通过`reject`方法传递错误信息给`Promise`对象。

最后，我们调用`send`方法发送请求，并使用`JSON.stringify`方法将请求数据转换成字符串格式发送。在示例调用中，我们通过`then`方法处理请求成功的结果，通过`catch`方法处理请求出错的情况。

使用XMLHttpRequest 封装一个http请求函数，并返回调用结果

### 回答1：

XMLHttpRequest可以用来封装一个http请求函数，可以通过XMLHttpRequest.send()方法来发送请求，XMLHttpRequest.onreadystatechange()方法可以获取调用结果。

### 回答2：
XMLHttpRequest是一种浏览器内置的JavaScript对象，用于发起HTTP请求并处理响应。可以使用XMLHttpRequest来封装一个http请求函数，并返回调用结果。

首先，创建一个XMLHttpRequest对象：

var xhr = new XMLHttpRequest();

然后，定义一个回调函数来处理响应：

xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
        var response = xhr.responseText;
        // 处理响应
        console.log(response);
    }
};

接下来，使用open方法设置请求方法和URL，并发送请求：

xhr.open("GET", "http://example.com/api", true);
xhr.send();

在回调函数中，可以对响应进行进一步的处理。如果需要发送带有数据的POST请求，可以在send方法中传递参数：

xhr.open("POST", "http://example.com/api", true);
xhr.setRequestHeader("Content-Type", "application/json");
xhr.send(JSON.stringify(data));

最后，可以通过将这个封装好的http请求函数进行封装，来用于不同的http请求调用。例如：

function httpRequest(method, url, data, callback) {
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function() {
        if (xhr.readyState === 4 && xhr.status === 200) {
            var response = xhr.responseText;
            callback(response);
        }
    };
    xhr.open(method, url, true);
    xhr.setRequestHeader("Content-Type", "application/json");
    xhr.send(JSON.stringify(data));
}

httpRequest("POST", "http://example.com/api", data, function(response) {
    // 处理响应
    console.log(response);
});

这样就可以封装一个http请求函数，并返回调用结果。

### 回答3：
使用XMLHttpRequest封装一个HTTP请求函数，并返回调用结果的代码如下：

function httpRequest(url, method, data) {
  return new Promise(function(resolve, reject) {
    var xhr = new XMLHttpRequest();
    xhr.open(method, url, true);
    
    xhr.onload = function() {
      if (xhr.status >= 200 && xhr.status < 300) {
        resolve(xhr.response);
      } else {
        reject({
          status: xhr.status,
          statusText: xhr.statusText
        });
      }
    };
    
    xhr.onerror = function() {
      reject({
        status: xhr.status,
        statusText: xhr.statusText
      });
    };
    
    if (method === 'POST') {
      xhr.setRequestHeader('Content-Type', 'application/json');
    }
    
    xhr.send(JSON.stringify(data));
  });
}

// 调用示例
var apiUrl = 'https://api.example.com/data';
var requestData = {
  name: 'John Doe',
  age: 25
};

httpRequest(apiUrl, 'POST', requestData)
  .then(function(response) {
    console.log('调用成功', response);
  })
  .catch(function(error) {
    console.error('调用失败', error);
  });

这段代码定义了一个`httpRequest`函数，接受三个参数：`url`表示要发送请求的URL地址，`method`表示请求的方法（如GET或POST），`data`表示请求的数据。函数通过创建一个新的`XMLHttpRequest`对象，设置请求的URL和方法，然后发送请求。当请求成功返回时，通过`resolve`回调函数返回请求结果；当请求失败时，通过`reject`回调函数返回错误信息。在调用时可以使用`then`方法处理请求成功的结果，使用`catch`方法处理请求失败的情况。