How to post an image with form-data in Rest Client for VSCode

Question

The documentation for the VSCode Rest Client is lacking good explinations. Here is what they give as an example.

POST https://api.example.com/user/upload
Content-Type: multipart/form-data; boundary=----WebKitFormBoundary7MA4YWxkTrZu0gW

------WebKitFormBoundary7MA4YWxkTrZu0gW
Content-Disposition: form-data; name="text"

title
------WebKitFormBoundary7MA4YWxkTrZu0gW
Content-Disposition: form-data; name="image"; filename="1.png"
Content-Type: image/png

< ./1.png
------WebKitFormBoundary7MA4YWxkTrZu0gW--

Not sure what the < is for nor the title?

Answer 1

For the boundary part, I recomend read this post.

< It´s a symbol to indicate input stream, the file you want to send needs to be in the same directory as the .rest file that the restclient extension uses.

Quick response: boundary is to define where each pair of fields passed in the form is begins and ends. In your example there are two form fields, text="title" and image=1.png the bytes image sequence.

------WebKitFormBoundary7MA4YWxkTrZu0gW
Content-Disposition: form-data; name="image"; filename="1.png"
Content-Type: image/png

< ./1.png
------WebKitFormBoundary7MA4YWxkTrZu0gW--

Other data such as filename="1.png" or Content-Type: image/png indicate additional information that the form loads by default when you select an image with a file type input.

Another example for a field description.

------WebKitFormBoundary7MA4YWxkTrZu0gW
Content-Disposition: form-data; name="description"

All text of description.
------WebKitFormBoundary7MA4YWxkTrZu0gW