前几日在用react + express做网站文件上传模块时采用了常用的几个后台处理文件上传的模块,几乎每个都会出现上述错误,究其原因,以如下代码进行调试测试
//new一个formidable.IncomingForm();
var form = new formidable.IncomingForm();
//设置临时文件存放的路径
form.uploadDir = "public/";
//设置上传数据的编码
form.encoding='utf-8';
//设置是否保持上传文件的拓展名
form.keepExtensions = true;
form.on('error',function(err) {
console.log('errr!!!!!!!!!!!!!!');
res.write('xxxx');
res.end();
}
form.parse(req,function(err,fields,files) {
res.writeHead(200,{'content-type': 'text/plain'});
res.write('received upload:\n\n');
res.end();
});
此时看到
Can't set headers after they are sent,因为react的做法是以组件的形式进行开发的,所以将上传文件那块html直接放在html页面中就不会出错,react 写法如下:
return(<div>
<AppMenu/>
<h1>文件上传</h1>
<form method="post" enctype="multipart/form-data" action="/upload">
<input type="text" name="text"/>
<br/><br/>
<input type="text" name="ss"/>
<br/><br/>
<input type="file" name="f"/>
<br/><br/>
<input type="submit" value="提交"/>
</form>
</div>
)
初步怀疑此return 出错,上传模块以前以为是不兼容的问题,我express是4.13.4,算是新版本了,找到了问题所在再继续解决,以此作为题记,后续会补充解决方案.
原文链接:https://www.f2er.com/react/306427.html