How to get filename in multipart post request using Dart/Aqueduct

Question

I am trying to upload image from client (flutter) to server (Aqueduct.io) using MultipartRequest. It's working, but currently file names are assigned the current time, how can I pass the filename from a client and parse it on a server side?

Client code:

    final String imageName = nameController.text.replaceAll(" ", "");
    var postUri = Uri.parse("http://***:8888/media");
    var request = new http.MultipartRequest("POST", postUri);
    request.files.add(new http.MultipartFile.fromBytes('file', image,
        filename: imageName, contentType: MediaType('image', 'jpeg')));

    request.send().then((response) {
      if (response.statusCode == 200) print("Uploaded!");
    });
  }

Server code:

import 'dart:async';
import 'dart:io';

import 'package:aqueduct/aqueduct.dart';
import 'package:mime/mime.dart';
import 'package:http_server/http_server.dart';

class MediaController extends ResourceController {
  MediaController() {
    acceptedContentTypes = [ContentType("multipart", "form-data")];
  }

  @Operation.post()
  Future<Response> postMultipartForm() async {
    final transformer = MimeMultipartTransformer(
        request.raw.headers.contentType.parameters["boundary"]);

    final bodyStream =
        Stream.fromIterable([await request.body.decode<List<int>>()]);
    final parts = await transformer.bind(bodyStream).toList();

    for (var part in parts) {
      final HttpMultipartFormData multipart = HttpMultipartFormData.parse(part);

      final content = multipart.cast<List<int>>();

      final filePath =
          "public/" + DateTime.now().millisecondsSinceEpoch.toString() + ".jpg"; // <---current filename implementation

      final IOSink sink = File(filePath).openWrite();
      await for (List<int> item in content) {
        sink.add(item);
      }
      await sink.flush();
      await sink.close();
    }

    return Response.ok({});
  }
}

score 2 · Accepted Answer · answered Mar 10 '20 at 20:55

Okay, I have the asnwer

import 'dart:async';
import 'dart:io';

import 'package:aqueduct/aqueduct.dart';
import 'package:mime/mime.dart';
import 'package:http_server/http_server.dart';

class MediaController extends ResourceController {
  MediaController() {
    acceptedContentTypes = [ContentType("multipart", "form-data")];
  }

  @Operation.post()
  Future<Response> postMultipartForm() async {
    final transformer = MimeMultipartTransformer(
        request.raw.headers.contentType.parameters["boundary"]);

    final bodyStream =
        Stream.fromIterable([await request.body.decode<List<int>>()]);
    final parts = await transformer.bind(bodyStream).toList();

    for (var part in parts) {
      final HttpMultipartFormData multipart = HttpMultipartFormData.parse(part);

      List<String> tokens = part.headers['content-disposition'].split(";");
      String filename;
      for (var i = 0; i < tokens.length; i++) {
        if (tokens[i].contains('filename')) {
          filename = tokens[i]
              .substring(tokens[i].indexOf("=") + 2, tokens[i].length - 1);
        }
      }
      print('file $filename.jpg uploaded');

      final content = multipart.cast<List<int>>();

      final filePath =
          // "public/" + DateTime.now().millisecondsSinceEpoch.toString() + ".jpg";
          'public/$filename.jpg';

      final IOSink sink = File(filePath).openWrite();
      await for (List<int> item in content) {
        sink.add(item);
      }
      await sink.flush();
      await sink.close();
    }

    return Response.ok({});
  }
}

How to get filename in multipart post request using Dart/Aqueduct

1 Answers1