I am using html2canvas in order to create a screenshot of a section of the app. I do have working code but it prompts the user to save. I would like the png to save without prompting.
Here is my WORKING code (but has user prompt):
html2canvas( $('#renderCover'), {
onrendered: function(canvas) {
var base64ToByteArray = function(encStr){
var base64s = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
var decOut = new air.ByteArray();
var bits;
for(var i = 0, j = 0; i<encStr.length; i += 4, j += 3){
bits = (base64s.indexOf(encStr.charAt(i)) & 0xff) <<18 | (base64s.indexOf(encStr.charAt(i +1)) & 0xff) <<12 | (base64s.indexOf(encStr.charAt(i +2)) & 0xff) << 6 | base64s.indexOf(encStr.charAt(i +3)) & 0xff;
decOut[j+0] = ((bits & 0xff0000) >> 16);
if(i+4 != encStr.length || encStr.charCodeAt(encStr.length - 2) != 61){
decOut[j+1] = ((bits & 0xff00) >> 8);
}
if(i+4 != encStr.length || encStr.charCodeAt(encStr.length - 1) != 61){
decOut[j+2] = (bits & 0xff);
}
}
return decOut;
};
var dataURL = canvas.toDataURL("image/png");
dataURL = dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
dataURL = base64ToByteArray(dataURL);
var file = air.File.documentsDirectory.resolvePath("Air Test/testPNG.png");
file.save(dataURL);
}
});
Here is my attempt without prompt but I'm getting error, Type Coercion failed:
html2canvas( $('#renderCover'), {
onrendered: function(canvas) {
var base64ToByteArray = function(encStr){
var base64s = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
var decOut = new air.ByteArray();
var bits;
for(var i = 0, j = 0; i<encStr.length; i += 4, j += 3){
bits = (base64s.indexOf(encStr.charAt(i)) & 0xff) <<18 | (base64s.indexOf(encStr.charAt(i +1)) & 0xff) <<12 | (base64s.indexOf(encStr.charAt(i +2)) & 0xff) << 6 | base64s.indexOf(encStr.charAt(i +3)) & 0xff;
decOut[j+0] = ((bits & 0xff0000) >> 16);
if(i+4 != encStr.length || encStr.charCodeAt(encStr.length - 2) != 61){
decOut[j+1] = ((bits & 0xff00) >> 8);
}
if(i+4 != encStr.length || encStr.charCodeAt(encStr.length - 1) != 61){
decOut[j+2] = (bits & 0xff);
}
}
return decOut;
};
var dataURL = canvas.toDataURL("image/png");
dataURL = dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
dataURL = base64ToByteArray(dataURL);
var storage = 'documentsDirectory';
var localFile = air.File[storage].resolvePath( "Air Test/testPNG.png" );
var stream = new air.URLStream();
stream.addEventListener(air.Event.COMPLETE, function(e){
var fileData = new air.ByteArray();
stream.readBytes(fileData,0,stream.bytesAvailable);
var fileStream = new air.FileStream();
fileStream.openAsync(localFile, air.FileMode.WRITE);
fileStream.writeBytes(fileData,0);
fileStream.close();
});
stream.load(dataURL);
}
});
Is there any way to save the canvas as png local without a user prompt?
Thanks, but I fixed it myself. Here is the working code to save the canvas as a .png locally without user prompt:
html2canvas( $('#renderCover'), {
onrendered: function(canvas) {
var base64ToByteArray = function(encStr){
var base64s = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
var decOut = new air.ByteArray();
var bits;
for(var i = 0, j = 0; i<encStr.length; i += 4, j += 3){
bits = (base64s.indexOf(encStr.charAt(i)) & 0xff) <<18 | (base64s.indexOf(encStr.charAt(i +1)) & 0xff) <<12 | (base64s.indexOf(encStr.charAt(i +2)) & 0xff) << 6 | base64s.indexOf(encStr.charAt(i +3)) & 0xff;
decOut[j+0] = ((bits & 0xff0000) >> 16);
if(i+4 != encStr.length || encStr.charCodeAt(encStr.length - 2) != 61){
decOut[j+1] = ((bits & 0xff00) >> 8);
}
if(i+4 != encStr.length || encStr.charCodeAt(encStr.length - 1) != 61){
decOut[j+2] = (bits & 0xff);
}
}
return decOut;
};
var dataURL = canvas.toDataURL("image/png");
dataURL = dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
dataURL = base64ToByteArray(dataURL);
var storage = 'documentsDirectory';
var localFile = air.File[storage].resolvePath( "Air Test/testPNG.png" );
var stream = new air.FileStream();
stream.open(localFile, air.FileMode.WRITE);
stream.writeBytes(dataURL,0);
stream.close();
}
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.