无惧前端HTTP面试！一文搞定常见考题（上）

在前端面试中，HTTP可谓是逃不过的一道坎。它作为Web世界的基石，掌握它的相关知识至关重要。本文将从HTTP的请求与响应入手，深入浅出地解析前端HTTP面试题中的常见考题，助你轻松应对面试挑战。

HTTP请求

1. HTTP请求报文结构是什么？

请求行： 方法、请求URI、HTTP版本
请求首部： Name-Value对形式的附加信息，如Content-Type、Accept、User-Agent
请求体： 实际要发送的数据，如表单数据、JSON数据

2. GET和POST的区别是什么？

• GET： 从服务器获取数据，数据通过URL传递，安全性较低
• POST： 向服务器提交数据，数据通过请求体传递，安全性较高

3. HTTP状态码有哪些常见类型？

• 200： 成功
• 404： 未找到
• 500： 内部服务器错误

HTTP响应

4. HTTP响应报文结构是什么？

状态行： HTTP版本、状态码、原因短语
响应首部： Name-Value对形式的附加信息，如Content-Type、Content-Length、Server
响应体： 服务器返回的实际数据，如HTML文档、JSON数据

5. 缓存控制有哪些常用的首部？

• Cache-Control： 控制缓存机制，如no-cache、max-age
• Expires： 指定缓存过期时间

6. HTTP重定向是如何实现的？

通过3xx状态码，如301（永久重定向）、302（临时重定向），并通过Location首部指定新的URL。

示例代码：

//发送GET请求
fetch('https://example.com/api/users')
  .then(response => {
    if (response.ok) {
      // 处理成功响应
    } else {
      // 处理失败响应
    }
  });

//发送POST请求
fetch('https://example.com/api/users', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({ name: 'John Doe' })
})
  .then(response => {
    if (response.ok) {
      // 处理成功响应
    } else {
      // 处理失败响应
    }
  });

掌握这些HTTP请求与响应的基础知识，相信你能够在前端HTTP面试中脱颖而出。下期，我们将继续深入探讨HTTP其他方面的考题，帮助你进一步巩固基础。