Convert file to Base64 encoded

1. Install the package
2. Call this function where and which file you want to convert
   • Example for the react component
   • For image > <input type="file" accept="image/*" onChange={handleImageUpload} />

Follow this steps

1. Install & Import the package

import base64 from "convertto-base64";

2. Make your input field which will take image/pdf/doc/video

<input type="file" accept="image/*" onChange={handleImageUpload} />

3. Create your State & Function following this

const [image, setImage] = useState([]);
  const handleImageUpload = async (e) => {
    e.preventDefault();
    const base64Data = await base64(e.target.files[0]);
    setImage(base64Data);
    // You can set it to state, local storage, or any other appropriate action.
  };

4. Use the image state anywhere you want, following this

<img src={image} height={200} width={400} alt="image">

5. If you want to view the base64 data. You can show it in the console.log() or

<textarea defaultValue={image}></textarea>

Don't directly copy paste the base64 data to browser, use HTML Tag to view to browser, otherwise it'll not render full data.

Thank you everyone & Keep supporting us