状況

Webでcanvasを使った開発をしている際にエラーに遭遇（iOS13 safari）
※しかし何故かPC ChromeやiOS14ではエラーが出ず正常に動作。

エラー内容

SecurityError: The operation is insecure

このようなエラーがcanvas.toDataURL();の部分に出ていました。
このcanvas書き出し前に、srcが外部ページの静止画をdrawImageしていたのでどうやらここのCORSが原因ぽい。

canvasにdrawImageしている画像は、JS側でnew Image();で生成していたので
同じようにJS側で以下のようにcrossOriginを設定しました。

script.js

img.crossOrigin = "Anonymous";

これでPC Chrome、iOS14などではエラーがなくなりましたが
iOS13ではエラーが出現。。。

JSで生成していた画像をそもそもhtml側で用意して置いとくことにしたらエラーが消えました。

index.html

<img crossOrigin="Anonymous" id="canvas-img" class="canvas-img" src="">

style.css

.canvas-img {
  display: none;
}

script.js

canvasImg = document.getElementById("canvas-img");
context.drawImage(canvasImg, x, y, w, h);