最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Cloudflare Workers - SSE - Stack Overflow

programmeradmin0浏览0评论

Is there a way to do server-side-events with cloudflare workers? I've only found one way but it'll stop right after returning the response.

    const { readable, writable } = new TransformStream();
    const response = {
      headers: new Headers({
        'Content-Type': 'text/event-stream',
        'Cache-Control': 'no-cache',
        'Access-Control-Allow-Headers': 'Origin, X-Requested-With, Content-Type, Accept',
        Connection: 'keep-alive',
      }),
      status: 101
    };

    setInterval(() => {
      const encoder = new TextEncoder();
      const writer = writable.getWriter();
      writer.write(encoder.encode(`data: hello\n\n`));
    }, 5000);

    return new Response(readable, response);

Is there a way to do server-side-events with cloudflare workers? I've only found one way but it'll stop right after returning the response.

    const { readable, writable } = new TransformStream();
    const response = {
      headers: new Headers({
        'Content-Type': 'text/event-stream',
        'Cache-Control': 'no-cache',
        'Access-Control-Allow-Headers': 'Origin, X-Requested-With, Content-Type, Accept',
        Connection: 'keep-alive',
      }),
      status: 101
    };

    setInterval(() => {
      const encoder = new TextEncoder();
      const writer = writable.getWriter();
      writer.write(encoder.encode(`data: hello\n\n`));
    }, 5000);

    return new Response(readable, response);
Share Improve this question edited Dec 30, 2020 at 9:46 Tector asked Dec 30, 2020 at 9:30 TectorTector 212 silver badges3 bronze badges 1
  • Sorry I forgot to include a interval, so I updated it! – Tector Commented Dec 30, 2020 at 9:47
Add a ment  | 

1 Answer 1

Reset to default 11

There are two problems with your example code:

  • You should not set status code 101. Status code 101 means "switching protocols", i.e. the server is going to begin speaking something other than HTTP. This is used, for example, with WebSockets. But, your example code doesn't use a different protocol -- it's just regular HTTP with a streaming response body. The Workers runtime does not support switching protocols except to WebSocket, so it will refuse to serve your 101 status code, and will instead serve an error to the client.
  • You are calling getWriter() on every interval, but you can only have one Writer, so on intervals after the first, the call fails. You should instead call getWriter() once before setting the interval, then reuse that writer.

Both of these problems show up as errors in the JavaScript console when running your code in the preview (e.g. on cloudflareworkers., or in the Cloudflare dashboard, or using wrangler preview or wrangler dev). I remend using the preview to debug your code, as it can tell you about errors that are invisible to the client.

The following code works for me in the preview -- text gets added to the response every 5 seconds as expected:

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

async function handleRequest(request) {
  const { readable, writable } = new TransformStream();
  const encoder = new TextEncoder();
  const writer = writable.getWriter();
  setInterval(() => {
    writer.write(encoder.encode(`data: hello\n\n`));
  }, 5000);

  return new Response(readable);
}
发布评论

评论列表(0)

  1. 暂无评论