react前端显示图片_【React】怎么把图片从前端上传到服务器？

遇到一个需求，就是需要把图片传给后台数据库，然后前端再读取数据库图片，有人说base64，请问一下base64是怎么上传的？前端把图片转为base64数据，传给后台，然后后台保存base64，之后前端读取的时候再解析base64？是这样理解的吗？还有其他方法吗？

前端用的是react，后台是java

回答

可以使用 FormData ，其属于 XHR Level 2 中内容。文件可以使用 input:file 来进行上传，并获取 fileInputElement.files[0] 作为value。

具体使用可参照以上链接。

前端把图片转为base64数据，传给后台，然后后台保存base64，之后前端读取的时候再解析base64

是的，可以这样子。转为base64数据后就是一段字符串，POST上传就好了

但是一般不会采用这种方案，因为

1.Base64要求把每三个8Bit的字节转换为四个6Bit的字节(38 = 46 = 24)，然后把6Bit再添两位高位0，组成四个8Bit的字节，也就是说，转换后的数据理论上将要比原来的大1/3，消耗流量，浪费空间。

2.你转化为Base64之后怎么存储呢？存储在数据库吗？那又要多支付访问数据库的开销。存储为图片文件吗？那又要转换回来，也是增加了解析转换的开销。

3.浏览器的兼容问题，IE 8 以下不支持 data url，IE 8 开始支持 data url，却有大小限制。

所以，一般