我现在有很多种图片格式,我要把他们全部转为file文件格式传到后台,帮我封装一个方法,用js解决转换格式的问题,
时间: 2024-06-10 18:06:01 浏览: 117
好的,下面是一个简单的方法,可以将多种图片格式转换为file格式:
```javascript
function convertImageToBlob(imageUrl, callback) {
var xhr = new XMLHttpRequest();
xhr.open('GET', imageUrl, true);
xhr.responseType = 'blob';
xhr.onload = function() {
if (xhr.status === 200) {
callback(xhr.response);
}
};
xhr.send();
}
function convertImagesToFiles(imageUrls, callback) {
var files = [];
var count = imageUrls.length;
for (var i = 0; i < count; i++) {
convertImageToBlob(imageUrls[i], function(blob) {
var file = new File([blob], 'image' + i + '.jpg', {});
files.push(file);
count--;
if (count === 0) {
callback(files);
}
});
}
}
```
使用方法:
```javascript
var imageUrls = ['http://example.com/image1.jpg', 'http://example.com/image2.png'];
convertImagesToFiles(imageUrls, function(files) {
// 上传文件
var formData = new FormData();
for (var i = 0; i < files.length; i++) {
formData.append('file[]', files[i]);
}
//提交表单
var xhr = new XMLHttpRequest();
xhr.open('POST', '/upload', true);
xhr.onload = function() {
if (this.status === 200) {
console.log('上传成功!');
}
};
xhr.send(formData);
});
```
其中,convertImagesToFiles函数将图片链接数组转换为Blob对象数组,然后使用File构造函数将每个Blob对象封装成File对象,最后将File数组作为回调参数传递给callback函数。在回调函数中可以处理上传文件等操作。
阅读全文