Sending a list of images along with data in http post flutter.

huangapple go评论76阅读模式
英文:

Sending a list of images along with data in http post flutter

问题

我有一组图像和数据(字符串),需要发送到我的后端。这是重要的函数:

Future MakePostPetOfferRequest(
      {required String title,
      required String description,
      required String price,
      required String city,
      required String species,
      required String sex,
      required String ageYears,
      required String ageMonths,
      required String breed,
      required List<File?> images}) async {
    Uri url = Uri.parse('http://$ip/create_sale_post');
    Map<String, dynamic> body = {
      "Title": title,
      "Description": description,
      "City": city,
      "Species": species,
      "Price": price,
      "Sex": sex,
      "Years": ageYears,
      "Months": ageMonths,
      "Breed": breed,
      "images": images,
    };

    var response = await http.post(url, headers: {"cookie": sessionCookie}, body: body);
    if (response.headers['set-cookie'] != null) {
      String initSessionCookie = response.headers['set-cookie']!;
      if (sessionCookie != "") sessionCookie = initSessionCookie.substring(0, initSessionCookie.indexOf(";"));
    }
    return response;
  }

但是我遇到了不同的错误,首先是错误:

类型 'List<File?>' 不是 'String' 类型的子类型

我也不确定如何将图像添加到一个单一字段,就像在 Postman 中这样做:
Sending a list of images along with data in http post flutter.

希望问题清楚,感谢您的帮助。

英文:

I have a list of images and data (string) that I need to send to my backend.
This is the important function:

Future MakePostPetOfferRequest(
      {required String title,
      required String description,
      required String price,
      required String city,
      required String species,
      required String sex,
      required String ageYears,
      required String ageMonths,
      required String breed,
      required List&lt;File?&gt; images}) async {
    Uri url = Uri.parse(&#39;http://$ip/create_sale_post&#39;);
    Map&lt;String, dynamic&gt; body = {
      &quot;Title&quot;: title,
      &quot;Description&quot;: description,
      &quot;City&quot;: city,
      &quot;Species&quot;: species,
      &quot;Price&quot;: price,
      &quot;Sex&quot;: sex,
      &quot;Years&quot;: ageYears,
      &quot;Months&quot;: ageMonths,
      &quot;Breed&quot;: breed,
      &quot;images&quot;: images,
    };

    var response = await http.post(url, headers: {&quot;cookie&quot;: sessionCookie}, body: body);
    if (response.headers[&#39;set-cookie&#39;] != null) {
      String initSessionCookie = response.headers[&#39;set-cookie&#39;]!;
      if (sessionCookie != &quot;&quot;) sessionCookie = initSessionCookie.substring(0, initSessionCookie.indexOf(&quot;;&quot;));
    }
    return response;
  }

But I am faced with different errors, the first is the error:
>type 'List<File?>' is not a subtype of type 'String' in type cast

I also am not sure how I can add the images to one single field, like I do it on Post man here:
Sending a list of images along with data in http post flutter.

I hope the question is clear and thank you for the assistance.

答案1

得分: 2

要上传图片,你应该使用表单数据(formdata)。

import 'package:dio/dio.dart' as formDataMap;

formDataMap.FormData formData = formDataMap.fromMap({
    "Title": title,
    "Description": description,
    "City": city,
    "Species": species,
    "Price": price,
    "Sex": sex,
    "Years": ageYears,
    "Months": ageMonths,
    "Breed": breed
});

for (var file in images) {
    formData.files.addAll([
        MapEntry("images[]", await formDataMap.MultipartFile.fromFile(file.path)),
    ]);
}

这段代码用于创建表单数据,以便上传图像。

英文:

To post image you should use a formdata.

import &#39;package:dio/dio.dart&#39; as formDataMap;

formDataMap.FormData formData = formDataMap.fromMap({
        &quot;Title&quot;: title,
      &quot;Description&quot;: description,
      &quot;City&quot;: city,
      &quot;Species&quot;: species,
      &quot;Price&quot;: price,
      &quot;Sex&quot;: sex,
      &quot;Years&quot;: ageYears,
      &quot;Months&quot;: ageMonths,
      &quot;Breed&quot;: breed
      });
      for (var file in images) {
        formData.files.addAll([
          MapEntry(&quot;images[]&quot;,
              await formDataMap.MultipartFile.fromFile(file.path)),
        ]);
      }

答案2

得分: 0

我已找到一个方法来实现这个,而且它非常简单,只使用了内置的 *http.MultipartRequest()* 方法。

Uri url = Uri.parse('http://$ip/create_sale_post');
var request = http.MultipartRequest('POST', url);

for (var i = 0; i &lt; images.length; i++) {
  var image = await http.MultipartFile.fromPath(
    'images',
    images[i]!.path,
  );
  request.files.add(image);
}
request.headers['cookie'] = sessionCookie;
request.fields["Title"] = title;
request.fields["Description"] = description;
request.fields["City"] = city;
request.fields["Species"] = species;
request.fields["Price"] = price;
request.fields["Sex"] = sex;
request.fields["Years"] = ageYears;
request.fields["Months"] = ageMonths;
request.fields["Breed"] = breed;
request.headers['Content-Type'] = 'multipart/form-data';

var response = await request.send();

<details>
<summary>英文:</summary>

I have found a way to do it, and it is fairly simple, using no third party packages, only the built in *http.MultipartRequest()* method.

Uri url = Uri.parse(&#39;http://$ip/create_sale_post&#39;);
var request = http.MultipartRequest(&#39;POST&#39;, url);

for (var i = 0; i &lt; images.length; i++) {
  var image = await http.MultipartFile.fromPath(
    &#39;images&#39;,
    images[i]!.path,
  );
  request.files.add(image);
}
request.headers[&#39;cookie&#39;] = sessionCookie;
request.fields[&quot;Title&quot;] = title;
request.fields[&quot;Description&quot;] = description;
request.fields[&quot;City&quot;] = city;
request.fields[&quot;Species&quot;] = species;
request.fields[&quot;Price&quot;] = price;
request.fields[&quot;Sex&quot;] = sex;
request.fields[&quot;Years&quot;] = ageYears;
request.fields[&quot;Months&quot;] = ageMonths;
request.fields[&quot;Breed&quot;] = breed;
request.headers[&#39;Content-Type&#39;] = &#39;multipart/form-data&#39;;

var response = await request.send();

</details>



huangapple
  • 本文由 发表于 2023年4月4日 08:32:19
  • 转载请务必保留本文链接:https://go.coder-hub.com/75924657.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定