如何在Flask中处理文件上传与嵌套JSON并发提交？

一、贴合Flask原生的推荐方案 #

不用把文件编码进JSON，直接利用multipart/form-data请求格式，将嵌套JSON转为字符串作为单独表单字段传递，文件按常规方式上传即可。这种方式符合HTTP标准，处理效率更高，也更适配Flask的请求逻辑。

客户端示例（JavaScript） #

const formData = new FormData();
// 嵌套JSON转字符串作为表单字段
formData.append('metadata', JSON.stringify({
  user: {
    name: '张三',
    age: 25
  },
  tags: ['文档', '图片']
}));
// 添加待上传文件
formData.append('file', document.getElementById('fileInput').files[0]);

// 发送请求
fetch('/upload', {
  method: 'POST',
  body: formData
});

Flask服务端示例 #

from flask import Flask, request, jsonify
import json

app = Flask(__name__)

@app.route('/upload', methods=['POST'])
def upload():
    # 解析嵌套JSON字段
    metadata = json.loads(request.form.get('metadata'))
    # 获取上传的文件对象
    file = request.files.get('file')
    
    # 业务逻辑：保存文件、处理元数据
    if file:
        file.save(f'./uploads/{file.filename}')
    
    return jsonify({
        'status': 'success',
        'metadata': metadata,
        'filename': file.filename if file else None
    })

二、文件编码进JSON的方案（仅适合小文件场景） #

如果必须用JSON承载所有数据，可将文件转为Base64编码字符串嵌入JSON，但这种方式会使文件体积增加约30%，传输和解析效率更低，仅推荐用于小文件场景。

客户端示例（JavaScript） #

const fileInput = document.getElementById('fileInput');
const file = fileInput.files[0];

const reader = new FileReader();
reader.onload = function(e) {
    // 提取Base64格式的文件内容
    const base64File = e.target.result.split(',')[1];
    const payload = {
        metadata: {
            user: { name: '张三', age: 25 },
            tags: ['文档', '图片']
        },
        file: {
            filename: file.filename,
            content: base64File,
            contentType: file.type
        }
    };

    fetch('/upload-json', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify(payload)
    });
};
reader.readAsDataURL(file);

Flask服务端示例 #

import base64
from flask import Flask, request, jsonify

app = Flask(__name__)

@app.route('/upload-json', methods=['POST'])
def upload_json():
    data = request.get_json()
    metadata = data.get('metadata')
    file_data = data.get('file')
    
    if file_data:
        # 解码Base64文件内容并保存
        file_content = base64.b64decode(file_data['content'])
        with open(f'./uploads/{file_data["filename"]}', 'wb') as f:
            f.write(file_content)
    
    return jsonify({
        'status': 'success',
        'metadata': metadata,
        'filename': file_data['filename'] if file_data else None
    })

内容的提问来源于stack exchange，提问作者2191029183018