Веб приложение на Flutter использует библиотеку ResumableJS для загрузки файлов на сервер. Да, это не самое простое решение, но так нужно. При выборе файла (как правило - изображения) необходимо показать его в интерфейсе приложения перед отправкой. Однако я не могу получить сам файл картинки в коде Flutter, не понимаю, как его вытащить из методов библиотеки и сконвертировать в файл любого пригодного формата. Вот код в моем index.html
<script src="https://cdn.jsdelivr.net/npm/resumablejs@1.1.0/resumable.min.js"></script>
<script>
var apiUrl = "https://**********/api/";
var progressBar = 0;
var photoDescriptionUrl1 = "";
var photoDescriptionUrl2 = "";
var photoDescriptionUrl3 = "";
var photoDescriptionUrl4 = "";
var photoDescriptionUrl5 = "";
var photoDescriptionUrl6 = "";
var productPromoPictureURL = "";
var productMiniPromoPictureURL = "";
var productLogoURL = "";
var nowUploading = [];
//****** event for uploading **************
document.addEventListener("uploadFile", function (event) {
console.log("upload file ---- ", event.detail);
initResumable(
event.detail.fieldName,
event.detail.userId,
event.detail.fileType
);
});
function initResumable(fieldName, userId, fileType) {
var uploader = new Resumable({
target: `${apiUrl}product/upload/${userId}`,
chunkSize: 0.5 * 1024 * 1024,
testChunks: false,
prioritizeFirstAndLastChunk: true,
maxFiles: 1,
});
uploader.opts.fileType = fileType;
uploader.assignBrowse(document.getElementById(fieldName));
uploader.on("fileAdded", (file, event) => {
nowUploading.push(file.uniqueIdentifier);
console.log("upload now...");
uploader.upload();
var event = new CustomEvent("uploadedFile", {
detail: {
file: file.file,
},
});
console.log("file---", file);
document.dispatchEvent(event);
});
uploader.on("fileSuccess", (file, message) => {
console.log("uploaded ok", file, "for", fieldName);
if (fieldName === "photoDescriptionUrl1R") {
photoDescriptionUrl1 = file.fileName;
} else if (fieldName === "photoDescriptionUrl2R") {
photoDescriptionUrl2 = file.fileName;
} else if (fieldName === "photoDescriptionUrl3R") {
photoDescriptionUrl3 = file.fileName;
} else if (fieldName === "photoDescriptionUrl4R") {
photoDescriptionUrl4 = file.fileName;
} else if (fieldName === "photoDescriptionUrl5R") {
photoDescriptionUrl5 = file.fileName;
} else if (fieldName === "photoDescriptionUrl6R") {
photoDescriptionUrl6 = file.fileName;
} else if (fieldName === "productLogoURL") {
productLogoURL = file.fileName;
} else if (fieldName === "productLauncherFileUrl") {
} else if (fieldName === "productPromoPictureURL") {
productPromoPictureURL = file.fileName;
} else if (fieldName === "productLauncherFileUrl") {
} else if (fieldName === "productMiniPromoPictureURL") {
productMiniPromoPictureURL = file.fileName;
} else if (fieldName === "productLauncherFileUrl") {
this.form.productLauncher.get(fieldName).setValue(file.fileName);
} else {
this.form.setValue(file.fileName);
}
console.log("file URL is", file.fileName);
return file.fileName;
});
uploader.on("pause", (file, message) => {
console.log("pause", file, message);
});
uploader.on("fileProgress", (file, message) => {
progressBar = uploader.progress();
console.log("fileProgress", this.progressBar);
});
uploader.on("fileError", (file, message) => {
console.log("fileError", file, message);
});
}
</script>
Хочу обратить внимание, что сама загрузка файлов работает хорошо, без проблем и сбоев. Вот как я работаю с библиотекой в dart коде, чтобы получить событие fileAdded:
html.document.on["uploadedFile"].listen((html.Event event) {
var res = (event as html.CustomEvent).detail;
var res1 = Map.from(res);
var reet = res1.values.first;
final reader = html.FileReader();
reader.readAsText(reet);
setState(() {
image = Image.memory(reet);
});
print(res1.toString());
});
Моя проблема в том, что не получается вытащить файл из ответа и сконвертировать его для нужного виджету формата. Выдает ошибку
Uncaught Error: Expected a value of type 'Uint8List', but got one of type 'File$
Подскажите, пожалуйста, как можно это сделать?