Hi Bharath143,
There is no need to convert it to base64string.
You can directly convert the url to bitmap image and save in the desired location. I have created sample. Refer below link.
Note: You need to change the path as per your folder structure.
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$('a').on("click", function () {
var imagePath = $(this).find('img').attr('src');
var imageName = $(this).find('img').attr('src').split('/')[$(this).find('img').attr('src').split('/').length - 1];
$.ajax({
type: "POST",
url: "CS.aspx/SaveImage",
data: '{imagePath: "' + imagePath + '", imageName: "' + imageName + '" }',
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) { alert(response.d); },
error: function (response) { alert(response.d); }
});
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="hyperimage">
<a href="http://www.aspforums.net/Threads">
<img src="Image/Tulips.jpg" alt="Tulip" /></a>
</div>
</form>
</body>
</html>
C#
[System.Web.Services.WebMethod]
public static string SaveImage(string imagePath, string imageName)
{
System.Drawing.Bitmap bitmap = new System.Drawing.Bitmap(HttpContext.Current.Server.MapPath("~/") + imagePath);
bitmap.Save(HttpContext.Current.Server.MapPath("~/Images/") + imageName, System.Drawing.Imaging.ImageFormat.Jpeg);
bitmap.Dispose();
return "Success";
}
If you want to convert to base64String then you have to add a canvas in the html and from that you will get the base64String.
HTML
<canvas id="canvasImage"> </canvas>
jQuery
<script type="text/javascript">
$(function () {
$('a').on("click", function () {
var imageUrl = $(this).find('img').attr('src');
var ctx = document.getElementById("canvasImage").getContext("2d");
var image = new Image();
image.onload = function () { ctx.drawImage(image, 0, 0); };
image.src = $(this).find('img').attr('src');
var byteData = document.getElementById("canvasImage").toDataURL();
byteData = byteData.split(';')[1].replace("base64,", "");
var imageName = $(this).find('img').attr('src').split('/')[$(this).find('img').attr('src').split('/').length - 1];
});
});
</script>