首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >javascript atob返回'String包含无效字符‘

javascript atob返回'String包含无效字符‘
EN

Stack Overflow用户
提问于 2012-03-20 20:12:12
回答 4查看 41.3K关注 0票数 25

我有一个从Github API获取信息的AJAX调用。它以base64编码返回,但是当我尝试解码它时,我得到了前面提到的错误。

以前有没有人遇到过这种情况,并且知道发生了什么?服务器返回的信息通过基于web的解码器运行得很好。也许它在一个变量中被破坏了一点?IDK :/

(function () {
    'use strict';

    var objectsList = [];
    var isParsing = 0;
    var insertArea = $('body');

    function makeAJAXCall(hash, cb) {
        $.ajaxSetup({
            Accept: 'Application/vnd.github.raw+json',
            dataType: 'jsonp'
        });

        $.ajax({
            url: hash,
            success: function (json) {
                if (cb) {
                    cb(json);
                }
            },
            error: function (error) {
                console.error(error);
                throw error;
            }
        });
    }

    function parseBlob(hash, cb) {
        makeAJAXCall(hash, function (returnedJSON) {  // no loop as only one entry
            if (cb) {
                cb(returnedJSON.data.content);
            }
        });
    }

    function addSVGToPage(SVGToAdd) {
        var entry, decodedEntry;
        makeAJAXCall(SVGToAdd, function (returnedJSON) {
            console.info(window.atob(returnedJSON.data.content));
        });
    }

    function parseTree(hash) {
        var i, entry;
        var tree = 'https://api.github.com/repos/myusername/SVG-Shapes/git/trees/' + hash;

        makeAJAXCall(tree, function (returnedJSON) {
            for (i = 0;  i < returnedJSON.data.tree.length; i += 1) {
                entry = returnedJSON.data.tree[i];

                if (entry.type === 'blob') {
                    if (entry.path.slice(-4) === '.svg') {     // we only want the svg images not the ignore file and README etc
                        addSVGToPage(entry.url);
                    }
                } else if (entry.type === 'tree') {
                    parseTree(entry.sha);
                }
            }
        });
    }

    $(document).ready(function () {
        parseTree('master');
    });
}());

编辑:下面是一个console.info(returnedJSON.data.content)返回的示例;

PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCFET0NU WVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0 cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRk Ij4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHht bG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJz aW9uPSIxLjEiIGhlaWdodD0iMjQiIHdpZHRoPSI0MDAiPgkKCTxkZWZzPgoJ CTxwYXR0ZXJuIGlkPSJzdHJpcGVkYmFjayIgaGVpZ2h0PSIyMCIgd2lkdGg9 IjIwIiB5PSIyIiBwYXR0ZXJuVW5pdHM9InVzZXJTcGFjZU9uVXNlIiBvdmVy Zmxvdz0ic2Nyb2xsIj4KCQkJPGcgdHJhbnNmb3JtPSJza2V3WCgtMjApIj4K CQkJCTxyZWN0IHg9Ii0xMCIgeT0iMCIgd2lkdGg9IjEwIiBoZWlnaHQ9IjIw IiBzdHJva2U9Im5vbmUiIGZpbGw9IiNGMkYyRjIiLz4KCQkJCTxyZWN0IHg9 IjAiIHk9IjAiIHdpZHRoPSIxMCIgaGVpZ2h0PSIyMCIgc3Ryb2tlPSJub25l IiBmaWxsPSIjRTJFMkUyIi8+CgkJCQk8cmVjdCB4PSIxMCIgeT0iMCIgd2lk dGg9IjEwIiBoZWlnaHQ9IjIwIiBzdHJva2U9Im5vbmUiIGZpbGw9IiNGMkYy RjIiLz4KCQkJCTxyZWN0IHg9IjIwIiB5PSIwIiB3aWR0aD0iMTAiIGhlaWdo dD0iMjAiIHN0cm9rZT0ibm9uZSIgZmlsbD0iI0UyRTJFMiIvPgoJCQk8L2c+ CgkJPC9wYXR0ZXJuPgoKCQk8cmVjdCBpZD0iaW5uZXJjdXQiIHg9IjIiIHkg PSIxIiB3aWR0aD0iMzk2IiBoZWlnaHQ9IjIyIi8+CgoJCTxjbGlwUGF0aCBp ZD0ibG9hZGNsaXAiPgoJCQk8dXNlIHhsaW5rOmhyZWY9IiNpbm5lcmN1dCIv PgoJCTwvY2xpcFBhdGg+Cgk8L2RlZnM+CgoJPHJlY3Qgd2lkdGg9IjQwMCIg aGVpZ2h0PSIyNCIgeD0iMCIgeT0iMCIgc3R5bGU9InN0cm9rZS13aWR0aDoy cHg7c3Ryb2tlOmdyZXk7Ii8+ICA8IS0tIEJhY2tpbmcgcmVjdC9mcmFtZSAt LT4KCgk8ZyBjbGlwLXBhdGg9InVybCgjbG9hZGNsaXApIj4KCQk8cmVjdCB4 PSItMTgiIHkgPSIyIiB3aWR0aD0iNTE2IiBoZWlnaHQ9IjIwIiBzdHlsZT0i c3Ryb2tlLXdpZHRoOjBweDtzdHJva2U6Z3JleTsiIGZpbGw9InVybCgjc3Ry aXBlZGJhY2spIj4KCQkJPGFuaW1hdGVUcmFuc2Zvcm0KCQkgICAgICAgIGF0 dHJpYnV0ZVR5cGU9IlhNTCIKCQkgICAgICAgIGF0dHJpYnV0ZU5hbWU9InRy YW5zZm9ybSIKCQkgICAgICAgIHR5cGU9InRyYW5zbGF0ZSIKCQkJCWZyb209 IjIwIiB0bz0iMCIKCQkJCWJlZ2luPSIwcyIgZHVyPSIwLjZzIgoJCQkJcmVw ZWF0Q291bnQ9ImluZGVmaW5pdGUiCgkJCQlhZGRpdGl2ZT0ic3VtIi8+CgkJ PC9yZWN0PgoJPC9nPgo8L3N2Zz4K
EN

