Ionic:undefined不是构造函数FileReader [英] Ionic : undefined is not a constructor FileReader

问题描述

创建FileReader实例(从@ ionic-native/file)实例时遇到问题:

I have a problem when I create a FileReader (from @ionic-native/file) instance :

let f = new FileReader();

发生以下错误:

TypeError: undefined is not a constructor (evaluating 'new __WEBPACK_IMPORTED_MODULE_2__ionic_native_file__["FileReader"]()')

我不明白为什么！

我的配置是:

• nodejs v8.9.1
• npm:v5.5.&
• ionic:3.9.3
• 角度:v5.0.1
• iOS模拟器

有关更多信息，我使用以下代码:

For more informations I use this code :

private readFile(file: any) {
     const reader = new FileReader();
     reader.onloadend = () => {
        const formData = new FormData();
        const imgBlob = new Blob([reader.result], {type: file.type});
        formData.append('file', imgBlob, file.name);
        this.postData(formData);
    };
    reader.readAsArrayBuffer(file);
 }

新的FileReader()发生错误

An error occurs on new FileReader()

谢谢.

推荐答案

我没有解决FileReader问题，但是我使用了另一种解决方案:

I not resolved my FileReader problem, but I used an other solution :

public constructor(private fileTransfer: FileTransfer) {
}


public uploadImage(url: string, imageUri: string, fileName: string): Promise<boolean> {
    return new Promise<boolean>((resolve, reject) => {
        const options: FileUploadOptions = {
            fileKey: 'file',
            fileName: fileName,
            httpMethod: 'POST'
        };

        const fileTransfer: FileTransferObject = this.fileTransfer.create();
        fileTransfer.upload(imageUri, url, options)
            .then(fileUploadResult => {
                console.log('saveImage', fileUploadResult.response);
                resolve(fileUploadResult.responseCode == 201);
            })
            .catch(error => {
                console.error('saveImage', error.code);
                reject(error);
            });
    });
}

imageUri来自以下形式:

The imageUri come form :

addPicture() {
    const options: CameraOptions = {
        quality: 100,
        sourceType: PictureSourceType.PHOTOLIBRARY,
        destinationType: this.camera.DestinationType.FILE_URI,
        encodingType: this.camera.EncodingType.JPEG,
        mediaType: this.camera.MediaType.PICTURE
    };

    this.camera.getPicture(options)
        .then(imageUri => {
            console.log(imageUri);
            this.selectedPictureUriToSend = imageUri;
            this.selectedPictureUri = normalizeURL(imageUri);
        })
        .catch(error => {
            console.error(error);
        });
}

我调用预览功能:

public async publish() {
    try {
        if (this.selectedPictureUriToSend) {
            let fileName = this.selectedPictureUriToSend.substr(this.selectedPictureUriToSend.lastIndexOf('/') + 1);
            this.uploadImage('http://localhost:8181/mythreadsproject/api/image', this.selectedPictureUriToSend, fileName)
            .then(response => {
                console.log(response);
            })
            .catch(error => {
                console.error(error);
            });
        }
    } catch (error) {
        console.error(error);
    }
}

这篇关于Ionic:undefined不是构造函数FileReader的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！