multipart/form-data(バイナリ)とbase64の比較、どっちがいいのか?

"use strict";

/*
 * Minimal multipart/form-data sample code
 * Now with a random boundary and base64 dummy data for the file.
 */

(async () => {
  // 1) boundary文字列の用意
  //    この文字列は区切りとして機能し、フォームデータの開始・終了を分かりやすくするためのものです。
  // 衝突しにくいようランダムに生成することも多いです。
  const boundary = "----Boundary" + Math.random().toString(36).slice(2);

  // 2) Prepare base64 data for the file (dummy)
  //    実際には画像などをBase64化した文字列をここに入れてください。
  const base64DummyData = "iVBORw0KGgoAAAANSUhEUgAAAAUA...";

  // 3) Build request body
  //    boundaryを使って区切りを明示的に入れながら、テキストデータやファイルデータを組み立てます。
  //    \r\n は改行を意味しています（Windows系の改行コードですが、HTTPヘッダなどでは一般的に使われます）。
  //    boundaryによる区切りと、Content-Dispositionなどのヘッダ情報を手動で書いています。
  const body =
    `--${boundary}\r\n` +
    `Content-Disposition: form-data; name="username"\r\n\r\n` +
    `sampleUser\r\n` +
    `--${boundary}\r\n` +
    `Content-Disposition: form-data; name="avatar"; filename="test.png"\r\n` +
    `Content-Type: image/png\r\n\r\n` +
    base64DummyData + // Base64でエンコードされたダミー文字列
    `\r\n` +
    `--${boundary}--\r\n`;

  // 4) Send POST request using Fetch API
  //    multipart/form-data; boundary=<boundary> を明示し、組み立てた body を送信します。
  const response = await fetch("/upload", {
    method: "POST",
    headers: {
      "Content-Type": `multipart/form-data; boundary=${boundary}`
    },
    body: body
  });

  // 5) Print out the result from server
  console.log("Upload result:", await response.text());
})();

// 実行結果例
Math.random()                    // 0.7123456789
Math.random().toString(16)       // "0.b67d3"
Math.random().toString(16).slice(2)  // "b67d3"

  videoInitOption = {
    method: 'POST',
    headers: {
      'Authorization': 'Bearer ' + oauth2Service.getAccessToken(),
      'Content-Type': 'application/json'
    },
    payload: JSON.stringify({
      command: 'INIT',
      media_type: 'video/mp4',
      media_category: 'tweet_video',
      total_bytes: videoFileSize
    }),
    muteHttpExceptions: true
  };

  const boundary = '----WebKitFormBoundary' + Math.random().toString(16).slice(2);
  const initPayload =
    '--' + boundary + '\r\n' +
    'Content-Disposition: form-data; name="command"\r\n\r\n' +
    'INIT\r\n' +
    '--' + boundary + '\r\n' +
    'Content-Disposition: form-data; name="media_type"\r\n\r\n' +
    'video/mp4\r\n' +
    '--' + boundary + '\r\n' +
    'Content-Disposition: form-data; name="media_category"\r\n\r\n' +
    'tweet_video\r\n' +
    '--' + boundary + '\r\n' +
    'Content-Disposition: form-data; name="total_bytes"\r\n\r\n' +
    videoFileSize + '\r\n' +
    '--' + boundary + '--'; // Important to close boundary

  videoInitOption = {
    method: 'POST',
    headers: {
      'Authorization': 'Bearer ' + oauth2Service.getAccessToken(),
      'Content-Type': 'multipart/form-data; boundary=' + boundary
    },
    payload: initPayload,
    muteHttpExceptions: true
  };