flutterfile-uploadflutter-imagemultipartfile

uploading An Image to Database using MultiPartFile in Flutter


I want to upload an image that I have already retrieved from the database(product table) to the cart table. The issue is, I can't use the .path with the MultipartFile("file", image.path);

I am getting an error if I try using .path with my image variable. I've also tried several methods but none is working... I'll attach my codes below

The image is already stored in a map(revievedMap) which I receivr from the previous screen so I'm not using an imagePicker, the product image I'm trying to access is already stored in the database.

request.fields['image'] = "http://10.0.2.2:/shopice/assets/${args.product.image}";
request.fields['image'] = "http://localhost:/shopice/assets/${args.product.image}";

I tried the code above, obviously didn't work.

var pic = await http.MultipartFile.fromPath("image", args.product.image!);
//request.files.add(pic);

I also tried this, but I need to set the path on the second argument, but args.product.image.path(), is returning this error

[the getter 'path' isn't defined for the type 'String'. (Documentation)  Try importing the library that defines 'path', correcting the name to the name of an existing getter, or defining a getter or field named 'path'.]

here is the code:

//args.receivedMap: is my buyer detials
//args.product: is the product i'm trying to add to cart,  which //contains the image

args.seller: is the seller details
child: FlatButton(
      onPressed: ()async {
                                  if(!args.receivedMap.isEmpty){
                                    
                                    final uri = Uri.parse("http://10.0.2.2:/shopice/api/buyer/addToCart");
                                    var request = http.MultipartRequest('POST', uri);
                                    request.fields['buyer_id'] =args.receivedMap['id'];
                                    request.fields['seller_id'] = args.seller.id.toString();
                                    request.fields['seller_name'] = args.seller.name!;
                                    request.fields['buyer_name'] = args.receivedMap['name'];
                                    request.fields['price'] = args.product.pricePerKg!;
                                    request.fields['product_name'] = args.product.name!;
                                    //request.fields['image'] = "http://10.0.2.2:/shopice/assets/${args.product.image}";
                                    //var pic = await http.MultipartFile.fromPath("image", "http://localhost:/shopice/assets/${args.product.image}");
                                    //File file = "http://10.0.2.2:/shopice/assets/${args.product.image}" as File;
                                    //var pic = await http.MultipartFile.fromString("image", args.product.image!);
                                    //request.files.add(pic);

                                    var bytes = (await rootBundle.load('http://localhost/shopice/assets/${args.product.image}')).buffer.asUint8List();
                                    var mpFile = http.MultipartFile.fromBytes('img', bytes);
                                    request.files.add(mpFile);

                                    var response = await request.send();
                                    print(args.product.image);

                                    if (response.statusCode == 200) {
                                      showModalBottomSheet(context: context, builder: (context){
                                        return Wrap(children: [ListTile(leading: Icon(Icons.done_outline), title: Text('Product Added TO Cart'),)],);
                                      });
                                    }
                                    else if (response.statusCode == 500) {
                                      showModalBottomSheet(context: context, builder: (context){
                                        return Wrap(children: [ListTile(leading: Icon(Icons.done_outline), title: Text('Server Error '),)],);
                                      });
                                    }
                                    else {
                                      showModalBottomSheet(context: context, builder: (context){
                                        return Wrap(children: [ListTile(leading: Icon(Icons.done_outline), title: Text('ERROR WHILE PERFORMING OPPERATION\n CONTACT SUPPORT'),)],);
                                      });
                                    }

                                  }
                                  else if(args.receivedMap.isEmpty){
                                    var snackbar = SnackBar(
                                      content: Text('Login To Add Product To Cart!',
                                          style: TextStyle(fontSize: 16.0)),
                                      backgroundColor:
                                      const Color(0xff4A777A),
                                      padding: EdgeInsets.only(left: 50.0),
                                    );
                                    ScaffoldMessenger.of(context)
                                        .showSnackBar(snackbar);
                                  }

                              },
                              child: Text(
                                'Add to Cart',
                                style: GoogleFonts.poppins(
                                    color: Color(0xff4A777A)),
                              )),

Solution

  • i simply add the image from the backend and forget about doing it with flutter, i moved the image with php and did some trial and error which later worked