Malformed UTF-8 Characters Error When Passing Headers to fetch

Compute
1

Good Day Fastly Community,

I am doing some learning/testing work to better understand how to use Fastly Compute. I’ve run into an issue where, when I try to copy over the headers from the request, I get the following error:

Error while running request handler: malformed UTF-8 character sequence at offset 1
Stack:
handleRequest@:2112:11
async*bin/index.js/<@:1998:66

If I pass something like headers: new Headers({"some-header": "header-1"}) to fetch it does not throw an error, it’s only when I try to programmatically copy them over. I’ve attach a screen-shot of the Javascript.

I am doing this testing locally using “fastly compute serve --watch”.

Any idea what could be going on here?

image
image974×343 18.6 KB

2

Hiya,

I think the issue might be something to do with your type conversion, which is really not necessary. Try this:

https://fiddle.fastly.dev/fiddle/320d0cb3

3

Hi triblondon,

Thanks for helping with this.

I tried removing those toString() calls and it did not resolve the issue. I also tried to trigger the error by making a new Headers object with some random entries and then copying it like I have been doing, but this does not cause the error:

image
image862×338 20 KB

I also tried doing things with a Map object like this and got the same error:

let mappedHeaders = new Map();

    logMessage("ATTACHING HEADERS----------------:")
    for (const headerKey of req.headers.keys()) {
      mappedHeaders.set(headerKey, req.headers.get(headerKey));
      logMessage("HEADER KEY: ".concat(headerKey).concat(" ---> ").concat(req.headers.get(headerKey)));
    }

    for(const item of mappedHeaders)
    {
      logMessage(item);
    }

    let backendResponse = await fetch(backendPathAndParams, {
      method: "GET",
      backend: "backend_e",
      headers: mappedHeaders,
    })

For reference this is what the outputs are from the map, I don’t see anything which is malformed/not UTF-8?

Log: ["host", "127.0.0.1:7676"]
Log: ["user-agent", "Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:124.0) Gecko/20100101 Firefox/124.0"]
Log: ["accept", "text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,*/*;q=0.8"]
Log: ["accept-language", "en-US,en;q=0.5"]
Log: ["accept-encoding", "gzip, deflate, br"]
Log: ["connection", "keep-alive"]
Log: ["upgrade-insecure-requests", "1"]
Log: ["sec-fetch-dest", "document"]
Log: ["sec-fetch-mode", "navigate"]
Log: ["sec-fetch-site", "none"]
Log: ["sec-fetch-user", "?1"]

Are there any flags I can pass to the Fastly CLI to see exactly what it’s trying to parse? Or have it emit more information about the error?

4

Hmm. Are you sure it’s the headers that cause the problem? I’d probably suggest removing the headers key from the fetch options and check that there’s no error to ensure it is the headers that are triggering the fetch error.

(If it’s not the headers it might be the URL)

Another thing to try is to build the map with a limited number of headers in it (start with 1 and increase :grinning:) so you can find out which header is causing the problem, or if it’s just any header that does it

5

Hey triblondon,

The error only occurs when I pass the headers via a new/copied collection. I also tried something similar to your suggestion, adding in headers manually 1-by-1 to see what happens and I could not replicate the error.

I am using a very slightly out of date Fastly CLI client, so I will update that and see what happens.