CODEWITHSUNDEEP
ionic3image-uploading
Sourabh Chopade
Sourabh Chopade

Reputation: 543

How to upload images from Ionic 3?

I have to upload image using camera and gallery in Ionic 3. My REST backend is in php. I have to send image data in "multipart/form-data" without fileTransfer.upload() function. When i am using print_r($_FILES) in php it is showing black array.

Upvotes: 0

Views: 400

Answers (1)

Er. Kathrecha Krushnkumar
Er. Kathrecha Krushnkumar

Reputation: 119

mobileUpload(): Observable<any> {

    let uploadUrl = '<YOUR API ENDPOINT>';

    const fileTransfer: FileTransferObject = this.transfer.create();

    return Observable.create((observer: Observer<any>) => {

        this.filepickerService.pick().subscribe(uri => {
            let fileName = uri.substring(uri.lastIndexOf('/') + 1).split('?').reverse().pop();

            let options: FileUploadOptions = {
                fileKey: 'file',//key name you will use in $_FILE 
                fileName: fileName,
                mimeType: this.filepickerService.mimeType(uri),
                headers: {
                    "Authorization": "Bearer " + this._authService.getAccessToken()
                }
            }

            let loader = this._loadingCtrl.create();
            loader.present();

            fileTransfer.upload(uri, uploadUrl, options)
                .then((data) => {
                    loader.dismiss();
                    observer.next(JSON.parse(data.response));
                    observer.complete();
                },
                (err) => {
                    loader.dismiss();
                    observer.error(err);
                }).catch(e => {
                    loader.dismiss();
                });

        }, err => {
            observer.error(err);
        });
    });
}

Upvotes: 1

Related Questions