首页 > 解决方案 > Javascript 小书签图像下载损坏图像

问题描述

我创建了一个 javascript 小书签,用于下载页面上最大的图像,但无法查看下载的图像:

javascript:(
function(){
    images = document.querySelectorAll("img");
    image=images[0];
    for (i of images) {
        if (i.height * i.width  > image.height * image.width) { image = i };
    };
    var pom = document.createElement('a');
    pom.setAttribute('href', 'data:application/octet-stream,' + encodeURIComponent(image.src));
    pom.setAttribute('download', image.src);
    pom.style.display = 'none';
    document.body.appendChild(pom);
    pom.click();
    document.body.removeChild(pom);
}
)();

如果我改用下面的行,它将在另一个选项卡中打开文件而不是保存它。

pom.href=image.src;
pom.download = image.src;

因此,我使用了另一个 SO 答案中的以下行,该答案下载了图像但未打开:

pom.setAttribute('href', 'data:application/octet-stream,' + encodeURIComponent(image.src));

我认为这个问题很可能是一个编码问题,但我不知道如何解决它。有什么帮助吗?

编辑:

在这里找到了解决方案:Chrome 65 blocks cross-origin <a download>。强制下载的客户端解决方法? 但它仅在我将命令粘贴到控制台时才有效。当我将它放入书签时,我得到相同的“无法读取标题。图像过大或损坏”错误。

标签: javascriptbookmarklet

解决方案


推荐阅读