Convert Image to Base64 string and Base64 string to Image in asp.net MVC application - Free Asp.Net,MVC,AngularJs,Jquery,Javascript,Sql Server,WCF,Entity framework snippets and tutorial

Convert Image to Base64 string and Base64 string to Image in asp.net MVC application

In this article I am going to explain how to convert Image to Base64 string and Base64 string to Image in asp.net MVC application.

Description:
In MVC application want to convert Image to Base64 and Base64 encoded string to Image.

Implementation:
Add empty controller to project. Create method to convert Image and Base64 encoded string.

Complete code to Controller :

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MvcApplication2017.Models;
using System.Security.Cryptography;
using System.Configuration;
using System.Net.Mail;
using System.Net;
using System.IO;
using System.Web.Security;
  
using System.Drawing;
namespace mvcapplication2017.Controllers
{
  
    public class LoginController : Controller
    {
        //
        // GET: /Login/
        DemoEntities db = new DemoEntities();
        public ActionResult Index()
        {
            return View();
        }

        public ActionResult ConvertImage()
        {
            ViewData["image"] = "/images/1.jpg";
            ViewData["base64"] = "false";
            return View();
        }
        [HttpPost]
        public ActionResult ConvertImage(string aspmantra)
        {
            string path = Server.MapPath(aspmantra);
            ViewData["base64"] = AspMantraImageToBase64(path);
            return View();
        }
        //Convert Image to base64
        public string AspMantraImageToBase64(string imagepath)
        {
            using (System.Drawing.Image image = System.Drawing.Image.FromFile(imagepath))
            {
                using (MemoryStream ms = new MemoryStream())
                {
                    string base64String;
                    image.Save(ms, image.RawFormat);
                    byte[] imageBytes = ms.ToArray();
                    base64String = Convert.ToBase64String(imageBytes);
                    return base64String;
                }
            }
        }
        [HttpPost]
        public ActionResult ConvertToBase64(string base64)
        {
            Image img = AspMantraBase64ToImage(base64);
            img.Save(Server.MapPath("~/images/aspmantra.jpg"));
            ViewData["image"] = "/images/aspmantra.jpg";
            ViewData["base64"] = "false";
            return View("ConvertImage");
        }
        //Convert base64 to image
        public System.Drawing.Image AspMantraBase64ToImage(string base64String)
        {
            byte[] imageBytes = Convert.FromBase64String(base64String);
            MemoryStream ms = new MemoryStream(imageBytes, 0, imageBytes.Length);
            ms.Write(imageBytes, 0, imageBytes.Length);
            System.Drawing.Image image = System.Drawing.Image.FromStream(ms, true);
            return image;
        }
    }
}



Complete source of View:

@{
    ViewBag.Title = "Convert Image to Base64 ";
}

@if (ViewBag.image != null)
{
using (Html.BeginForm("ConvertImage", "login", FormMethod.Post, new { enctype = "multipart/form-data" }))
{   <table>
    <tr><td>Image : </td><td><img src="@ViewBag.image" id="logo" name="logo" width="500px" /></td></tr>
        <tr><td></td><td><input id="aspmantra" name="aspmantra" type="hidden" value="@ViewBag.image" /></td></tr>
        <tr><td></td><td><input type="submit" id="base" value="Convert to Base64" /></td></tr>
    </table>   
}
}
@if (ViewBag.base64 != "false")
{
    using (Html.BeginForm("ConvertToBase64", "login", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    <table>
        <tr>
            <td>Base64 </td><td><textarea id="base64" name="base64" rows="10" cols="60">@ViewBag.base64</textarea>
            </td>
        </tr>
        <tr>
            <td></td>
            <td><input type="submit" id="image" value="Convert to Image" /></td>
        </tr>
    </table> 
}  
}



What do you think about this article?

If you found this article useful, please share and follow on Facebook, Twitter, Google Plus and other social media websites. To get free updates subscribe to newsletter. Please put your thoughts and feedback in comments section.

Share this

Share on FacebookTweet on TwitterPlus on Google+


EmoticonEmoticon