使用file_picker抖动将图像上传到Node.js服务器

问题描述

我有一个api，它提供以下数据作为响应:

I have an api which gives the following data as response:

{
    "status": 200,
    "msg": "Data Found",
    "data": {
        "id": 104,
        "firstName": "aaa",
        "lastName": "aaa",
        "surname": "aaa",
        "email": "[email protected]",
        "phone": "090909090",
        "age": "23",
        "gender": "M",
        "height": "163",
        "bloodGroup": null,
        "weight": "72",
        "status": null,
        "fileId": 228,
        "password": "pass",
        "file": {
            "id": 228,
            "filename": "images.jpg",
            "path": "user/images1613558976577.jpg",
            "alt": "shafa care"
        }
    },
    "success": true,
    "token": "some token",
    "userAccess": "some data"
}

文件"响应中的参数用于保存用户上传的图像.对于我的更新方法，用户需要将其令牌作为更新api的标头传递.为了更新文件参数，我尝试了许多不同的方法来更新用户图像.以下代码使用多部分表单数据更新现有文件图像.

The "file" parameter in the response is used to hold the image that the user uploads. For my update method, the user needs to pass their token as header for the update api. For updating the file parameter i have tried many different ways just to update the user image. The below code is using multipart form data to update the existing file image.

Future<AuthModel> updateImage(File imageFile, AuthModel authModel) async{
      final String _accessToken = '${authModel.token}';
  final String url =
      '${GlobalConfiguration().getString('api_base_url')}auth/user/update';

  var stream = new http.ByteStream(imageFile.openRead());
  var length = await imageFile.length();
  var uri = Uri.parse(url);
  var request = new http.MultipartRequest("POST", uri);
  request.headers['Authorization'] = _accessToken;
  // request.headers['Content-Type'] = 'multipart/form-data';
  var multipartFile = new http.MultipartFile('file', stream, length, filename: basename(imageFile.path));
  request.files.add(multipartFile);
  var response = await request.send();
  print("updating: " + response.statusCode.toString());
  response.stream.transform(utf8.decoder).listen((event) {
    currentUser = authModelFromJson(event);
    print("updating img: " + event);
  });
  return currentUser;
}

即使找到数据，上述功能也不会更新我的文件参数.我只是得到了同样的答复.filepicker还发送用户从图库中选择的正确图像路径.我也尝试过使用http.client.post方法，该方法使用令牌作为标头，并使用'file'参数作为正文，但是由于在上载图像时api仅接受表单数据，因此找不到数据.

The above function does not update my file parameter even when the data is found. I just get the same old response. filepicker is also sending the correct image path that the user chooses from the gallery. I have also tried using http.client.post method using a token as the header and 'file' parameter as the body but then data is not found as the api only accepts form-data when an image is being uploaded.

它在邮递员中使用表单数据过帐方法工作.

It works in postman using form-data post method.

我是初学者，仍然在学习.我已经被困在这里好几天了，没有任何解决办法.如何从Flutter应用程序中更新文件参数?感谢您的帮助.

I am new to flutter and still learning. I have been stuck here for days without any solution. How can i update the file parameter from my flutter application? Any help is appreciated.

推荐答案

这是示例代码.希望对您有帮助！

This is sample code. I hope this may help you !

 static Future<bool> uploadFileAsFormData(
      String url, File file) async {
    try {
      var uri = Uri.parse(_buildUrl(url));
      var request = http.MultipartRequest('POST', uri);
      request.files.add(await http.MultipartFile.fromPath('file', file.path));

      var res = await request.send();
      if (res.statusCode == 200) {
        return true;
      } else {

        return false;
      }
    } catch (err) {

      return false;
    }
  }

这篇关于使用file_picker抖动将图像上传到Node.js服务器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！