私はブラウザ用の非常にシンプルな HTML5/Canvas ベースの描画アプリで遊んでいます。さまざまなプログラムによる描画効果などを試すための概念実証として設定しています。ただし、キャンバスの 2d コンテキストから ImageData を取得しようとすると、SecurityError という問題が発生します。
これで、クロスブラウザー コンテンツや、ローカル コンテンツを含む Web サーバー上での実行などに関するセキュリティの問題についてすべて理解できました。これは私の問題ではありません。私は画像を使用していません。さらに奇妙なことに、コードの一部の場所では ImageData を取得できますが、他の場所では取得できません。具体的には、私が望む関数内ではありません。
これが私のコードのフォークです: http://jsfiddle.net/grimertop90/77Z42/ 自由に遊んで、キャンバスに描いてみてください。
(注: 私は Chrome で開発しており、問題なく動作しますが、Firefox で実行しようとしたところ、問題があるようです。私の目的のために、Chrome で確認してください。)
JavaScript を調べると、「ケース 1」、「ケース 2」、「ケース 3」の 3 つのポイントが表示されます。これらは、キャンバスの ImageData を取得しようとしたコード内の 3 つのポイントです。ケース 1 と 3 は機能します。重要なケース 2 はそうではありません。ケース 1 は初期化中です。ケース 3 は、ユーザーがボタンをクリックしたときです。壊れたケース 2 は、キャンバス上に一定数の点が描画されたときに発生します。
特に3か所中2か所で機能するため、問題が何であるかはわかりません。