Inject HTML with a worker

Developers Workers
1

I’m totally new to workers and am trying to add a preload link into a site to test the effect on LCP. What is wrong with this code? Nothing is happening on the site and the HTTP panel that I can use to send a request says my worker URL is 404.

addEventListener("fetch", (event) => {
  event.respondWith(
    handleRequest(event.request).catch(
      (err) => new Response(err.stack, { status: 500 })
    )
  );
});

class ElementHandler {  
  element(element) {    
    // An incoming element, such as `div`    
    element.append(`<link re="preload" href="path/to/image.jpg" as="image" type="image/jpeg">`, {html: true});
  }
}

async function handleRequest(req) {  
  const res = await fetch(req)
  return new HTMLRewriter().on("head", new ElementHandler()).transform(res)
}
2

Just noticed the typo, that’s not the issue. I can’t see how to edit the question.

3

Have you been able to inject your html?

@derek10 3