堆栈内存溢出
  繁体   English   中英

无法在“窗口”上执行“atob”

[英]Failed to execute 'atob' on 'Window'

 原文  2014-03-22 13:59:35  2   6    javascript/ jquery/ html

问题描述

当用户按下ctrl + s键但 Chrome 崩溃时，我试图将我的 HTML 文件保存在 Chrome 中。

（我只想下载我的 HTML 文件的源代码）

我读到它发生是因为我的文件大于 1.99M ..

在第一次尝试中（在我知道 Chrome 崩溃之前）：

function download(filename, text) {
    var pom = document.createElement('a');
    pom.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));
    pom.setAttribute('download', filename);
    pom.click();
}

download('test.html', "<html>" + document.getElementsByTagName('html')[0].innerHTML + "</html>");

第二次尝试，在我阅读了有关崩溃的信息后，我使用了blob ：

function dataURItoBlob(dataURI) {
    var byteString = atob(dataURI.split(',')[1]);

    var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0]

    var ab = new ArrayBuffer(byteString.length);
    var ia = new Uint8Array(ab);
    for (var i = 0; i < byteString.length; i++) {
        ia[i] = byteString.charCodeAt(i);
    }

    var bb = new BlobBuilder();
    bb.append(ab);
    return bb.getBlob(mimeString);
}

function download(dataURI) {
    var blob = dataURItoBlob(dataURI);
    var url  = window.URL.createObjectURL(blob);
    window.location.assign(url);
}

download("<html>" + document.getElementsByTagName('html')[0].innerHTML + "</html>")

在这里我得到了错误： Failed to execute 'atob' on 'Window': The string to be decoded is not correctly encoded.

我不知道，但我读到我需要将我的字符串编码为 base64： 如何在 JavaScript 中将字符串编码为 Base64？

有148票的答案。 我将它粘贴到我的代码中，不知道如何继续。

我应该在哪里调用它以及如何调用它？ 我可以在我保存的文件上命名吗？

我认为我需要做类似的事情：

download(_utf8_decode("<html>" + document.getElementsByTagName('html')[0].innerHTML + "</html>"))

6 个解决方案

解决方案1
 29 已采纳  2014-03-26 03:00:06

BlobBuilder已过时，请改用Blob构造函数：

URL.createObjectURL(new Blob([/*whatever content*/] , {type:'text/plain'}));

这将返回一个 blob URL，然后您可以在锚点的href使用该 URL。 您还可以修改锚点的download属性来操作文件名：

<a href="/*assign url here*/" id="link" download="whatever.txt">download me</a>

摆弄。 如果我没记错的话，对受信任的非用户发起的下载有任意限制； 因此，我们将坚持点击链接，该链接被视为用户发起的 :)

更新：保存当前文档的 html 实际上非常简单！ 每当我们的交互式链接被点击时，我们都会用相关的 blob 更新它的href 。 执行点击绑定事件后，这就是将被导航到的下载 URL！

$('#link').on('click', function(e){
  this.href = URL.createObjectURL(
    new Blob([document.documentElement.outerHTML] , {type:'text/html'})
  );
});

再次摆弄。

解决方案2
 9  2014-03-25 21:50:11

在这里我收到错误： Failed to execute 'atob' on 'Window': The string to be decoded is not correctly encoded.

因为您没有传递 base64 编码的字符串。 看看你的函数：出于某种原因， download和dataURItoBlob都需要一个数据 URI ； 但是，您正在传递一个纯 html 标记字符串以在您的示例中download 。

HTML 不仅作为 base64 无效，而且您在其上调用.split(',')[1]会产生undefined - 而且"undefined"也不是有效的 base64 编码字符串。

我不知道，但我读到我需要将字符串编码为 base64

这对我来说没有多大意义。 您想以某种方式对其进行编码，然后才对其进行解码？

我应该怎么称呼以及如何称呼？

将download函数的接口改回接收filename和text参数的位置。

