时间戳

首页 > 解决方案 > 如何在 Cloudflare 工作脚本中使用 ES6 导出？

javascript - 如何在 Cloudflare 工作脚本中使用 ES6 导出？

问题描述

我正在尝试熟悉 CloudFlare 工作人员。

我通过以下方式从https://developers.cloudflare.com/workers/get-started/quickstarts复制了一个快速启动项目：

wrangler generate my-app https://github.com/cloudflare/worker-template

这给了我一个 JS 文件，它监听“fetch”并返回一个Responsevia handleRequest：

addEventListener('fetch', event => {
  event.respondWith(handleRequest(event.request))
})

async function handleRequest(request) {
  return new Response('Hello worker!', {
    headers: { 'content-type': 'text/plain' },
  })
}

好的，这是有道理的。

现在我想包含Cloudflare 的一个示例

export default {
  fetch() {
    const html = `<!DOCTYPE html>
      <body>
        <h1>Hello World</h1>
        <p>This markup was generated by a Cloudflare Worker.</p>
      </body>
    `;
    return new Response(html, {
      headers: {
        "content-type": "text/html;charset=UTF-8",
      },
    });
  },
};

这意义不大。我应该用它替换所有原始代码吗？如果我这样做，我会收到以下错误wrangler publish：

错误：对 Cloudflare 的请求出现问题...未注册事件处理程序。这个脚本什么都不做。

我应该以某种方式将它们捣碎在一起吗？如何？是否有我缺少的步骤或配置？

标签： javascriptcloudflare-workers

解决方案

您问题中的两个代码片段使用了 Workers 支持的两种不同语法：Service Workers 语法和 ES Modules 语法。addEventListener与 Service Workers 语法一起使用，这是 Workers 支持的原始语法。最近，Workers 增加了对新的基于 ES 模块的语法的支持，用于export default导出处理程序。这种新语法避免了一些样板文件（并不奇怪event.respondWith()）并具有其他一些优点。

您需要在您wrangler.toml使用的语法中指定。要使用模块语法，您需要添加：

[build.upload]
format = "modules"
main = "./worker.mjs"

在此处查看更多文档。

推荐阅读