Onaiggac I tried to use your code, but this server I use is not microsoft technology and it has been a long time that I do not work with Asp-classic server, but by the few tests I did the problem seems to be in the front end and not in the back end.
Anyway I modified the code (to work on my local server), I changed this bStream.type = adTypeBinary
for bStream.type = 1
and bStream.SaveToFile("C:\fotos\imagem.jpg", adSaveCreateOverWrite)
for bStream.SaveToFile("C:\ASP\www\imagem.jpg", 2)
, I don’t think it makes a difference, but it doesn’t cost to test
The complete code looked like this (it worked perfectly):
save.Asp
<%
base64String = Trim(Request.Form("base64"))
Set tmpDoc = Server.CreateObject("MSXML2.DomDocument")
Set nodeB64 = tmpDoc.CreateElement("b64")
nodeB64.DataType = "bin.base64"
nodeB64.Text = Mid(base64String, InStr(base64String, ",") + 1)
set bStream = server.CreateObject("ADODB.stream")
bStream.type = 1
call bStream.Open()
call bStream.Write(nodeB64.NodeTypedValue)
call bStream.SaveToFile("C:\ASP\www\imagem.jpg", 2)
call bStream.close()
set bStream = nothing
%>
It worked perfectly, I used an example HTML:
form Asp.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ido-8859-1">
<title>Test</title>
</head>
<body>
<form method="POST" action="save.asp">
<textarea name="base64">/9j/4AAQSkZJRgABAQEAYABgAAD/2wBDAAIBAQIBAQICAgICAgICAwUDAwMDAwYEBAMFBwYHBwcGBwcICQsJCAgKCAcHCg0KCgsMDAwMBwkODw0MDgsMDAz/2wBDAQICAgMDAwYDAwYMCAcIDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAwMDAz/wAARCADAAQADASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWiVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAADT0lEQVR42s2Xy08TYRTFDRHCw8LwstCWjlNeooBt59WZYWpfGKMsJBGIC3RjIrvCyr1L/xZlR0hcsqIrSEha6IdUMSL/Bd6TwIT0m5kNGWXxC7f33HPPbYeScOfi4uK/crsPkJ/IpppStwFqfubmPt9FhmbsZ+eyDYCan7m5z3eRbdknpWLpEKDmZ27uc4rUTMqkj2tbSSp/6GcdvaydPS6VSlWAWk2rIdLOlZRy5gZpv9186MGH3chAFneAJmv7ZsZszFlzx4Zu/NAUrTX/NF8pFApVQPXu82fPw6Q16F0xN6Dpii40+SrU64eG3chAFncADZxks9nDXC5XtUyLZbTMy3K5vEJLdsFGeWPZMqz3tIRhxg1oNLOyXl5fvvKhtjLWuysfMpDFHZDRM8e2bVeBaZpHqqzWivni2729vUekJ+YL8290VcdxR5hxAz765Or5bH5t8+um4uVDFv8IVI3RgiowDKNGJian5EY6mf4JUOuazqBhxg1oNFNX0oqvD1ncAXJaZrquV6/QNK2mKuqRIisMoEYPWjOcT/X3IYv/FiRTTFGU6r8AWdwBszOzLJlM1qieCBJkIIs7YPrxNCPqqIMEGQR/wNTDKQYCCvbMcYTJ8UkGAgr2zHGE0dExBvzMiXjCToijp8T55etu1MRZE+fQ+B18jiNIDyQGvMKlEWlVikuHkiidEA30bMMWUMN3HfSKuWKI38PnOEJ8JM6Am0mMit1iTPw1Njq2E4/Ha9fmWogJUKvVZsbHx7+Joniw9HrpAzR+F5/jCLFojAE3U87OhUqF0setra3ZaDR66DY3Ehn5hP7iq8U1es29e68cRxgeGmbAw9hC9M4X5wWaqTfPxYZiUmQociLGxR167fbsPXMcITwYZsDPnFEzPW5z9HjK4fvh7/RH5rOH1zPHEQb6BxjwM6tpVXCbi0ViX9AzdGPVw+uZ4wh9Qh8DfmY5JQu9Qi83N9g/eIC+bdmmh9czxxF6unsY8DI2/9Y39ccue+3+fj7HEUJdIQZQBwef4whdnV0MBBTsmeMIHe0dDAQVzOfwj6DS1tpWD3WGToV7wlkQYDcykMUdsPBiYYUuq7Teba3TEAsC7EYGsrgDiC4iQUwETAJZt+a/47+rJ1iPKnkHqgAAAABJRU5ErkJggg==</textarea>
<input type="submit">
</form>
</body>
</html>
If this code works for you then the problem really is in the front end and you should edit your question and add html and javascript (I believe it is something with canvas that you are manipulating)
Updating
I performed the test, the problem occurs when you send data:image/jpeg;base64,
together, you must use String.replace
to remove this and leave only Base64, your code should look something like:
$("#base64").val(c.toDataURL(files[0].type).replace(/^data[:]image\/[a-z]+;base64,/, ""));
A functional example would be:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ido-8859-1">
<title>Test</title>
</head>
<body>
<form method="POST" action="save.asp">
<textarea name="base64" id="base64"></textarea>
<input type="submit">
</form>
<img id="i" src="15258056.png">
<canvas id="c"></canvas>
<script type="text/javascript">
window.onload = function () {
var base64 = document.getElementById("base64");
var img = document.getElementById("i");
var c = document.getElementById("c");
var ctx = c.getContext("2d");
ctx.drawImage(img, 0, 0);
c.width = 50;
c.height = 50;
var ctx = c.getContext("2d");
ctx.drawImage(img, 0, 0, 50, 50);
base64.value = c.toDataURL("image/jpeg").replace(/^data[:]image\/[a-z]+;base64,/, "");
};
</script>
</body>
</html>
Update 2
Although not in the scope of the question, the author detected the problem, it was with the FileReader
. The FileReader
needs the event onload
before starting sending to the server, an example of what the code should look like:
Javascript:
function getImage() {
var file = document.getElementById("file").files[0];
var reader = new FileReader();
reader.onload = function(e) {
var img = new Image();
img.onload = function() {
resizeImage(img);
};
img.src = reader.result;
}
reader.readAsDataURL(file);
}
function resizeImage(img) {
var base64 = document.getElementById("base64");
var c = document.getElementById("c");
var ctx = c.getContext("2d");
ctx.drawImage(img, 0, 0);
c.width = 50;
c.height = 50;
var ctx = c.getContext("2d");
ctx.drawImage(img, 0, 0, 50, 50);
base64.value = c.toDataURL("image/jpeg").replace(/^data[:]image\/[a-z]+;base64,/, "");
}
window.onload = function() {
document.getElementById("file").onchange = getImage;
};
HTML:
<style type="text/css">
#c {
border: 1px #c0c0c0 solid;
}
</style>
<input type="file" name="file" id="file" accept="image/*">
<form method="POST" action="save.asp">
<textarea name="base64" id="base64"></textarea>
<input type="submit">
</form>
<canvas id="c"></canvas>
Since the files are small, it has how to post an Hex dump from the original file and the corrupted file?
– user25930
Your files[0]. type is returning what in javascript when you run?
– Maicon Carraro