请注意， BlobBuilder不仅支持附加整个字符串（因此您不需要创建那些ArrayBuffer东西），而且不推荐使用Blob构造函数。

我可以在我保存的文件上命名吗？

是的。 不要使用Blob构造函数，而是使用File构造函数。

function download(filename, text) {
    try {
        var file = new File([text], filename, {type:"text/plain"});
    } catch(e) {
        // when File constructor is not supported
        file = new Blob([text], {type:"text/plain"});
    }
    var url  = window.URL.createObjectURL(file);
    …
}

download('test.html', "<html>" + document.documentElement.innerHTML + "</html>");

请参阅没有链接的 JavaScript blob 文件名，了解如何处理该对象 url，仅将当前位置设置为它不起作用。

解决方案3
 5  2021-02-10 06:31:16

您不需要将整个编码字符串传递给atob方法，您需要拆分编码字符串并将所需字符串传递给atob方法

 const token= "eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiJob3NzYW0iLCJUb2tlblR5cGUiOiJCZWFyZXIiLCJyb2xlIjoiQURNSU4iLCJpc0FkbWluIjp0cnVlLCJFbXBsb3llZUlkIjoxLCJleHAiOjE2MTI5NDA2NTksImlhdCI6MTYxMjkzNzA1OX0.8f0EeYbGyxt9hjggYW1vR5hMHFVXL4ZvjTA6XgCCAUnvacx_Dhbu1OGh8v5fCsCxXQnJ8iAIZDIgOAIeE55LUw" console.log(atob(token.split(".")[1]));

解决方案4
 2  2014-03-25 22:16:36

这是一个更新的小提琴，用户的输入自动保存在本地存储中。 每次重新运行小提琴或刷新页面时，都会恢复以前的状态。 这样你就不需要提示用户保存，它只是自己保存。

http://jsfiddle.net/tZPg4/9397/

堆栈溢出要求我包含一些带有 jsFiddle 链接的代码，因此请忽略代码段：

localStorage.setItem(...)

解决方案5
 2  2019-07-03 12:24:57

就我而言，我快疯了，因为要解码的字符串没有任何问题，因为我可以在在线工具上成功解码它。 直到我发现你首先必须decodeURIComponent你正在解码的东西，像这样：

atob(decodeURIComponent(dataToBeDecoded));

解决方案6
 0  2022-01-07 12:14:57

我有同样的错误，我发现的修复是在 messing.usePublicVapidKey('PAIR KEY') 我使用服务器密钥，它需要“配对密钥”。 您可以在https://console.firebase.google.com/project/_/settings/cloudmessaging/ 中找到该信息

所以该函数的值是控制台中的对键，我很困惑并把服务器键 🤦‍♂️ 并创建了 Uncaught DOMException 的错误：无法在 'Window' 上执行 'atob'：。

暂无
暂无

声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 AngularJS Promise和顶级过滤器。 无法在“窗口”上执行“ atob” 使用 atob 在前端解码 JWT 令牌使我无法在“窗口”错误上执行“atob” 使用“atob”命令时出错 - 无法在“窗口”上执行“atob”：要解码的字符串未正确编码 DOMException: 无法在 &#39;Window&#39; 上执行 &#39;atob&#39;：要解码的字符串未正确编码。 有效载荷大小有问题吗？ base64ToArrayBuffer 错误：无法在“窗口”上执行“atob”。 （网络音频 API） （重新工具）向 GCS 创建一个“.txt”文件，但我收到错误“无法在 'Window' 上执行 'atob'：要解码的字符串未正确编码。” 赛普拉斯中的测试顺序重要吗？ 当上传 pdf 文件的测试在开始时它们通过时，在结束时：无法在 Window 上执行 atob 无法在 Ajax 上的窗口上执行 postMessage TypeError：无法在“窗口”上执行“获取” 无法在“窗口”GoogleTagManager 上执行“postMessage”
相关标签
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM