Я пытаюсь получить строку base64 из файла изображения, отредактированного с помощью docs из редактора изображений Doka.
Этот код я использую по ссылке
options = {
class: 'my-filepond',
multiple: true,
labelIdle: 'Drop images here',
allowImagePreview: true,
acceptedFileTypes: 'image/jpeg, image/png',
allowFileEncode: true,
allowImageTransform: true,
imageEditEditor: Doka.create({
cropAspectRatio: 1,
allowFileEncode: true,
outputFile: true,
onconfirm: (output) => {
const file = output.file;
// encode the file using the FileReader API
const reader = new FileReader();
reader.onloadend = () => {
// use a regex to remove data url part
const base64String = reader.result as string;
base64String.replace('data:', '')
.replace(/^.+,/, '');
// log to console
console.log(base64String) // logs wL2dvYWwgbW9yZ...
};
reader.readAsDataURL(file);
}
})
};
files = [
]
handleFilePondInit() {
console.log('FilePond has initialised', this.myPond);
}
handleFilePondAddFile(event: any) {
console.log(event.file.getFileEncodeBase64String());
}
В настоящее время я получаю сообщение об ошибке
Property 'replace' does not exist on type 'string | ArrayBuffer'.
Property 'replace' does not exist on type 'ArrayBuffer'
Причина, по которой я получаю эту ошибку, заключается в том, что когда я console.log(output)
из onconfirm
показывает
Документация Doka по ссылке выше показывает, что вам нужно назначить const file = output.file
, но, как вы можете видеть на изображении выше, файл не существует как свойство. Как я могу заставить файл появляться в Doka onconfirm
, чтобы я мог создать URL base64? Я ценю любую помощь!