Service Workers:在获取请求时获取xhr主体

Question

我如何从xhr (XMLHttpRequest)发送(body)调用中检索我发送的主体?我的xhr变量是一个XMLHttpRequest，准备使用POST方法调用内部url(例如:/path/api)

xhr.send("a=1");

在另一边，我实现了一个Service Worker，并创建了一个处理程序来捕获所有的获取请求

self.addEventListener('fetch', function(event, body) 
{ 
event.respondWith( //Check content of event.request.body to run the right action );
}

我可以检索事件的一些属性。请求作为event.request。url，但我无法找到方法来检索我原来的xhr身体(即。"一个= 1")。

有趣的是，当Service Worker处理这个请求，并调用网络来获取结果时，

return fetch(event.request);

服务器可以访问body数据。

下面是我在SW取回方法中收到的Request对象的摘录

Request {method: "POST", url: "http://localhost/services", headers: Headers
, referrer: "http://localhost/m1/", referrerPolicy: "no-referrer-when-downgrade"…}
bodyUsed:false
credentials:"include"
headers:Headers
  __proto__:Headers
integrity:""
method:"POST"
mode:"cors"
redirect:"follow"
referrer:"http://localhost/path/"
referrerPolicy:"no-referrer-when-downgrade"
url:"http://localhost/path/api"

关于如何在Service Worker fetch()捕获中检索发送请求的内容/正文，有什么建议吗?

谢谢!

Answer 1

这对大多数人来说可能是显而易见的，但我想在回应中添加一些注释，以防将来有人遇到我同样的情况。

有几种方法可以从请求中检索正文，这取决于正文是如何发送的

event.request.arrayBuffer()
event.request.blob()
event.request.json()
event.request.text()
event.request.formData()

这些方法中的任何一个都将返回一个Promise，其中将包含body内容。瞧!

我还要感谢Nikhil Marathe (https://hacks.mozilla.org/2015/03/this-api-is-so-fetching/)帮助我理解这一切是如何工作的。