0

在我的网站中，我有一个按钮，每当用户单击它时，它都会为他下载一个随机图像，这里是下载图像的代码：

const downloadImg = (src) => {
    const imgName = src.replace(/^.*[\\\/]/, '');

    var a = document.createElement('a');
    a.href = src;
    a.download = imgName;
    a.click();
};

这适用于来自开放网站（如 google.com 或 Wikipedia commons）的图像

但是，对于来自诸如 Pixabay、Pexels、Freepik 等网站的图像，它不会下载图像，而是在同一选项卡中打开图像 URL 并在控制台中给我 403 禁止错误

我完全理解为什么会发生这个错误，但我不明白如何解决它？如果我right-clicked在图像上然后点击save image as不会出现错误，并且我将能够正常下载图像，我如何以编程方式使用 javascript 做到这一点？

4

1 回答 1

0

它使用此处接受的答案中的方法工作：Chrome 65 blocks cross-origin <a download>。强制下载的客户端解决方法？, 有微小的变化。而不是使用模式“cors”使用“no-cors”。显然，直接从 url 下载时，某些域存在 cors 错误。

更新：如果服务器不允许跨域请求，它不起作用。使用“no-cors”发出请求将成功，但响应正文将不可用。所以这不是一个解决方案。

于 2021-05-15T11:23:58.897 回答