url stringからFileオブジェクトを作る

問題

<input type="file"/>で選択したファイルをプレビュー表示などするためにJavaScript-Load-Imageなどを使ったりしますが、反対の事をしたい場合どうするのか？

ファイル選択（Fileオブジェクト） -> blob -> URL
を
URL -> blob -> Fileオブジェクト

解決

fetchを使う。

fetch(urlString)
  .then(response => response.blob())
  .then(blob => new File([blob], "image.jpg"))
  .then(file => {
    // fileはFileオブジェクト
  })

File周りの良い記事
https://stackoverflow.com/questions/44070437/how-to-get-a-file-or-blob-from-an-url-in-javascript
https://qiita.com/kawa64372358/items/f8f729a29f0b980f7e32
https://qiita.com/TypoScript/items/0d5b08cecf959b8b822c