挂钩画布的toDataURL

Question

[ EDIT ]我应该更具体一些（感谢“雷达下方”的回复！）。我希望当对象调用toDataURL时，使用console.log触发器捕获返回的URI。在链接的jsfiddle中，调用toDataURL的对象是canvas。这可能是一个症结所在，因为我可能还需要捕获调用对象？我可以通过简单地将canvas.toDataURL()封装在console.log语句中来完成我想要的事情，但是我希望它比那更具动态性，这使我考虑在{{1}上添加一个钩子}

jsFiddle，更新：https://jsfiddle.net/spe4q1d8/170/

---

我正在尝试创建一个可放置在JavaScript文件顶部或底部的钩子，该钩子将在每次调用特定函数时触发toDataURL。我要挂钩的特定功能是console.log HTMLCanvasElement.toDataURL()。

我已经能够在toDataURL()或alert之类的东西上设置钩子，但无法弄清楚如何钩住console.log。

jsFiddle ，钩住toDataURL并钩住alert

• https://jsfiddle.net/spe4q1d8/142/

参考

• Hooking document.createElement using function prototype

• Need to hook into a javascript function call, any way to do this?

• https://blog.pengoworks.com/index.cfm/2012/1/12/Adding-custom-callbacks-to-existing-JavaScript-functions

Answer 1

您可以扩展原型函数，例如：

var toDataURL = HTMLCanvasElement.prototype.toDataURL;
HTMLCanvasElement.prototype.toDataURL = function(type, encoderOptions) {
  var uri = toDataURL.call(this, type, encoderOptions);
  console.log(uri);
  return uri;
}

var canvas = document.createElement('canvas');
canvas.toDataURL()