toDataURL() 中断 SSL 连接

Posted 2023-03-24

技术标签:

【中文标题】toDataURL() 中断 SSL 连接【英文标题】：toDataURL() breaking SSL connection 【发布时间】：2011-11-08 14:30:34 【问题描述】：

我的问题是我正在使用 canvas .toDataURL() 方法在 Chrome 和 Firefox 上显示图像的预览，但这会导致出现警告，因为该站点通过 SSL 连接。

当我使用toDataURL() 显示图像时收到以下警告消息：

...处的页面显示来自...的不安全内容

这仅在 Chrome 中发生，因为 chrome 在安全网页旁边有该锁：这导致地址栏上的绿色锁将状态更改为警告状态，表示此页面上有不安全的资源。

这是toDataURL() 的预期行为吗？

我不明白为什么它会不安全，因为我没有通过 HTTP 连接获取任何数据，甚至根本没有获取任何数据，因为这一切都是通过 javascript 完成的。但我可能错了，请纠正我。

是否有其他方法可以确保我保护此内容？或者不导致警告发生？（而且我确实需要使用.toDataURL() 方法？）

【问题讨论】：

您可以在 img elem 本身上设置一个标志。 blog.chromium.org/2011/07/… 你能解决这个问题吗？如果是，怎么做？ 【参考方案1】：

在每个浏览器中打开开发者工具控制台并查找他们声称不安全的确切 URL。得知任何一个浏览器都有这样的错误，这将是非常令人惊讶的。 IE7及以下有这个bug，但是根本不支持DATA URL。

【讨论】：

【参考方案2】：

如果您从不安全的位置 (file://) 显示图像，则无法将其移动到安全上下文 (https://) 而不会遇到错误。这可能会导致浏览器将其视为不安全的。