将表单数据发布到服务器颤振

Posted 2023-02-23

【中文标题】将表单数据发布到服务器颤振

【英文标题】：Post form data to server flutter

【发布时间】：2020-06-14 09:14:46

【问题描述】：

我在向服务器发送post 请求时遇到了很多麻烦。它需要 form data 类型。

这是我输入后得到的错误。

  `image: [The image must be an image.]

我的大部分数据都是字符串，除了 int 和 file Image 由用户从图库中选择。

这是我的代码：

飞镖代码

if(_image!=null)
      setState(() 
        _isLoading = true;
      );
        SharedPreferences sharedPreferences = await SharedPreferences.getInstance();
        var uri = NetworkUtils.host +
            AuthUtils.updateSessionRequest;
        Map<String, String> data = "_method": "PATCH",
          "first_name": widget.first_name,
          "last_name": widget.last_name,
          "phone": widget.phone,
        "industry":widget.industry,
        "country": widget.country,
        "state": widget.state,
        "fav_quote": widget.fav_quote,
        "bio_interest": widget.bio_text,
        "terms": "1",
        "company": widget.company,
        "position": widget.job_position,
        "linked_in":widget.linkedin_profile,
        "institution": widget.institution,
        "degree": widget.degree,
        "preference[0]": widget.industry;
        String authToken = sharedPreferences.getString("token");
        try 
          final response = await http.post(
            uri,
            body: data,
            headers: 
              'Accept': 'application/json',
              'Authorization': 'Bearer ' + authToken,
            ,
          );

          final responseJson = json.decode(response.body);
          print(responseJson.toString());
          if (response.statusCode == 200 || response.statusCode == 201)  
       //upload image to server after success response
       uploadImage(_image);
              NetworkUtils.showToast("Profile successfully update!");
            );
           else
            setState(() 
              _isLoading = false;
            );
            NetworkUtils.showSnackBar(_scaffoldKey, 'An error occurred. Please try again');
          
          return responseJson;
         catch (exception) 
          print(exception.toString());
          setState(() 
            _isLoading = false;
          );
          NetworkUtils.showSnackBar(_scaffoldKey, 'An error occurred. Please try again');
        
     

 uploadImage(File image) async
    var request = http.MultipartRequest(
        "POST",
        Uri.parse(NetworkUtils.host +
            AuthUtils.endPointUpdateProfile));
    request.files.add(await http.MultipartFile.fromPath(
      'image',
      image.path,
    ));

    try 
    var streamedResponse = await request.send();
    var response = http.Response.fromStream(streamedResponse);
    return response;
     catch (e) 
    rethrow;
    
  
  

【问题讨论】：

尝试打印出值uri

uri 是正确的。错误来自数据内的 _image am 设置

请再次检查我在问题中的错误信息

你的头像是List?

不。它是用户个人资料的单个图像

【参考方案1】：

你需要像这样传递你的图像

request.files.add(await http.MultipartFile.fromPath(
        'image',
        _image,
      ));

这里是一个如何使用http传递文件和字符串的例子

 var request = http.MultipartRequest(
              "POST",
              Uri.parse("http://....."));
          request.fields['first_name'] = widget.first_name;
          request.fields['last_name'] = widget.last_name;
                   .....
          request.files.add(await http.MultipartFile.fromPath(
            'image',
            path,
          ));

try 
      var streamedResponse = await request.send();
      var response = http.Response.fromStream(streamedResponse);
      return response;
     catch (e) 
      rethrow;
   

【讨论】：

感谢您。那么我要从表单数据主体中删除“图像”属性吗？

“图像”是您要传递给服务器的参数的名称。

请告诉我们您的最新代码和最新错误。

您是否尝试过使用其他测试api工具来测试API是否正常工作？

是的。它的工作。因为我的 formData 中的其他值被发布到服务器，除了图像。

【参考方案2】：

仅从上面，稍作修改

import 'dart:async';
import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;

void executePostMethod(String title) async 
  var request = http.MultipartRequest("POST", Uri.parse("https://localhost:44377/API/GetStateList"));
  request.fields['CountryID'] = "1";
  //          .....
  //request.files.add(await http.MultipartFile.fromPath('image',path,)
  //);

   // send request to upload image
    await request.send().then((response) async 
     //print(response);

     response.stream.transform(utf8.decoder).listen((value) async 
        print(value);
        // print("ResponseVal: $value");
        if (response.statusCode == 200) 
          var imgUploadData = json.decode(value);
          print(imgUploadData);          
         else 
          throw Exception("Faild to Load!");
        
      );
    ).catchError((e) 
      print(e);
    );