플러터로 앱 개발중에 서버에 파일을 전송해야 할 일이 생겼다. 일주일을 삽질했지만 다른분이 30분도 안걸려서 해결해주었다..

패키지 설치

api서버에서 form-data형태로 파일을 받게 해두었기 때문에 http가 아닌 dio를 활용해 보았다.

https://pub.flutter-io.cn/packages/file_picker

https://pub.flutter-io.cn/packages/dio

위 두 패키지를 설치해 주시면 됩니다.

코드

서버에 보내는 메서드

postFile(List<File> files) async {
    final url = 'YOUR_API';
    
        FormData formData = FormData.fromMap({
          "attachments": files,
        });

      var dio = new Dio();
        
        try {
          var response = await dio.post(
            url,
            data: formData,
          );
        
          print("응답" + response.data.toString());
        } catch (eee) {
          print(eee.response);
          print(eee.message);
          print("error occur");
        }
  }
  
  버튼을 클릭시 filePicker를 이용해서 파일을 선택할수 있게 해주는 코드
  
   onPressed: ()  async {
            print('사진추가');
            FilePickerResult result = await FilePicker.platform.pickFiles(allowMultiple: true);

            if(result != null) {
              List<File> files = result.paths.map((path) => File(path)).toList();
              return pickFiles;
            } else {
              // User canceled the picker
            }
          },
          
아래 코드를 실행시 파일을 서버로 전송하게 됩니다.
onTap:(){
         postNotice(pickFiles);
}

          

코드 설명

매우 간단합니다. posfFile 이라는 메서드는 Dio를 활용하여 매우 편하게 form-data형태로 서버에 post할수 있게 해줍니다.

onPressed로 클릭시 FilePicker로 사진을 선택할 수 있게 해줍니다.

그리고 postNotice 메서드를 실행하게 되면 선택한 파일을 서버에 보내게 됩니다.

매우 간단하게 서버에 파일을 보낼수 있습니다.