面试取经:网络篇-文件上传

16 阅读1分钟

文件上传

文件上传的消息格式

Snipaste_2025-08-10_18-15-36.png

  • 除非接口文档特别说明,文件上传一般使用POST请求
  • 接口文档中会规定上传地址,一般一个站点会有一个统一的上传地址
  • 除非接口文档特别说明,content-type: multipart/form-data,浏览器会自动分配一个定界符boundary
  • 请求体的格式是一个被定界符boundary分割的消息,每个分割区域本质就是一个键值对
  • 除了键值对外,multipart/form-data允许添加其他额外信息,比如文件数据区域,一般会把文件在本地的名称和文件MIME类型告诉服务器

文件上传的实现

  • 模拟文件上传控件
  • 构建请求体
const formData = new FormData()
formData.append('file',xxx.files[0])
​
{
    method:'POST',
    body:formData
}
  • 前端验证文件格式,尺寸