怎么将图片转成base64传给后端
时间: 2023-10-12 13:22:21 浏览: 74
要将图片转成base64传给后端,可以使用JavaScript中的FileReader对象和canvas对象。
首先,使用FileReader对象读取图片文件,将图片转换成Data URL格式。然后,使用canvas对象将Data URL格式的图片绘制到canvas上,并使用canvas对象的toDataURL()方法将canvas对象中的图片转换成base64格式。
以下是一个示例代码:
```javascript
// 选择图片文件
const fileInput = document.getElementById('fileInput');
const file = fileInput.files[0];
// 读取图片文件
const reader = new FileReader();
reader.readAsDataURL(file);
// 将图片转换成base64格式
reader.onload = function() {
const dataURL = reader.result;
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
const img = new Image();
img.onload = function() {
canvas.width = img.width;
canvas.height = img.height;
ctx.drawImage(img, 0, 0);
const base64 = canvas.toDataURL('image/jpeg');
// 将base64格式的图片传给后端
// ...
};
img.src = dataURL;
};
```
注意,使用canvas对象将图片转换成base64格式时,需要指定图片的格式,例如上面的代码中指定了图片格式为jpeg。