Multipart form data with vibe.d

Question

I'm trying to submit a multipart form containing an image with vibe.d

My code looks like this:

    auto f = File("image.jpg");
    auto data = new char[f.size];
    f.rawRead(data);

    string boundary = randomUUID.toString.toUpper();

    string h = "--Boundary-" ~ boundary ~ "\r\n";
    h ~= `Content-Disposition: form-data; name="type"` ~ "\r\n\r\n";
    h ~= "photo\r\n";
    h ~= "--Boundary-" ~ boundary ~ "\r\n";
    h ~= `Content-Disposition: form-data; name="photo"; filename="558704D0-2855-4689-996C-F556BE4A3872.jpg"` ~ "\r\n";
    h ~= "Content-Type: image/jpeg\r\n\r\n";
    h ~= data ~ "\r\n";
    h ~= "--Boundary-" ~ boundary ~ "\r\n";
    h ~= `Content-Disposition: form-data; name="photo_ids"` ~ "\r\n\r\n";
    h ~= `["55227F15-36D2-4A04-A4D9-FB23C00627D1"]` ~ "\r\n";
    h ~= "--Boundary-" ~ boundary ~ "\r\n";


    auto response = requestHTTP("https://httpbin.org/anything", (scope req) {
        req.method = HTTPMethod.POST;
        req.headers["content-type"] = "multipart/form-data; boundary=Boundary-" ~ boundary;
        req.headers["content-length"] = to!string(h.length);

        req.bodyWriter.write(h);
    }).bodyReader.readAllUTF8();

    logInfo(response);

but httpbin tells me that I posted nothing:

[main(----) INF] {
[main(----) INF]   "args": {},
[main(----) INF]   "data": "",
[main(----) INF]   "files": {},
[main(----) INF]   "form": {},
[main(----) INF]   "headers": {
[main(----) INF]     "Accept-Encoding": "gzip, deflate",
[main(----) INF]     "Content-Length": "58038",
[main(----) INF]     "Content-Type": "multipart/form-data; boundary=Boundary-76CCC942-83EB-4339-BB6B-2C7D5BF027B6",
[main(----) INF]     "Host": "httpbin.org",
[main(----) INF]     "User-Agent": "vibe.d/1.7.0 (HTTPClient, +http://vibed.org/)"
[main(----) INF]   },
[main(----) INF]   "json": null,
[main(----) INF]   "method": "POST",
[main(----) INF]   "origin": "",
[main(----) INF]   "url": "https://httpbin.org/anything"
[main(----) INF] }

I have no idea what I'm doing wrong. Would appreciate any help

Answer 1

It is radically simpler now with the current version of Vibe.d.

Make sure you state 'multipart/form-data' in the enctype of your form:

form.form-grid(method="post", action="new_employee", enctype="multipart/form-data")

Then a field in that form should include an input field of type 'file', something like this:

input(type="file", name="picture")

In the postNewEmployee() method of your web framework class, get the file through request.files:

auto pic = "picture" in request.files;

Here is a sample postNewEmployee() method being passed an Employee struct:

void postNewEmployee(string _authUser, Employee e)
{
    import std.file;
    import std.path;
    import std.algorithm;
    string photopath = "No photo submitted";
    auto pic = "picture" in request.files;
    if(pic !is null) 
    {
        string ext = extension(pic.filename.name);
        string[] exts = [".jpg", ".jpeg", ".png", ".gif"];
        if(canFind(exts, ext))
        {
            photopath = "uploads/photos/" ~ e.fname ~ "_" ~ e.lname ~ ext;
            string dir = "./public/uploads/photos/";
            mkdirRecurse(dir);
            string fullpath = dir ~ e.fname ~ "_" ~ e.lname ~ ext;
            try moveFile(pic.tempPath, NativePath(fullpath));
            catch (Exception ex) copyFile(pic.tempPath, NativePath(fullpath));
        }
    }
    e.photo = photopath;
    if(e.phone.length == 0) e.phone = "(123) 456 7890";
    if(e.paygd.length == 0) e.paygd = "none yet";
    if(e.postcode.length == 0) e.postcode = "A1A 1A1";
    e.pword = createDigestPassword(realm, e.email, e.pword);
    empModel.addEmployee(e);
    redirect("list_employees");
}

When I tried to learn Vibe.d again, I again became aware of the dearth of tutorials, so I wrote a tutorial myself while everything is fresh as a learner:

https://github.com/reyvaleza/vibed

Hope you find this useful.

Answer 2

Your multipart data is malformed. For the last boundary you have to append a "--" string to indicate the end. So instead of the last

h ~= "--Boundary-" ~ boundary ~ "\r\n";

it needs to be

h ~= "--Boundary-" ~ boundary ~ "--\r\n";`

and then it will work.

See https://www.freesoft.org/CIE/RFC/1521/16.htm

Eventually this should be supported as API inside vibe.d, and there are 2 open PRs for this, but for now you have to work around it like you did.

• https://github.com/vibe-d/vibe.d/pull/1178
• https://github.com/vibe-d/vibe.d/pull/1876