Working with HTTP form-data in a typescript azure function

Question

Currently I'm working on an azure function written in typescript.

The function should be able to handle a form-data received through a POST request. In this request, files and text will be send. How can I work with both?

Right now, I'm using the parse-multipart library, but it only seems to work with the files. Every time I send a file field and a text field, it returns an error.

I also tried using the formidable library, with no success. It expects the request object to have a on method, which the HttpRequest from Azure does not.

The request instance has a method called formData which gets me the both values. However, the file data looks like: { size: 3115398, type: 'image/jpeg', name: 'imageName.jpg', lastModified: 1706633173379 } (no buffer), so I can't work with it.

Any solutions?

Answer 1

Thanks to @anzharip.

This code worked for me. In code we are using @anzp/azure-function-multipart module.

My code

HttpTrigger1/index.ts:

import { AzureFunction, Context, HttpRequest } from "@azure/functions";
import parseMultipartFormData from "@anzp/azure-function-multipart";

const httpTrigger: AzureFunction = async function (
  context: Context,
  req: HttpRequest
): Promise<void> {
  const { fields, files } = await parseMultipartFormData(req);
  context.log("HTTP trigger function processed a request.");
  const name = req.query.name || (req.body && req.body.name);

  const fileContent = files.length > 0 ? Buffer.from(files[0].bufferFile).toString('utf-8') : null;
  const responseMessage = {
    fields,
    files:[
        {
          ...files[0],
          fileContent,
        },
      ],
  };

  context.res = {
    body: responseMessage,
  };
};

export default httpTrigger;

hello.txt:

Hello, this is file data of hello.txt

OUTPUT:

{
  "fields": [
    {
      "name": "Name",
      "value": "Vivek",
      "nameTruncated": false,
      "valueTruncated": false,
      "encoding": "7bit",
      "mimeType": "text/plain"
    }
  ],
  "files": [
    {
      "name": "Testfile",
      "bufferFile": {
        "type": "Buffer",
        "data": [
          72,
          101,
          108,
          108,
          111,
          44,
          32,
          116,
          104,
          105,
          115,
          32,
          105,
          115,
          32,
          102,
          105,
          108,
          101,
          32,
          100,
          97,
          116,
          97,
          32,
          111,
          102,
          32,
          104,
          101,
          108,
          108,
          111,
          46,
          116,
          120,
          116
        ]
      },
      "filename": "hello.txt",
      "encoding": "7bit",
      "mimeType": "text/plain",
      "fileContent": "Hello, this is file data of hello.txt"
    }
  ]
}

Functions:

        HttpTrigger1: [GET,POST] http://localhost:7071/api/HttpTrigger1

For detailed output, run func with --verbose flag.
[2024-01-31T13:44:55.287Z] Host lock lease acquired by instance ID '000000000000000000000000AAE5F384'.
[2024-01-31T13:45:36.816Z] Executing 'Functions.HttpTrigger1' (Reason='This function was programmatically called via the host APIs.', Id=cbd178b7-09f8-4316-b22b-1f8fd5b5a3f0)
[2024-01-31T13:45:37.065Z] HTTP trigger function processed a request.
[2024-01-31T13:45:37.371Z] Executed 'Functions.HttpTrigger1' (Succeeded, Id=cbd178b7-09f8-4316-b22b-1f8fd5b5a3f0, Duration=648ms)