JavaScript HTTP 请求终极指南：Node.js 和 浏览器

JavaScript HTTP 请求终极指南：Node.js 和 浏览器

想要使用 JavaScript 与服务器交互并构建动态 Web 应用？学习如何发出 HTTP 请求至关重要。

本指南将带你了解使用 JavaScript 发出 HTTP 请求的不同方法，涵盖 Node.js 和浏览器环境。

Node.js 环境下的 HTTP 请求

Node.js 提供内置的 'http' 模块来处理 HTTP 请求。以下是如何使用它发出 GET 请求的示例：

// 导入 Node.js 内置的 http 模块
const http = require('http');

// 定义请求的选项
const options = {
  hostname: 'api.example.com', // 请替换为你要请求的 API 地址
  path: '/endpoint', // 请替换为你要请求的具体路径
  method: 'GET' // 请替换为你要使用的 HTTP 方法（GET、POST、PUT 等）
};

// 发出 HTTP 请求
const req = http.request(options, (res) => {
  // 监听响应的数据事件
  res.on('data', (data) => {
    // 在这里处理响应的数据
    console.log(data.toString());
  });
});

// 监听请求错误事件
req.on('error', (error) => {
  console.error(error);
});

// 发送请求
req.end();

浏览器环境下的 HTTP 请求

在浏览器中，你可以使用 'fetch' 或 'XMLHttpRequest' 发出 HTTP 请求。

使用 'fetch'

'fetch' API 提供了一种更简洁现代的方式来发出 HTTP 请求。

fetch('https://api.example.com/endpoint')
  .then(response => response.json())
  .then(data => console.log(data))
  .catch(error => console.error('请求出错:', error));

使用 'XMLHttpRequest'

'XMLHttpRequest' 是一个较旧但仍然广泛支持的 API。

const xhr = new XMLHttpRequest();
xhr.open('GET', 'https://api.example.com/endpoint');
xhr.onload = () => {
  if (xhr.status >= 200 && xhr.status < 300) {
    console.log(xhr.responseText);
  } else {
    console.error('请求出错');
  }
};
xhr.onerror = () => {
  console.error('请求出错');
};
xhr.send();

这就是使用 JavaScript 发出 HTTP 请求的基础知识！ 请记住根据你的环境和需求选择最适合的方法，并在你的项目中尽情探索更高级的用法。