Django API接收CSV文件报错MultiValueDictKeyError求助
解决React向Django API上传CSV文件时的MultiValueDictKeyError问题
出现django.utils.datastructures.MultiValueDictKeyError: 'file'错误,核心原因是前端未正确传递文件,导致后端无法获取到名为file的文件对象。以下是具体修复步骤:
React代码修复点
- 正确获取单个文件对象:
e.target.files返回的是FileList集合,需取第一个元素作为上传文件 - 移除手动设置的Content-Type:浏览器会自动为
multipart/form-data请求添加正确的boundary,手动设置会导致格式错误
修改后的React代码:
import { useState } from 'react'; import './App.css'; function App() { const [file, setFile] = useState(null); const uploadFiles = e => { // 取FileList中的第一个文件 setFile(e[0]); }; const insertFile = async() => { if (!file) return; // 增加文件判断,避免空上传 const f = new FormData(); f.append("file", file); await fetch( '/api/eda/', // 替换为你的实际API地址 { method: 'POST', // 移除手动设置的content-type,让浏览器自动处理 body: f, }) .then((response) => response.json()) .then((data)=>{ console.log(data); }) .catch(error=>{ console.log(error); }); }; return ( <> <input type="file" name="file" onChange={(e)=>uploadFiles(e.target.files)}/> <button onClick={()=>insertFile()}>上传文件</button> </> ); } export default App;
Django代码优化(可选但推荐)
为避免文件未传递时直接报错,可增加判断逻辑:
from rest_framework.decorators import api_view from rest_framework.response import Response import csv @api_view(['POST']) def eda(request): # 使用get方法避免KeyError,同时判断文件是否存在 file = request.FILES.get('file') if not file: return Response({'error': '未上传文件'}, status=400) data = [] # Django的UploadedFile是类文件对象,直接读取即可,无需open csvReader = csv.DictReader(file) for rows in csvReader: data.append(rows) response = { 'csvData': data } return Response(response)
内容的提问来源于stack exchange,提问作者user20627094
相关产品推荐
相关产品推荐

