【前端面试】Http篇

1. HTTPS 概念

• 加密（Encryption）
  • 防止数据被截获
• 数据完整性（Data Integrity）
  • 防止数据篡改
• 身份验证（Authentication）
  • 验证网站的真实性

2. HTTPS 与 HTTP 的区别

• HTTP 是明文传输，HTTPS 是加密传输
• HTTP 使用 80 端口，HTTPS 使用 443 端口
• HTTPS 加密会导致传输稍慢

3. HTTPS 防止的安全威胁

• 中间人攻击（MITM）
  • 加密避免数据被拦截和篡改
• 窃听（Eavesdropping）
  • 通过加密防止数据被监听
• 篡改（Data Tampering）
  • 确保数据在传输过程中不被篡改
• 假冒网站（Phishing）
  • 证书验证防止访问假冒网站

4. 安全相关话题

• 前端数据加密
  • 使用 Web Crypto API 加密用户数据
• XSS（跨站脚本攻击）
  • 输入验证
  • HTML 转义
  • Content Security Policy (CSP)
• CSRF（跨站请求伪造）
  • 同源策略（Same-Origin Policy）
  • CSRF Token
• HTTP 安全头（HTTP Headers）
  • Strict-Transport-Security (HSTS)
  • X-Content-Type-Options
  • X-Frame-Options
  • Content-Security-Policy (CSP)
• 身份验证与授权
  • OAuth
  • JWT（JSON Web Token）

5. 安全存储和传输

• 密码存储
  • 哈希（bcrypt）
• 数据加密存储
  • 对称加密和非对称加密

6. HTTP 版本区别（1.0, 2.0, 3.0）

• HTTP 1.0
  • 请求/响应模型：每个请求都需要建立一个连接
  • 没有管道化和多路复用
  • 缺乏性能优化
• HTTP 2.0
  • 引入了多路复用，可以在一个连接上同时处理多个请求
  • 数据帧和流的概念，提高了性能
  • 压缩请求和响应头，减少延迟
• HTTP 3.0
  • 基于 QUIC 协议（UDP），进一步减少延迟
  • 解决了 HTTP 2.0 在高延迟和丢包情况下的性能问题
  • 更好的安全性，内置 TLS 1.3

7. 强缓存与弱缓存

• 强缓存
  • 浏览器会直接使用缓存的内容，不发请求到服务器
  • 基于 Cache-Control 和 Expires 头部控制
  • 例如：Cache-Control: max-age=3600
• 弱缓存
  • 浏览器会先发请求到服务器，检查资源是否变化，如果没有变化则使用缓存
  • 基于 ETag 或 Last-Modified 头部控制
  • 例如：If-None-Match: "etag-value"

8. 相关面试问题及答案

Q1: HTTPS 和 HTTP 的区别是什么？

• HTTP 是明文传输，HTTPS 在 HTTP 上加入了 SSL/TLS 加密协议，确保数据传输的机密性、完整性和身份验证。HTTPS 使用 443 端口，而 HTTP 使用 80 端口。

Q2: HTTPS 如何防止中间人攻击？

• HTTPS 使用 SSL/TLS 加密传输，防止了第三方拦截、篡改数据。在通信过程中，双方会验证彼此的身份（通过证书），并通过加密保护数据内容。

Q3: 如何防止 XSS 和 CSRF 攻击？

• XSS：输入验证、HTML 转义、使用 Content Security Policy (CSP) 防止恶意脚本注入。
• CSRF：使用 CSRF Token、双重提交 Cookie 或者通过 SameSite 属性限制跨站请求。

Q4: 如何配置浏览器安全性头部？

• Strict-Transport-Security (HSTS)：要求浏览器仅通过 HTTPS 连接。
• X-Content-Type-Options：防止浏览器根据内容推测 MIME 类型。
• X-Frame-Options：防止网页被嵌入在 iframe 中，减少点击劫持攻击。
• Content-Security-Policy (CSP)：限制浏览器加载的内容类型，防止 XSS 攻击。

Q5: 前端如何保护用户的敏感信息？

• 使用 HTTPS 加密传输数据。
• 在客户端存储时对敏感数据进行加密。
• 使用 HTTP Only 和 Secure 属性来保护 Cookie。
• 定期更新和管理认证 token，使用 JWT 进行身份验证。

Q6: HTTP 1.0 和 HTTP 2.0 有哪些主要区别？

• HTTP 1.0 使用每个请求一个连接，而 HTTP 2.0 引入了多路复用技术，允许在一个连接上同时发送多个请求和响应，从而减少延迟和提高性能。

Q7: 什么是强缓存和弱缓存，如何配置？

• 强缓存：在资源有效期内，浏览器不会向服务器发送请求，直接使用缓存。
  • 配置：Cache-Control: max-age=3600
• 弱缓存：浏览器会检查缓存是否过期，如果过期则向服务器请求新的资源。
  • 配置：ETag 或 Last-Modified

Q8: 如何避免 CSRF 攻击？

• 使用 CSRF Token：为每个请求生成唯一的 Token，服务器验证 Token 来确保请求来自合法的用户。
• 使用 SameSite Cookie 属性：限制第三方网站发送跨站请求。