Static middleware. For serving static assets.

[brillout]

In principle, it should be possible to implement a static middleware @hattip/static that works everywhere.

Although I'm not sure how much effort it would be to support each platform. E.g. for Cloudflare Workers we need to use its KV store. If each platform has its own approach, @hattip/static may become hard to maintain. (We can support only a couple of providers while, in the long term, asking others to abide to some kind of shared convention.)

[cyco130]

Definitely on the roadmap.

Relevant discussion: #45

[brillout]

Most(/all?) deployment providers support a static directory configuration. That could do the trick in the meantime. Although this means that HatTip would need a static config — not sure where/how this would fit with HatTip's current flexible architecture.

On a tangent: maybe we can, for example, make wrangler.toml optional.

[masx200]

https://deno.land/std@0.190.0/http/file_server.ts?source

This solution can be used on deno.

[masx200]

"https://github.com/koajs/static"

"https://github.com/koajs/etag"

"https://github.com/masx200/koa-range"

"https://github.com/jsl9208/koa2-serve-index"

"https://github.com/koajs/conditional-get"

This solution can be used on node.

[masx200]

Can we design an adapter from Koa middleware to Hattip middleware?

We can design to put "http. RequestListener" is converted into hattip middleware.

[cyco130]

Can we design an adapter from Koa middleware to Hattip middleware?

We can design to put "http. RequestListener" is converted into hattip middleware.

I think it's possible. And I think Nitro is doing something like that. But I don't think it would be efficient. Besides, Koa middleware probably use other Node stuff that will require polyfills.

Koa has a good selection of well written, modular middlewares. But I think it would be much cleaner if we ported them (like we did in the CORS middleware) instead of trying to adapt them.

[cyco130]

https://deno.land/std@0.190.0/http/file_server.ts?source

This solution can be used on deno.

Current state for Rakkas:

• For Node, it uses sirv (because vavite already comes with it)
• For Deno, it uses http/file_server from std
• For Bun, it has a (not so great) custom server
• For other targets, each target has their own solution as part of the platform

[masx200]

You can wrap the koa or express library into a middleware and implement it by opening an HTTP server, which is very simple.

import { Middleware, NextFunction, RetHandler } from "../src/Middleware.ts";

import { Context } from "../mod.ts";
import { RequestListener } from "./RequestListener.ts";
import { createServer } from "node:http";

export function requestListenerToMiddleWare(
    requestListener: RequestListener,
): [Middleware, () => Promise<void>, () => void] {
    //@ts-ignore
    const server = createServer(requestListener);
    const host = `127.${Math.floor(Math.random() * 253 + 1)}.${
        Math.floor(
            Math.random() * 253 + 1,
        )
    }.${Math.floor(Math.random() * 253 + 1)}`;
    const port = Math.floor(Math.random() * 55535 + 10000);
    return [
        async (context: Context, next: NextFunction): Promise<RetHandler> => {
            //@ts-ignore

            const origin = `http://${host}:${port}`;

            const urlobj = new URL(context.request.url);
          //  urlobj.origin;
            const response = await fetch(
                origin + urlobj.href.slice(urlobj.origin.length),
                {
                    ...context.request,
                    //@ts-ignore

                    duplex: "half",
                },
            );
            if (response.status === 404) return next();

            return response;
        },
        async () =>
            new Promise((s) => {
                server.listen(port, host, () => {
                    console.log(
                        `http server listening host:${host} port:` + port,
                    );

                    s();
                });
            }),
        () =>
            server.close(() => {
                console.log(`http server closed host:${host} port:` + port);
            }),
    ];
}