Accept files in PWA Web Share Target

[tamaina]

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

[tamaina]

アップロード中は通知でアップロードの状態を表示する必要があるかも

[tamaina]

sw.tsでファイルをアップロードする必要があるんだけど、browser-image-resizerはOffscreenCanvasないと多分無理なので画像圧縮は無理か

[rinsuki]

Web Share Target あるなら OffscreenCanvas もあるのでは、というか一回idbあたりにしまっておけばいいのでは

[tamaina]

たしかに

[tamaina]

iOS 16.4からOffscreenCanvas対応した

[syuilo]

うおおおおおおお

[tamaina]

深夜テンションでbrowser-image-resizerをOffscreenCanvasにした

https://github.com/misskey-dev/browser-image-resizer/releases/tag/v2.2.1-misskey.4

[bil-ash]

@tamaina Any updates on this feature? It would be very nice to have this feature along with the ability to not only upload images but also audio and video files via web-share-target