How to fix 'Uncaught (in promise) TypeError: Cannot read property 'method' of undefined' in Cloudflare worker?

Question

我正在尝试缓存将由 React Google 地图中的 KML 层调用的图像，以便减少显示图像的延迟并减少使用 Cloudflare Worker 大规模调用 AWS S3。

我已遵循可通过此 link 找到的 Cloudflare 教程：https://workers.cloudflare.com/docs/tutorials/configure-your-cdn/

Cloudflare worker 项目已编译成脚本，控制台提示以下错误。未捕获（承诺）TypeError：无法读取未定义的属性 'method' 未捕获（响应）类型错误：无法读取未定义的属性 'method'

我已经检查了 Cloudflare 生成的脚本的缩小文件，但我无法弄清楚出了什么问题，尽管我努力按照教程进行操作。

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

const BUCKET_NAME = 'nightskybrightness'
const BUCKET_URL = `https://${BUCKET_NAME}.s3.eu-west-3.amazonaws.com`


async function serveAsset(event) {
  const url = new URL(event.request.url)
  const cache = caches.default
  let response = await cache.match(event.request)

  if (!response) {
    response = await fetch(`${BUCKET_URL}${url.pathname}`)
    const headers = { 'cache-control': 'public, max-age=15638400' }
    response = new Response(response.body, { ...response, headers })
    event.waitUntil(cache.put(event.request, response.clone()))
  }
  return response

}


async function handleRequest(event) {
  if (event.request.method === 'GET') {
    let response = await serveAsset(event)
    if (response.status > 399) {
      response = new Response(response.statusText, { status: response.status })
    }
    return response
  } else {
    return new Response('Method not allowed', { status: 405 })
  }
}

预期结果：Cloudflare 会将图像缓存在其 CDN 上，并在最终用户调用时提供它们，从而减少延迟并减少对 AWS S3 的调用。 network/headers 部分中的 cf-cache-status 应指示 HIT 或 MISS。缓存的图像将由 KML 层定位在用户浏览器中的 Google 地图之上。

实际结果：Cloudflare 工作脚本抛出错误，因此没有按预期进行图像缓存。 network/headers 部分中的 cf-cache-status 甚至没有出现在 Response Headers 部分中。

Answer 1

问题是在这一行：

  event.respondWith(handleRequest(event.request))

您正在将 event.request 作为参数传递给 handleRequest()。但是在这条线上：

async function handleRequest(event) {

handleRequest() 被定义为只取 event，而不是 event.request。所以在这条线上：

  if (event.request.method === 'GET') {

您实际上正在访问 event.request.request.method。但是 event.request.request 是 undefined，因此您在尝试访问 undefined.method.

时会遇到异常

我建议将 event.respondWith 行更改为：

  event.respondWith(handleRequest(event))

这是您链接到的示例代码中的样子。

Answer 2

我认为问题的根源在于 CloudFlare 的 Worker Editor Preview 实施。我在 Udacity 的代码 "chore" issue 中找到了线索。

其中 mentions ...

WARNING: Request Attributes do not currently work in the Worker Editor

Preview, resulting in an error: "Uncaught (in response) TypeError: Cannot read property 'country' of undefined."

所以，只是预览中的错误。 “保存并部署”并在真实浏览器中测试 *.worker.dev URL 是否有效。

How to fix 'Uncaught (in promise) TypeError: Cannot read property 'method' of undefined' in Cloudflare worker?

How to fix 'Uncaught (in promise) TypeError: Cannot read property 'method' of undefined' in Cloudflare worker?

javascript

amazon-web-services

kml

cloudflare