サーバレス練習帳

着眼大局着手小局

html&javascriptでドラッグアンドドロップ

bashalog.c-brains.jp


https://uhyohyo.net/javascript/12_7.html

以下、引用。


DataTransferItemオブジェクトはkindプロパティとtypeプロパティを持ち、kindプロパティは"string"か"file"のどちらかです。つまり、このデータがテキストなのかファイルなのかを示しています。typeプロパティはフォーマット文字列です。

そして、文字列の場合はgetAsStringメソッドで、ファイルの場合はgetAsFileで生のデータを取得します。getAsFileの場合は引数なしで、返り値でFileオブジェクトが得られるのですが、getAsStringメソッドの場合はさらに面倒です。このメソッドには引数でコールバック関数を渡す必要があり、その関数にデータが渡されます。


geAsString
https://lab.syncer.jp/Web/API_Interface/Reference/IDL/DataTransferItem/getAsFile/

blobは関係ある?
https://www.html5rocks.com/ja/tutorials/file/dndfiles//

filereader apiを使うか?

https://karoten512.hatenablog.com/entry/2018/02/23/161356

書き込みもできるように見える。

https://www.html5rocks.com/ja/tutorials/file/filesystem//

NFS APIを使う事前設定

https://www.mitsue.co.jp/knowledge/blog/frontend/201909/30_1002.html

※ お試しする際はGoogle ChromeでFlags(chrome://flags/#native-file-system-api)を開き、Native File System APIを「enable」にセットする必要があります。

NFS APIの使い方

https://qiita.com/pentamania/items/ada07c45d4e5cc139c03