toDataURL() 中断 SSL 连接
我的问题是，我使用 canvas .toDataURL() 方法在 Chrome 和 Firefox 上显示图像预览，但这会导致出现警告，因为该网站通过 SSL 连接。
当我使用 toDataURL() 显示图像时收到以下警告消息：
位于...的页面显示来自...的不安全内容。
这只发生在 Chrome 中，因为 Chrome 在安全网页旁边有“锁定”： 这会导致地址栏上的绿锁状态更改为警告状态，表示此页面上存在不安全的资源。
这是 toDataURL() 的预期行为吗？
我不明白为什么它会不安全，因为我没有通过 HTTP 连接获取任何数据，甚至根本没有获取任何数据，因为这一切都是通过 JavaScript 完成的。 但我可能错了，请纠正我。
我是否有其他方法可以确保我保护该内容？或者不导致警告发生？ （我确实需要使用 .toDataURL() 方法？）
my problem is that I am using the canvas .toDataURL() method to display a preview of an image on Chrome and Firefox but that is causing a warning to appear because the site is over a SSL connection.
I get the following warning message when I display the image using toDataURL():
The page at ... displayed insecure content from ....
This only happens in Chrome since chrome has that Lock next to secure web pages:
Which causes the Green Lock on the address bar to change state to a warning state saying that there are resources on this page that are not secure.
Is this an expected behavior for toDataURL()?
I don't see why it would be unsecure since I am not fetching any data over an HTTP connection or even fetching any data at all since it is all done via JavaScript.
But I am probably wrong, please correct me.
Is there a different way for me to make sure I am securing this content? Or to not cause the warning to occur? (And I do need to use the .toDataURL() method?)
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
在每个浏览器中打开开发人员工具控制台，并查找他们声称不安全的确切 URL。如果得知任一浏览器都有这样的错误，那将是非常令人惊讶的。 IE7及以下版本有这个bug，但它们根本不支持DATA URL。
Open the Developer Tools console in each browser and look for the exact URL that they're claiming is insecure. It would be very surprising to learn that either browser has such a bug. IE7 and below have this bug, but they don't support DATA URLs at all.
如果您从不安全的位置 (file://) 显示图像，则无法将其移动到安全上下文 (https://) 而不会出现错误。这可能会导致浏览器将其视为不安全。
推荐阅读：
SECURITY_ERR：DOM异常18关于在 Chrome 扩展程序中使用 getImageData
HTML5 Canvas - origin-clean 标志如何设置为 false？
If you're displaying the image from an unsecure location (file://) you can't move it to a secure context (https://) without running into errors. This might be causing the browser to treat it as insecure.
Recommended reading:
SECURITY_ERR: DOM Exception 18 on using getImageData in a Chrome Extension
HTML5 Canvas - How does the origin-clean flag get set to false?