Accept files in PWA Web Share Target

tamaina commented 2 years ago

PWAのshare_targetでファイルを受け付けるようにする

Summary

PWAのshare_targetでファイルを受け付けるようにし、画像などの共有ができるようにしたい。

https://w3c.github.io/web-share-target/level-2/
https://web.dev/web-share-target/#accepting-files

実装イメージ

manifest.json

{
    "share_target": {
        "action": "/sw/share",
        "method": "POST",
        "enctype": "multipart/form-data",
        "params": {
            "title": "title",
            "text": "text",
            "url": "url",
            "files": [
                {
                    "name": "file",
                    "accept": "*/*"
                }
            ]
        }
    }
}

sw.ts

onfetchで/sw/shareをPOSTかつmultipart/form-dataで叩かれた場合は良い感じにクエリ生成やファイルアップロードするなどしてself.clients.openWindow(/share?${ii_kanjino_query})

https://web.dev/web-share-target/#processing-post-shares