使用Spring Boot和React上传图像到DB:解析HTTP请求头错误

Question

这里我使用Spring Boot和React实现图像上传到数据库。我遇到解析HTTP请求报头错误。

错误:

解析HTTP请求报头错误

. lang。在方法中发现无效字符名字[0 x160x030x010x020x000x010x000x010xfc0x030x030x1f0xc4t0x880xe1t0x070x00 [Ua0xf40x8b0x0a0x900x8c<} 0 xe20xf70x080xa90xdao0xb3u0xc7g0xaf0xfb30xa8]。HTTP方法名必须是令牌

对

doit=(e)=>{
e.preventDefault();
let imagefile = document.querySelector('#input');
let formData = new FormData();
formData.append("image", imagefile.files[0]);
return axios.post('https://localhost:8080/fileupload', "image",formData, {
headers: {
'Content-Type': 'multipart/form-data'
}
});
}
<form encType='multipart/form-data'>
<input id="input" type='file' accept="image/*"/>
<button onClick={this.doit} type='submit'>Submit</button>
</form>

春季启动

@PostMapping("/fileupload",consumes = MediaType.MULTIPART_FORM_DATA_VALUE))
public String fileUpload(@RequestParam("name") String name, @RequestParam MultipartFile file) {
try {
byte[] image = file.getBytes();
MyModel model = new MyModel(name, image);
int saveImage = myService.saveImage(model);
if (saveImage == 1) {
return "success";
} else {
return "error";
}
} catch (Exception e) {
return "error";
}
}

Answer 1

所以实际上这个问题与你发送文件的方式有关。图片和视频与json数据不一样。它们是一长串数字或编码文本，在屏幕上创造出视觉杰作。我还不完全明白你需要做的就是获取文件位置。比如它使用了一个文件选择器API它让你选择要上传的东西，你可以把那个信息存储在一个变量中那就是file然后使用javascript内置的fetch方法。

const genFunction = async (file) =>{
const response = await fetch(file)
const blob = await response.blob();
// then you need to send that blob to the server
try {
const result = await requestToServer(
//configuration stuff
contentType:'image/jpg' // specify that you are sending a image
// or whatever file type somehow 
)
console.log(request) } catch (e) { ... } } 

lol他们没有教我如何在编码训练营或其他什么，我没有意识到有更多的类型和事情要做这么长时间。我想出了如何让它与Amplify存储一起工作，如果有人需要，只要问一个问题，我就会提供一个解决方案。

这家伙说了很多关于把东西转换成你真正需要的格式的最佳方法。我提供的解决方案是最慢的，但很容易理解。

http://eugeneware.com/software-development/converting-base64-datauri-strings-into-blobs-or-typed-array

你也应该退房:

https://docs.mongodb.com/manual/core/gridfs/

在MongoDB数据库中存储图像//基本相同的问题

https://javabeat.net/mongodb-gridfs-tutorial/

我以前犯过这个错误，我不知道如何解决它，我的帮助告诉我开始在AWS s3上存储图像，这不是我想要的。我希望你能弄明白。