Skip to content

How to mock a Server Sent Events (SSE) service

Jump to bottom Edit New page
Lloyd Brookes edited this page Jul 6, 2021 · 3 revisions

Creating an SSE service with a middleware module is straight forward.

This example responds to any request for /sse with a persistent SSE stream. The body of the response (ctx.body) is set to a stream which is fed a random number every ten seconds. If the client disconnects, the interval is cleared and the SSE stream ended.

class SSE {
  middleware () {
    const router = require('koa-route')
    return [
      router.get('/sse', ctx => {
        ctx.body = new require('stream').PassThrough()
        ctx.type = 'text/event-stream'
        ctx.set('Cache-Control', 'no-cache')
        ctx.set('Connection', 'keep-alive')

        const interval = setInterval(() => {
          const randomNumber = parseInt(Math.random() * 10)
          ctx.body.write(`event: number\n`)
          ctx.body.write(`data: ${randomNumber}\n\n`)
        }, 1000)

        function finished () {
          clearInterval(interval)
          ctx.body.end()
        }

        ctx.req.on('close', finished)
        ctx.req.on('finish', finished)
        ctx.req.on('error', finished)
      }),
    ]
  }
}

export default SSE

Save the above middleware module as sse-mock.js then launch a server.

$ ws --stack sse-mock.js

Try this simple client example.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>SSE Client Example</title>
  </head>
  <body>
    <h1>SSE Client Example</h1>

    <script>
      const eventSource = new EventSource('sse')
      eventSource.addEventListener('number', function (e) {
        console.log('number event:', e.data)
      })
    </script>
  </body>
</html>
Add a custom footer
Add a custom sidebar
Clone this wiki locally