javascript - Why am I getting a blocked script execution error? -

i using http://cburgmer.github.io/rasterizehtml.js/ turn html canvas. when change code to:

var canvas = document.getelementbyid("save_image_canvas"); // rasterizehtml.drawhtml('<div style="font-size: 20px;">some <span style="color: green">html</span> image</div>', canvas); rasterizehtml.drawhtml(document.getelementbyid("mattes").innerhtml, canvas); 

i following error in console:

blocked script execution in 'mysite/custom_app/' because document's frame sandboxed , 'allow-scripts' permission not set.

all scripts , content located on same server.

here full function:

function common_screenshot() {   var canvas = document.getelementbyid("save_image_canvas");   if (typeof(moulding_canvas) === "undefined")   {     canvas.height = parseint($("#matte_canvas").height());     canvas.width = parseint($("#matte_canvas").width());   }   else   {     canvas.height = parseint($("#moulding_canvas").height());     canvas.width = parseint($("#moulding_canvas").width());   }   canvas.style.backgroundcolor = "#ffffff";    var moulding_top = -1 * parseint(document.getelementbyid("moulding_canvas").style.top);   var moulding_left = -1 * parseint(document.getelementbyid("moulding_canvas").style.left);    console.log("top: " + moulding_top);   rasterizehtml.drawhtml(document.getelementbyid("mattes").innerhtml).then(function (renderresult)    {     context.drawimage(renderresult.image, moulding_left, moulding_top);   });   var ctx = canvas.getcontext('2d');   ctx.drawimage(matte_canvas, moulding_left, moulding_top);   if (typeof(moulding_canvas) !== "undefined")   {     ctx.drawimage(moulding_canvas, 0, 0);   }   var image = new image();     image.src = canvas.todataurl("image/jpeg");   return image; } 

the image results rasterizehtml fine when on screen, when call canvas.todataurl, image results black.

judging error message, using webkit-based browser, chrome. error message (introduced here) displayed when <iframe> element sandbox attribute attempting run javascript (only allowed when allow-scripts specified in attribute). @ rasterizehtml source code shows function createhiddensandboxediframe() creates such frame. used calculatedocumentcontentsize(), contents of document being copied temporary sandboxed frame in order measure size. apparently, document contains <script> tags , these cause error (not because of script origin because scripts disallowed).

now code doesn't call calculatedocumentcontentsize() of course. being called function drawdocumentimage() called function dodraw() called function rasterizehtml.drawdocument() called function rasterizehtml.drawhtml(). in end, issue really: html code passing in contains <script> tags.

given executing scripts on html code drawing doesn't seem intention (no executejs option), should able move <script> tags somewhere else, aren't inside mattes element. if that's impossible, can still run regular expression on source code remove script tags, like:

var code = document.getelementbyid("mattes").innerhtml; code = code.replace(/<\/?script\b.*?>/g, ""); rasterizehtml.drawhtml(code, canvas); 

edit: inline event handlers ondrop attribute trigger warning of course. can remove these well:

code = code.replace(/ on\w+=".*?"/g, ""); 

note rid of warning. doubt warning causing image blank - need ask 1 more question on that.