MP4 を Base64 に変換

MP4 を Base64 に変換する方法

1. .mp4 ファイルを枠にドロップするか、ファイル選択で選びます。
2. プレビューで再生します。ここで再生できないなら、このブラウザでは Data URI からもおそらく再生できません。
3. <video> タグなら 出力形式 を Data URI のままに、API なら プレーン Base64 か JSON を選びます。
4. 出力をコピー するか、大きなファイルなら .txt で保存 を使います。

ビットレートごとのエンコード後の長さ

MP4 のサイズはおおよそビットレート × 再生時間です。10 秒のクリップの場合：

スマートフォンの録画は 10 Mbps 以上のことが多いので、手を加えていないスマートフォンの動画は 10 秒で 1,600 万文字を超えます。先に解像度とビットレートを下げて再エンコードしてください。そのための動作確認済みの ffmpeg コマンドは 動画を Base64 に変換 にあります。

先頭の文字に現れる ftyp のブランド

MP4 の最初のボックスはメジャーブランドを宣言し、ファイルがどの仕様に従っているかをプレーヤーに伝えます。これは Base64 でも見えます。

5 文字目はボックスのサイズで変わる（24 バイトなら G、28 なら H、32 なら I）ので、判定するコードは最初の 5 文字の後で GZ0eXB を探すようにしてください。ブランドが qt のファイルは、実際には名前が .mp4 の QuickTime ムービーです。再生できることもありますが、受信側がタイプを確認するなら video/quicktime としてください。

埋め込みと送信

単体で完結する HTML ページで、短いミュートのループを再生するには：

<video autoplay muted loop playsinline src="data:video/mp4;base64,AAAAIGZ0eXBpc29tAAACAGlzb21p..."></video>

Node.js から JSON リクエストでクリップを送るには：

import { readFile } from "node:fs/promises";

const video = await readFile("clip.mp4");
const body = JSON.stringify({
  mimeType: "video/mp4",
  data: video.toString("base64"),
});

ここでのフィールド名は仮のものです。API のドキュメントにある名前を使ってください。詳しくは Node.js の Base64 をご覧ください。

起こりうる問題

• Data URI が Safari では再生できるのに、Chrome や Firefox では再生できない。 映像トラックがおそらく HEVC です。H.264 に再エンコードしてください。
• 読み込み中にページが固まる。 ブラウザが巨大な文字列をパースしています。数 MB を超える Data URI は、ファイルの URL か Blob URL に置き換えたほうがよいです。
• 受信側にファイルが壊れていると言われる。 デコード後の長さを、メーターに表示された元のファイルサイズと比べてください。文字列が途中で切れるとファイルの末尾が失われ、多くの MP4 はそこにインデックスを持っています。Base64 を MP4 に変換 で、デコードしたクリップが再生できるか確認できます。

よくある質問