2016-09-25 5 views
-1

これはかわいいです、 私はキャンバス画像に問題があります。 (securityError) 私は訪問カードを設計するためのツールを構築しました。ここでは、テキスト用のキャンバスとロゴ用のキャンバスを使用します。ロゴの画像を挿入することなく、すべて正常に動作します。しかし、イメージを挿入すると、securityErrorが返されます。 (当初はそれも働いていましたが、私は単にその問題につながる変化を把握できません)。今は、html2canvasをajax経由でphp-fileに送る前にhtml2canvasを作成しようとしました。しかし、それと同じ問題です。ロゴなしで動作していて、ロゴを挿入するとsecurityErrorがスローされます。これは私を最も混乱させています。 私はすべてを自分のサーバーに設定しました。 URLは:http://obs-design.de/visitenkarten/ 画像を追加するには、テキストキャンバスのいずれかをdobleclickし、エディタ上の画像アイコンをクリックします。 先に進むと、元のアプリの下にhtml2キャンバスが表示されます。 (ここにはまだ画像あり)。アップロードされた画像ファイルは、http://obs-design.de/visitenkarten/canvasimg/visitenkarte.pngで呼び出すことができます(画像が含まれていない場合に限ります)。 誰かが私のヒントを持っていますか?前もって感謝します。canvas-images(securityError)

+2

最初に、あなたは[質問する](http://stackoverflow.com/help/how-to-ask)ページに飛ぶことができます... – Teemu

+0

こんにちは@barfly、お会いできてよかった! :) ...セキュリティエラーステートメントを含めてください。 –

+0

エラー文は次のとおりです。[link] SecurityError:操作が安全ではありません。 エラーソース行: \t var canvasData = canvas.toDataURL( "image/png");しかしカイードの助けを借りて私はそれを修正することができましたが、今はすべて正常に動作します。とにかくおかげさまでありがとうございました。 barfly – barfly

答えて

0

body要素にhtml2canvas()を呼び出しているためです。

文書には、適切なCORSヘッダーがロードされていないhttps://code.jquery.com/ui/1.12.0/themes/base/images/ui-icons_444444_256x240.pngへの参照が含まれています。

簡単な修正は、#innerbox要素のhtml2canvasを呼び出すことです。 文書のこの部分では、キャンバスを汚染するものは何もありません。あなたは任意のエクスポートメソッドを呼び出すことができます。

属性を持たないキャンバス要素もあります。そのコンテキストに描画されるメディアリソースには、適切なクロスオリジン要求が提供されている必要があります。キャンバスレベルではできません。

+0

ありがとうございました。今はすべて正常に動作します。 – barfly

+0

こんにちはかご - まず私はすべてが大丈夫ですが、そうではありません。以前と同じように、時にはうまくやってしまいました。私はキャンバス(html2canvasによって作られたもの)とイメージの有無の違いを理解できません。これら2つのキャンバスの違いはどこですか?私はcrossOriginをヘッダーのようにのように含めました。これは本当に正しいですか?どこにどのようにCORSヘッダーを含めるのですか?あなたの助けを前にありがとう。 – barfly

+0

corsヘッダーは、キャンバスに描画するメディアをホストするサーバーによって送信されます。サーバーがcrossOrigin要求を受け入れるように設定されていない場合、あなたは不運です。 srcを設定する前にimgタグにcrossIrigin属性を設定して、サーバーがcorsを遵守していることを知るようにする必要があります。 – Kaiido

関連する問題