Converting Image to Base64

How can I convert an image into Base64 string using JavaScript?

You can use the HTML5 <canvas> for it:

Create a canvas, load your image into it and then use toDataURL() to get the Base64 representation (actually, it's a data: URL, but it contains the Base64-encoded image).

converting image to base64 - image becomes invisible

I am assuming u need the key baseImageCorrect and encoding key at the same level.

Use this instead:

const EncodedImage = JSON.stringify({
            fileBase64: {baseImageCorrect, encoding: 'base64' },
        });

Converting base64 to image | Not working | Flutter

Well, this got resolved when I wrapped SfPdfViewer.memory(bytes) inside a Container. Though, not sure why it wasn't working without a Container.

The whole solution:

Uint8List bytes = base64.decode(pdf);
return Container(
  child: SfPdfViewer.memory(bytes),
);

Package used : syncfusion_flutter_pdfviewer

Bug when converting image buffer back to base64

The Base64 part of the string doesn't start until after the ,; the data: part is a scheme, the image/png part is a content type, and the base64, part is an indicator that what follows it is Base64 encoded text. So you're asking to convert non-Base64 data when you try to use that entire string as Base64.

You have to remove that prefix first, because it's not part of the Base64 data. It's just part of the data: URI.

how can i convert image uri to base64?

You can use react-native-fs if you are using react-native cli

documentation: https://github.com/itinance/react-native-fs#readfilefilepath-string-encoding-string-promisestring

import RNFS from 'react-native-fs';

//base64 res
var data = await RNFS.readFile( "file://path-to-file", 'base64').then(res => { return res });

Convert image file into base64 image in Flutter Web

Found the solution, using readAsBytes instead of readAsBytesSync :

var bytes = await widget.image.readAsBytes();
var base64img = base64Encode(bytes);