title: How to concatenate multiple images to send them to Firebase Storage as one file
body: <p>I am working on a canvas to video converter. Frames are generated from an animated canvas with <code>.toDataURL()</code>, then sent to a Cloud Function to be converted into a video file with FFMPEG. Since the http requests have their limits, instead of sending them directly in a request body, I am first uploading frames to Firebase Storage, then downloading them in my Cloud Function. With FPS set to 25 and a 1 minute video duration I get 1.5K frames that need to be sent to Firebase Storage. Their free daily limit is 20K uploads which I can hit pretty fast if I have a longer video or multiple canvas conversions each day. My idea was to concatenated those Data URLs in a single text file, upload it to Firebase Storage, then split into individual files in my Cloud Function.</p>
  <pre><code>const frames = [];
  
  for (let index = 0; index &lt; maxFrames; index++) {
    ...
    frames.push(canvas.toDataURL('image/jpeg', .75));
  }
  
  const blob = new Blob([frames.join('\n')], { type: 'text/plain' });
  </code></pre>
  <p>Everything works like a charm with short videos, however longer videos get this <code>Uncaught RangeError: Invalid string length</code> error which basically means that the resulting string is too long. Any ideas or workarounds?</p>