iRy*_*ell 9 canvas node.js jsdom
使用canvas@1.2.3和jsdom@3.1.2与节点v0.12.2,我在尝试使用canvas toDataURL()函数时遇到错误.
canvasTest.js:
$(function(){
var canvas = $('<canvas></canvas>').attr({'id':'canvasTest', 'width':'500', 'height':'500'});
var ctx=canvas[0].getContext("2d");
ctx.beginPath();
ctx.arc(100,75,50,0,2*Math.PI);
ctx.stroke();
$('#canvasWrap').append(canvas);
});
HTML测试:
<!doctype html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="canvasTest.js"></script>
<script type="text/javascript">
$(function(){
console.log($('body').html());
console.log($('#canvasTest').length);
console.log($('#canvasTest')[0].toDataURL());
})
</script>
</head>
<body>
<div id="canvasWrap"></div>
</body>
</html>
jsdom测试:
var canvas = require('canvas');
var jsdom = require('jsdom');
jsdom.env({
html: '<html><body><div id="canvasWrap"></div></body></html>',
scripts: ['127.0.0.1/jquery-2.1.4.min.js','127.0.0.1/canvasTest.js'],
done:function (err,win) {
var $ = win.jQuery;
$(function(){
console.log($('body').html());
console.log($('#canvasTest').length);
console.log($('#canvasTest')[0].toDataURL());
});
}
});
在我在Chrome中的HTML测试中,我获得了正确的base64编码的画布数据,而在node.js中,错误如下:
TypeError: Cannot read property 'toDataURL' of undefined
您是按 ID 选择的，因此没有数组。删除 [0] ，它应该可以工作，或者使用数组选择另一种方式：
console.log($('canvas')[0].toDataURL());
或者试试这个：
console.log($('#canvasTest').toDataURL());
或这个：
console.log(win.$("#canvasTest").toDataURL());
或这个：
console.log(win.document.getElementById("canvasTest").toDataURL());
或这个：
console.log(win.document.getElementsByTagName("canvas")[0].toDataURL());
| 归档时间： |
|
| 查看次数： |
1206 次 |
| 最近记录： |