Blog

kweb でファイルアップロードをハンドリングしたい

kweb を使ってインタラクティブなサイトを作っているときに、ファイルをアップロードする機能が欲しくなることがある。 そういう場合は KwebPlugin を継承して実装すればよい。appServerConfigurator を実装すると、ktor のコードを自由に書ける。ので、ここで簡単に設定できる。

class FileUploadPlugin : KwebPlugin() {
    override fun appServerConfigurator(routeHandler: Routing) {
        routeHandler.post(path) {
               // ここの中は ktor のコードとして書ける
        }
    }
}

ということは call.receiveStream() とかで InputStream を取れば好きに input できる。

JS 側では以下のようにする。window.fetch 使うとめっちゃ簡単にアップロードできて便利。

const response = await fetch("/upload_attachments", {
    method: "POST",
    body: item.getAsFile()
})