javascript - 钩画布的 toDataURL

Question

[编辑]我应该更具体（感谢雷达下方的回复！）。我希望 console.log 的触发器在对象调用时捕获返回的 URI toDataURL。在链接的 jsfiddle 中，调用的对象toDataURL是canvas. 这可能是一个症结所在，因为我可能还需要捕获调用对象？我可以通过简单地封装canvas.toDataURL()在一个console.log语句中来完成我想要的，但我希望它比那个更有活力——这让我想到在上面添加一个钩子toDataURL

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

---

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

alert我已经能够在类似或本身的东西上设置一个钩子console.log，但不知道如何钩子toDataURL。

jsFiddle，上钩alert和上钩document.createElement()

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

参考

• 使用函数原型挂钩 document.createElement

• 需要挂钩到一个javascript函数调用，有什么办法吗？

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

标签： javascriptcanvashooktodataurl

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()