異なるoriginの画像からバイナリを取ろうとして失敗

corsImage.md

いきさつ

web上の画像を右クリックでs3にアップロードする拡張機能を作りたかった。 chrome拡張機能でコンテキストメニューを追加できる。 画像を選択するとurlが取れる。 canvas使ってurlからバイナリ取ろうとしてセキュリティーエラー出て詰み。

urlからバイナリ取る方法 Get image data in JavaScript? - Stack Overflow

なぜ

Although you can use images without CORS approval in your canvas, doing so taints the canvas. Once a canvas has been tainted, you can no longer pull data back out of the canvas. For example, you can no longer use the canvas toBlob(), toDataURL(), or getImageData() methods; doing so will throw a security error. CORS enabled image - HTML | MDN

異なるoriginの画像をcanvasに使うことは出来ても、そのcanvasからデータは取り出せなくなったとのこと。

どうするの

わからん🐯🍚