【JavaScript】BlobオブジェクトをFileオブジェクトに変換する【中級者】

BlobオブジェクトをFileオブジェクトに変換する。
FileオブジェクトにはnameプロパティとlastModifiedプロパティが存在する。
BlobオブジェクトにはnameプロパティとlastModifiedプロパティが存在しない。

FileオブジェクトにはwebkitRelativePathが存在する。しかし、Blobオブジェクトには存在しない。
webkitRelativePath: ファイルが選択された場合に、ファイルの相対パスを表します。
他にもFileオブジェクトにあってBlobオブジェクトには存在しないプロパティある。

// Blobオブジェクトを作成
const blob = new Blob(['Hello, World!'], { type: 'text/plain' });

console.log(blob); // Blob { size: 13, type: "text/plain" }

// BlobオブジェクトからFileオブジェクトに変換
// 第2引数はファイルの名前を指定する。
const file = new File([blob], 'hello.txt');

console.log(file); // File { name: "hello.txt", lastModified: 1694409093890, webkitRelativePath: "", size: 13, type: "" }

// lastModifiedはファイルが生成された時間である。

const date = new Date(file.lastModified);

const str = date.getFullYear() +
  '/' + ('0' + (date.getMonth() + 1)).slice(-2) +
  '/' + ('0' + date.getDate()).slice(-2) +
  ' ' + ('0' + date.getHours()).slice(-2) +
  ':' + ('0' + date.getMinutes()).slice(-2) +
  ':' + ('0' + date.getSeconds()).slice(-2);

// ファイルの最終更新日時
console.log(str);// 2023/09/11 14:11:33

• 
• Tweet

• JavaScript