用 Cloudflare worker 注入 HTML

Question

我正在尝试使用 HTMLRewriter 将预加载 <link> 注入我网站上的网页，但没有任何反应。

我使用的代码是：

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

class ElementHandler {
  element(element) {
    element.append(`<link rel="preload" href="path/to/image.jpg" as="image">`, {html: true});
  }
}

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

我和 Cloudflare 的人谈过，他们看不出有什么问题，但它仍然无法正常工作。 <link> 不存在。

Answer 1

确保在路线部分设置了您要到达的路线。路线部分可以在您的域 > 工作人员 > 添加路线下找到

我希望我能 post 图片，但这是我使用您的代码片段编写的指南，用于将样式注入名为 FoundryVTT 的应用程序：https://dev.to/mbround18/how-to-hijack-your-head-38dn

用 Cloudflare worker 注入 HTML

Inject HTML with Cloudflare worker

html

javascript

cloudflare-workers