CODEWITHSUNDEEP
flutterfile-uploadflutter-testimage-uploaddio
Bruno Franco Sentis
Bruno Franco Sentis

Reputation: 27

Trying to upload image using DIO. (error)

Hello i hope you all good. Im trying to upload an image but im stuck and getting some errors.

I/flutter (23022): El error es: DioError [DioErrorType.other]: Converting object to an encodable object failed: FormData
I/flutter (23022): #0      _JsonStringifier.writeObject (dart:convert/json.dart:794:7)
I/flutter (23022): #1      _JsonStringStringifier.printOn (dart:convert/json.dart:983:17)
I/flutter (23022): #2      _JsonStringStringifier.stringify (dart:convert/json.dart:968:5)
I/flutter (23022): #3      JsonEncoder.convert (dart:convert/json.dart:345:30)
I/flutter (23022): #4      JsonCodec.encode (dart:convert/json.dart:231:45)
I/flutter (23022): #5      DefaultTransformer.transformRequest (package:dio/src/transformer.dart:77:21)
I/flutter (23022): #6      DioMixin._transformData (package:dio/src/dio_mixin.dart:735:39)
I/flutter (23022): #7      DioMixin._dispatchRequest (package:dio/src/dio_mixin.dart:656:26)
I/flutter (23022): #8      DioMixin.fetch.<anonymous closure> (package:dio/src/dio_mixin.dart:605:7)
I/flutter (23022): #9      DioMixin.fetch._requestInterceptorWrapper.<anonymous closure>.<anonymous closure>.<anonymous closure> (package:dio/src/dio_mixin.dart:517:28)
I/flutter (23022): #10     DioMixin.checkIfNeedEnqueue (package:dio/src/dio_mixin.dart:789:22)
I/flutter (23022): #11     DioMixin.fetch._requestInterceptorWrapper.<ano

This is my file: https://github.com/bRUNS123/hydra

I hope someone can help me!

This is my function to upload:

  void _uploadFile(filePath) async {
    try {
      String filename = p.basename(filePath!.path.split('/').last);

      dio.FormData.fromMap({
        'files': {
          await dio.MultipartFile.fromFile(
            filePath.path,
            filename: filename,
            contentType: MediaType(
              'image',
              'jpeg',
            ),
          ),
        },
        'app_label': 'files',
        'app_model': 'file',
      });

      await Dio()
          .post('http://10.0.2.2:8000/objects/', data: FormData)
          .then((value) {
        // if (value.toString() == '1') {
        //   print('La foto se ha subido correctamente');
        // } else {
        //   print('Hubo un error');
        // }
      });
    } catch (e) {
      print('El error es: $e');
    }
  }

Thanks for reading and i hope someone can help me! have a nice day!

PS: i already check my server with postman.

Upvotes: 0

Views: 2069

Answers (1)

Bienvenu Agbavon
Bienvenu Agbavon

Reputation: 101

Use MultipartRequest class from http package instead (easiest way).

try {
   MultipartRequest request = MultipartRequest(
    'POST',
    Uri.parse("http://10.0.2.2:8000/objects/"),
  );
  request.files.add(
    MultipartFile.fromBytes(
      'files',
      (await File(filePath).readAsBytes()),
      filename: p.basename(filePath.split('/').last);,
    ),
  );
  request.fields.addAll(
    {
      'app_label': 'files',
      'app_model': 'file',
    },
  );
  
  // Parse JSON Response from server {"success" : true, "message" : "..."}
  var json = jsonDecode(
    String.fromCharCodes(
      await (await request.send()).stream.toBytes(),
    ),
  );
} catch (e) {
  debugPrint(e.toString());
}

Upvotes: 1

Related Questions