Support Server-Sent Events (SSE) with adapter-node

Describe the bug While migrating a sapper app to svelte-kit / adapter-node, I came across a feature that seems to be missing. Namely, the ability to create custom middleware that can handle Server-Sent Events or other long-lived connections that send data to the response stream without closing the connection. Since the handle hook requires returning Response | Promise<Response>, thus closing the connection, it does not support this. Nor have I found any other way to res.write(); using endpoints.

Information about your SvelteKit Installation:

Diagnostics

System:
    OS: Linux 4.4 Ubuntu 20.04.1 LTS (Focal Fossa)
    CPU: (8) x64 Intel(R) Core(TM) i7-4770 CPU @ 3.40GHz
    Memory: 7.97 GB / 15.94 GB
    Container: Yes
    Shell: 5.0.17 - /bin/bash
Binaries:
    Node: 14.5.0 - ~/.nvm/versions/node/v14.5.0/bin/node
    npm: 6.14.5 - ~/.nvm/versions/node/v14.5.0/bin/npm
npmPackages:
    @sveltejs/kit: ^1.0.0-next.68 => 1.0.0-next.68
    svelte: ^3.37.0 => 3.37.0
    vite: ^2.1.5 => 2.1.5

• Using node-adapter

Severity Adds a bit of friction for migrating from Sapper, reduces feature parity, and will require me to either a) regress to polling the server from the client, or b) write a custom adapter for every project that needs SSEs. (which I’m not sure that this even helps for the development environment anyways)

Additional context Issue #334 seems relevant.

Also originally asked within discord chat but no one seems to know the answer, which is why I am submitting this issue.

[cayter]

@babeard After going through https://vitejs.dev/guide/api-plugin.html#configureserver, I believe we can try the below:

1. Come up with a middleware with the method signature function (req, res, next) => {}.
2. Configure the middleware in svelte.config.cjs’s vite.plugins. (this is for svelte-kit dev)
3. Come up with a forked adapter-node that allows polka to use the same middleware. (this is for node build/index.js after svelte-kit build with the forked adapter-node)

I haven’t tested it but I think it should work. There’s a drawback to this approach though, we’d have to match the SSE routes ourselves.

Update

I had tested it, the approach above works though I’m still trying to figure out how we can pass in the middleware to adapter-node so that it will configure polka to use them during svelte-kit build step.

svelte.config.cjs

const sveltePreprocess = require('svelte-preprocess');
const node = require('@sveltejs/adapter-node');
const pkg = require('./package.json');
const bodyParser = require('body-parser');
const sseMiddleware = require('./src/middlewares/sse.cjs');

/** @type {import('@sveltejs/kit').Config} */
module.exports = {
	// Consult https://github.com/sveltejs/svelte-preprocess
	// for more information about preprocessors
	preprocess: sveltePreprocess(),
	kit: {
		adapter: node({
                   out: 'build',

                   // TODO: We probably can update `adapter-node` to provide this callback which 
                   // is to ensure `node build/index.js` works. As this isn't implemented yet, you can 
                   // simply run `svelte-kit build` and manually add the middleware to polka instance's 
                   // use method at the end of `build/index.js` file.
                   configureServer(polkaInstance) {
                     polkaInstance.use(bodyParser.json());
                     polkaInstance.use(sseMiddleware);
                   }
                 }),

                ...

		vite: {
                        ...

                         // This is to ensure `svelte-kit dev` works.
			plugins: [
				(() => ({
					name: 'configure-server',
					configureServer(server) {
						server.middlewares.use(bodyParser.json());
						server.middlewares.use(sseMiddleware);
					}
				}))()
			],

                         ...
		}
	}
};

./src/middlewares/sse.cjs

let clients = [];
const messages = [];

module.exports = (req, res, next) => {
	if (req.url === '/messages') {
		switch (req.method) {
			case 'GET':
				const headers = {
					'Content-Type': 'text/event-stream',
					Connection: 'keep-alive',
					'Cache-Control': 'no-cache'
				};
				res.writeHead(200, headers);

				const data = `messages: ${JSON.stringify(messages)}\n\n`;
				res.write(data);

				const clientId = Date.now();
				const newClient = {
					id: clientId,
					res
				};

				clients.push(newClient);

				req.on('close', () => {
					console.log(`${clientId} Connection closed`);
					clients = clients.filter((client) => client.id !== clientId);
				});

				break;

			case 'POST':
				const newMessage = req.body;
				messages.push(newMessage);
				res.end(`${JSON.stringify(newMessage)}\n`);

				clients.forEach((client) =>
					client.res.write(`newMessage: ${JSON.stringify(newMessage)}\n`)
				);

				break;
		}

		return;
	}

	next();
};

[mustofa-id]

as this #3384 changes, are now possible to implement SSE through endpoint?