回答 4

Stack Overflow用户

回答已采纳

发布于 2012-03-25 00:51:21

由于响应中的换行符,atob中断。删除它们以使代码正常工作:

function addSVGToPage(SVGToAdd) {
    var entry, decodedEntry;         // <-- What is this doing here? It's unused.
    makeAJAXCall(SVGToAdd, function (returnedJSON) {
        console.info(window.atob(returnedJSON.data.content.replace(/\s/g, '')));
        //                                                ^^^^^^^^^^^^^^^^^^^
    });
}
票数 28
EN

Stack Overflow用户

发布于 2012-03-20 20:17:57

根据MDN docs的说法,您可能需要先使用escape,然后使用decodeURIComponent来处理unicode:

function utf8_to_b64( str ) {
    return window.btoa(unescape(encodeURIComponent( str )));
}

function b64_to_utf8( str ) {
    return decodeURIComponent(escape(window.atob( str )));
}

// Usage:
utf8_to_b64('✓ à la mode'); // "4pyTIMOgIGxhIG1vZGU="
b64_to_utf8('4pyTIMOgIGxhIG1vZGU='); // "✓ à la mode"
票数 31
EN

Stack Overflow用户

发布于 2019-08-12 18:37:06

我这里有一个更好的解决方案:

现场演示:https://codepen.io/arliang/pen/mNQayE?editors=1111

// https://best33.com/311.moe

function base64encode(str) {
  let encode = encodeURIComponent(str).replace(/%([a-f0-9]{2})/gi, (m, $1) => String.fromCharCode(parseInt($1, 16)))
  return btoa(encode)
}
function base64decode(str) {
  let decode = atob(str).replace(/[\x80-\uffff]/g, (m) => `%${m.charCodeAt(0).toString(16).padStart(2, '0')}`)
  return decodeURIComponent(decode)
}

function tests() {
  Array.from([
    /*鼠、牛、虎、兔、龙、蛇、马、羊、猴、鸡、狗、猪*/
    '',
    '测试'
  ])
  .forEach(text => {
    try{
      console.assert(btoa(atob(text)) === text, `btoa(atob('${text}')) === '${text}' fail`)
    } catch(e) {
      // console.error(`btoa(atob('${text}')) === '${text}' fail`, e)
    }
    console.assert(base64decode(base64encode(text)) === text, 'pass')
  })
  console.log(`Open the console and click this link: data:text/html;base64,${base64encode('')}`)
}
tests()
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/9786508

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档