如何在flutter上傳圖片

Question

你好，我想在 flutter 上傳圖片

我嘗試像這樣使用 http.MultipartRequest

  request.fields["name"] = "$RegisterName";
  request.fields["description"] = "$RegisterDescription";
  request.fields["caution"] = "$RegisterCaution";
  request.fields["price"] = "$RegisterPrice";
  request.fields["price_prop"] = "$RegisterPriceProp";
  request.fields["user.id"] = "1";
  request.fields["lend"] = "$RegisterCategory";
  request.fields["category"] = "Digital";
  request.fields["place_option"] = "true";

  var multipartFile = http.MultipartFile.fromBytes(
    'file',
    (await rootBundle.load('assets/images/main_1.jpg')).buffer.asUint8List(),
    filename: 'test01.jpg',
    contentType: MediaType('image', 'jpg'),
  );

  request.files.add(multipartFile);
  

  var response = await request.send();

  if (response.statusCode == 200) print('Upload');
}

但是如果我使用這段代碼，這段代碼不起作用，只上傳另一個數據上傳東西

那么 json 類型就是這個json 類型圖像

我想上傳圖片文件...:(

Answer 1

我用它來發送帶有formData的圖片

var head = Api().bearerHeader; ////just bearerToken
var request = http.MultipartRequest(
    'POST',
    Uri.parse(
        'https://c.....'));
request.files
    .add(await http.MultipartFile.fromPath('TITLEOFFORMDATA', imageFile.path));
request.headers.addAll(head);

http.StreamedResponse response = await request.send();

if (response.statusCode == 200) {
  String varo = await response.stream.bytesToString();
}

Answer 2

這就是您可以使用MultipartRequest將圖像發送到服務器的方法，其中http package

 try {
    final uri = Uri.parse(your_url);

    final request = http.MultipartRequest('POST', uri);

    final multipartFile =
        await http.MultipartFile.fromPath('Image', 'your_path_of_image'); // Image is the parameter name 

    request.files.add(multipartFile);

    request.fields['userId_if_required'] = value;

    final response = await request.send();
    if (response.statusCode == 200) {
      print('success');
    } else {
      print('Something went wrong');
    }
  } catch (e) {
    print('Something went wrong');
  }

Answer 3

如何將您的圖像上傳到 Django rest API 服務器這肯定有效，如果您有任何問題，請告訴我。 請務必將必要的包添加到您的 pubspec.yaml 文件中

image_picker http

如果有一些我錯過了請問我或添加它並添加為回復

import 'dart:convert';
import 'package:http/http.dart' as http;
import 'dart:io';
import 'package:get/get.dart';
import 'package:image_picker/image_picker.dart';

final _picker = ImagePicker();
File? _image;

// use this to send your image
Future<void>uploadImage(filePath) async {
    // your token if needed
    try{
    var headers = {
        'Authorization':
                'Bearer ' + "token",
    };
    // your endpoint and request method
    var request = http.MultipartRequest(
        'POST',
        Uri.parse("https://api.imgur.com/3/image"));

    request.fields
            .addAll({'yourFieldNameKey1': 'yourFieldNameValue1', 'yourFieldNameKey2': 'yourFieldNameValue2'});
        request.files.add(await http.MultipartFile.fromPath(
            'yourPictureKey', filePath));
    request.headers.addAll(headers);

    http.StreamedResponse response = await request.send();

    if (response.statusCode == 200) {
        print(await response.stream.bytesToString());
    } else {
        print(response.reasonPhrase);
    }
    }catch(e){
        print(e);
    }
}

// 用它來選擇你的圖像

Future<void> _openImagePicker() async {
    try {
        var pickedImage = await _picker.pickImage(source: ImageSource.gallery);
        if (pickedImage != null) {
            setState(() {
                _image = File(pickedImage.path);
            });
            uploadImage(pickedImage.path);
        }
    } catch (e) {
      //print(e);
    }
}