從畫布獲取源 URL 或圖像名稱

Question

我正在制作一個 chrome 擴展，我需要在畫布或圖像名稱中找到圖像的源 url。 我需要這個，因為圖像名稱是我想用擴展名捕獲的項目的 ID，我不知道如何獲得兩者之一。

我已經嘗試從畫布中獲取 getDataUlr() ，但這只是一個大字符串上的圖像，沒有引用我需要的 id。

這還可能嗎？

最好的問候和感謝任何幫助

Answer 1

Canvas 的內容不一定來自源 URL 圖像，它可以是許多圖像的合成，也可以只是動態生成。

請參閱下面這個示例中的畫布，沒有源圖像，我們在畫布中看到的都是使用 javascript 繪制的，並且由於我使用的是Math.random ，每次運行時圖像都不同。

 const canvas = document.getElementById("c"); canvas.width = canvas.height = 170; const ctx = canvas.getContext("2d"); ctx.translate(85, 85) for (var i = 0; i < 360; i += 2) { var angle = i * Math.PI / 90; var x = Math.cos(angle) * 40; var y = Math.sin(angle) * 40; ctx.beginPath(); var v = Math.random() + 1; ctx.moveTo(x, y); ctx.lineTo(x * v, y * v) ctx.stroke(); }

 <canvas id="c"></canvas>

根據您的需要，如果您可以保證畫布的內容沒有改變getDataUlr()是您的朋友，請保存它然后您可以提供自己的網址。