在Chrome扩展内容脚本中使用画布drawImage

问题描述

我试图在我的Chrome扩展程序的注入内容脚本的Canvas上下文中使用 drawImage 。

I'm trying to use drawImage on Canvas Context in injected content script from my Chrome Extension.

  testCanvas = document.createElement('canvas');
  testContext = testCanvas.getContext('2d');
  var image = new Image();
  testContext.drawImage(image, 0, 0);

在Chrome 26中，它可以正常工作，但在开发通道（Chrome 28）中，此消息：

In Chrome 26 it works ok, but in dev channel (Chrome 28) this seams broken as I got this message:

Uncaught TypeError: Type error

当我将相同的脚本直接移动到后台页面时，它没有任何问题。

When I move same script directly into background page, it works without any problem.

我认为这可能与某些安全相关的变化，但我没有找到任何相关信息。

I think this can be related to some security related change but I failed to find any relevant information.

推荐答案

这是一个错误，你应该报告它。一些更多的测试表明，在Chrome 28.0.1498.0中， Image 构造函数不会创建有效的 HTMLImageElement 实例在下面的屏幕截图中）。
此代码在内容脚本的上下文中运行。相同的代码在常规页面和扩展的进程（后台页面）上工作正常。

This is a bug, you should report it. Some more testing reveals that in Chrome 28.0.1498.0, the Image constructor does not create a valid HTMLImageElement instance (as seen in the screenshot below).
This code is run in the context of a Content script. The same code works fine on regular pages and in the extension's process (background page).

要解决该问题，请使用 document.createElement 'img'）而不是 new Image（）。

To work around the problem, use document.createElement('img') instead of new Image().

不要忘记在。

这篇关于在Chrome扩展内容脚本中使用画布drawImage的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！