Cross-origin image load from cross-enabled site is denied(来自跨启用站点的跨域图像加载被拒绝)
问题描述
我正在尝试使用启用 CORS 的图像，该图像位于启用 cors 的站点:dropbox.com.
我遇到了一个错误:CORS 政策拒绝跨域图像加载.
I'm trying to use CORS enabled image which is located on cors-enabled site: dropbox.com.
I've got an error: cross-origin image load denied by CORS policy.
如何解决?
<html>
<body>
<img id="output" src="#"/>
<script>
var img = new Image();
img.crossOrigin = "anonymous";
var canvas = document.createElement("canvas");
img.onload = function () {
canvas.width = img.width;
canvas.height = img.width;
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0);
}
img.src = "https://www.dropbox.com/s/54an0126onoxezj/stone1.png";
var output = document.getElementById("output");
output.src = canvas.toDataURL("image/png");
</script>
</body>
推荐答案
您链接到的页面未启用 CORS，但您实际上并不想下载该页面(即 HTML).您想要在那里显示的图像.该文件的直接链接 启用了 CORS:https://dl.dropboxusercontent.com/s/54an0126onoxezj/stone1.png.
The page you're linking to isn't CORS-enabled, but you don't actually want to download that page (which is HTML) anyway. You want the image that is displayed there. A direct link to that file is CORS-enabled: https://dl.dropboxusercontent.com/s/54an0126onoxezj/stone1.png.
将共享链接转换为直接链接的方法是将域从 www.dropbox.com 更改为 dl.dropboxusercontent.com.请参阅 https://www.dropbox.com/developers/blog/53/programmatically-download-content-from-share-links.
The way to convert a share link to a direct link is to change the domain from www.dropbox.com to dl.dropboxusercontent.com. See https://www.dropbox.com/developers/blog/53/programmatically-download-content-from-share-links.
这篇关于来自跨启用站点的跨域图像加载被拒绝的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！
本文标题为：来自跨启用站点的跨域图像加载被拒绝
基础教程推荐
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 直接将值设置为滑块 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块，而不捆绑我的代码吗？ 2022-01-01
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- 如何使用JIT在顺风css中使用布局变体？ 2022-01-01
- Chart.js 在线性图表上拖动点 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01
