React Native

Extract data:image/png;base64 from HTML

See more Base64 Examples

Demonstrates how to extract base64 image data from HTMl and save to files. React Native

import { BinData, StringBuilder } from '@chilkat/react-native'

function chilkatExample() {
  const sb = new StringBuilder();
  const bd = new BinData();
  const sbFilename = new StringBuilder();
  let index = 1;

  sb.loadFile('qa_data/html/oresp body.txt', 'utf-8');
  // Assume success.
  console.log(`length = ${sb.length}`);

  let mayHaveMore = true;
  while (mayHaveMore) {

    // Get the base64 between the 1st occurrence "data:image/png;base64," and "'"
    const sBase64 = sb.getBetween('data:image/png;base64,', '\'');

    // If nothing is found, then we'll exit the loop because there are no more.
    mayHaveMore = sb.lastMethodSuccess;

    if (sb.lastMethodSuccess) {
      // Found something.
      // Load into bd and save.
      bd.loadEncoded(sBase64, 'base64');

      sbFilename.setString('qa_output/png_');
      sbFilename.appendInt(index);
      sbFilename.append('.png');

      bd.writeFile(sbFilename.getAsString());

      // Replace "data:image/png;base64" with "data:image-png;base64" so the next iteration finds the next occurrence.
      sb.replaceFirst('data:image/png;base64', 'data:image-png;base64');
    }

    index++;
  }

  // Restore our replacements..
  const count = sb.replace('data:image-png;base64', 'data:image/png;base64');

  console.log('All done.');
}