使用base64Encode将图像上传到服务器失败

Question

I use image picker to get photo from camera then upload it to the server with base64Encode, like this

http.post( api('file/update_pic_item/2'), body: data, headers: {HttpHeaders.authorizationHeader: prefs.getString('token'), "Accept": "application/json", "Content-Type": "application/x-www-form-urlencoded"}).then((response) async {
      toast('Success');
      Map res = json.decode(response.body); print(res);
});

By server I got this message

The pic1 must be an image., The pic1 must be a file of type: jpeg, jpg, bmp, png

I use lumen for my backend,

$this->validate($request, [
            'pic1' => 'nullable|image|mimes:jpeg,jpg,bmp,png|max:10240', ]);
        $upload_path = 'images/items';

        if ($request->hasFile('pic1')) {
            $pic1 = $request->file('pic1');
            $ext1 = $pic1->getClientOriginalExtension();
            if ($pic1->isValid()) {
                $pic_name = Carbon::now()->format('YmdHs') . "a." . $ext1;
                $pic1->move($upload_path, $pic_name);
                $item->update(['pic1' => $pic_name]);
            }
        }

How to solve this problem? thank you so much for your help

Answer 1

Use this code to upload image on server

Future upload(File imageFile)async{
      var stream= new http.ByteStream(DelegatingStream.typed(imageFile.openRead()));
      var length= await imageFile.length();
      var uri = Uri.parse('imageUrl');
      var request = new http.MultipartRequest("POST", uri);
      var imageUri = 'salati_${widget.user.user_id}_${DateTime.now().millisecondsSinceEpoch}'+imageFile.path.substring(imageFile.path.lastIndexOf("."));
      var multipartFile = new http.MultipartFile("image", stream, length, filename: basename(imageUri));
      request.files.add(multipartFile);
      var response = await request.send();
      if(response.statusCode==200){
        print("Image Uploaded");
      }else{
        print("Upload Failed");
      }
    }