我正在处理一个表单,用于从react组件中的本地磁盘上载文件。上载文件后,应使用POST请求将其发送到服务器,然后使用 express-fileupload 处理该文件以将其上载到服务器。服务器响应该请求太大:
PayloadTooLargeError:请求实体太大
以下是组件:
import React, { Component } from 'react';
import axios from 'axios';
class FileUpload extends Component {
constructor(props) {
super(props);
this.state = {
sendImage: null
};
this.openFile = this.openFile.bind(this);
this.sendFile = this.sendFile.bind(this);
}
onChange = (e) => {
var file = e.target.files[0];
var reader = new FileReader();
reader.onloadend = () => {
this.setState({ sendImage: reader.result })
}
reader.readAsDataURL(file);
}
openFile(e) {
this.refs.fileUploader.click();
}
sendFile = () => {
axios.post(this.props.API_URL + "upload/news", { data: this.state.sendImage })
.then(res => {
})
}
render() {
return (
<>
<button className="xbutton" onClick={this.sendFile} >Upload</button>
<button className="xbutton" onClick={this.openFile} >Open</button>
<
input
type="file"
name="sampleFile"
ref="fileUploader"
defaultValue=""
onChange={e => this.onChange(e)}
/>
</>
);
}
}
export default FileUpload;
请告诉我错误是什么,可以使用这些工具上传文件吗? 谢谢!