Javascript fetch fails to read Multipart response from GMail API Batch request

I need to use GMail API to retrieve multiple emails data so I am using Batch API. I could finally craft a good enough request but the problem is Javascript doesn’t seem to properly parse the response. Note that this is pure browser Javascript, I am not using any server.

Please refer the code below. The request/response was good upon inspection, but at the line where I call r.formData() method, I receive this error with no further explanation:

TypeError: Failed to fetch

    async getGmailMessageMetadatasAsync(ids: string[], token: string): Promise<IGmailMetaData[]> {
        if (!ids.length) {
            return [];
        }

        const url = `https://gmail.googleapis.com/batch/gmail/v1`;

        const body = new FormData();
        for (let id of ids) {
            const blobContent = `GET /gmail/v1/users/me/messages/${encodeURI(id)}?format=METADATA`;
            const blob = new Blob([blobContent], {
                type: "application/http",
            });

            body.append("dummy", blob);
        }

        const r = await fetch(url, {
            body: body,
            method: "POST",
            headers: this.getAuthHeader(token),
        });

        if (!r.ok) {
            throw r;
        }

        try {
            const content = await r.formData(); // This won't work

            debugger;
            for (let key of content) {

            }
        } catch (e) {
            console.error(e);
            debugger;
        }
        

        return <any>[];
    }

If I replace r.formData() with r.text(), it works but then I have to parse the text by myself which I don’t think is good. The response has correct content-type: multipart/form-data; boundary=batch_HViQtsA3Z_aYrPoOlukRFgkPEUDoDh23 and the body looks like this:

"
--batch_HViQtsA3Z_aYrPoOlukRFgkPEUDoDh23
Content-Type: application/http
Content-ID: response-

HTTP/1.1 200 OK
Content-Type: application/json; charset=UTF-8
Vary: Origin
Vary: X-Origin
Vary: Referer

{
  "id": "1778c9cc9345a9f4",
  "threadId": "1778c9cc9345a9f4",
  "labelIds": [
    "IMPORTANT",
    "CATEGORY_PERSONAL",
    "INBOX"
  ],

<More content>

How do I properly parse this response and get the JSON content of each email?

Leave a Comment