如何在 HTML 中“解码”一些混淆的 JavaScript？

How to "decode" some obfuscated JavaScript in HTML?

提问by DocWiki

Here is one example:

这是一个例子：

eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\b'+e(c)+'\b','g'),k[c])}}return p}('4.h={H:9(d){T 7.F(9(){g 1=7;1.3={8:4(d.8,7),i:4(d.i,7),m:4.z.J(7),5:d.5,t:d.t,j:d.j,K:d.K,b:d.b,A:d.A};4.h.s(1,0);4(S).v(\'W\',9(){1.3.m=4.z.J(1);4.h.s(1,0);4.h.E(1)});4.h.E(1);1.3.8.v(\'O\',9(){4(1.3.t,7).l(0).a.I=\'P\'}).v(\'R\',9(){4(1.3.t,7).l(0).a.I=\'11\'});4(Z).v(\'10\',9(e){g p=4.z.Y(e);g c=0;k(1.3.b&&1.3.b==\'L\')g r=p.x-1.3.m.x-(1.w-1.3.5*1.3.8.n())/2-1.3.5/2;u k(1.3.b&&1.3.b==\'N\')g r=p.x-1.3.m.x-1.w+1.3.5*1.3.8.n();u g r=p.x-1.3.m.x;g M=B.G(p.y-1.3.m.y-1.X/2,2);1.3.8.F(9(q){6=B.Q(B.G(r-q*1.3.5,2)+M);6-=1.3.5/2;6=6<0?0:6;6=6>1.3.j?1.3.j:6;6=1.3.j-6;C=1.3.A*6/1.3.j;7.a.D=1.3.5+C+\'f\';7.a.o=1.3.5*q+c+\'f\';c+=C});4.h.s(1,c)})})},s:9(1,c){k(1.3.b)k(1.3.b==\'L\')1.3.i.l(0).a.o=(1.w-1.3.5*1.3.8.n())/2-c/2+\'f\';u k(1.3.b==\'o\')1.3.i.l(0).a.o=-c/1.3.8.n()+\'f\';u k(1.3.b==\'N\')1.3.i.l(0).a.o=(1.w-1.3.5*1.3.8.n())-c/2+\'f\';1.3.i.l(0).a.D=1.3.5*1.3.8.n()+c+\'f\'},E:9(1){1.3.8.F(9(q){7.a.D=1.3.5+\'f\';7.a.o=1.3.5*q+\'f\'})}};4.V.U=4.h.H;',62,64,'|el||fisheyeCfg|jQuery|itemWidth|distance|this|items|function|style|halign|toAdd|options||px|var|iFisheye|container|proximity|if|get|pos|size|left|pointer|nr|posx|positionContainer|itemsText|else|bind|offsetWidth|||iUtil|maxWidth|Math|extraWidth|width|positionItems|each|pow|build|display|getPosition|valign|center|posy|right|mouseover|block|sqrt|mouseout|window|return|Fisheye|fn|resize|offsetHeight|getPointer|document|mousemove|none'.split('|'),0,{}))

Obviously, this code is intentionally written to confuse other people. How can I understand it and rewrite it in simple code?

显然，这段代码是故意写来迷惑其他人的。我如何理解它并用简单的代码重写它？

Is there some tool for this job? This is very common in HTML.

这个工作有什么工具吗？这在 HTML 中很常见。

回答by Brad

This is not "encrypted", it is just obfuscated.

这不是“加密”的，它只是被混淆了。

Yes, there are tools available to help, but it isn't a perfect process. All of the original variable names and comments and what not are gone, so a tool can't really add that stuff back in. You have to figure out the details yourself, but a tool can make it easier.

是的，有一些工具可以提供帮助，但这并不是一个完美的过程。所有原始的变量名和注释以及没有的东西都消失了，所以工具不能真正添加​​这些东西。你必须自己弄清楚细节，但工具可以使它更容易。

回答by NullUserException

I wish people would stop doing that. There's just no way to "encrypt" JavaScript. It's an exercise in futility (minification is good, but obfuscation is bad and useless)

我希望人们停止这样做。没有办法“加密”JavaScript。这是徒劳的练习（缩小是好的，但混淆是坏的和无用的）

That being said, try using JSBeautifier. It gives me the following result:

话虽如此，请尝试使用JBeautifier。它给了我以下结果：

jQuery.iFisheye = {
    build: function (options) {
        return this.each(function () {
            var el = this;
            el.fisheyeCfg = {
                items: jQuery(options.items, this),
                container: jQuery(options.container, this),
                pos: jQuery.iUtil.getPosition(this),
                itemWidth: options.itemWidth,
                itemsText: options.itemsText,
                proximity: options.proximity,
                valign: options.valign,
                halign: options.halign,
                maxWidth: options.maxWidth
            };
            jQuery.iFisheye.positionContainer(el, 0);
            jQuery(window).bind('resize', function () {
                el.fisheyeCfg.pos = jQuery.iUtil.getPosition(el);
                jQuery.iFisheye.positionContainer(el, 0);
                jQuery.iFisheye.positionItems(el)
            });
            jQuery.iFisheye.positionItems(el);
            el.fisheyeCfg.items.bind('mouseover', function () {
                jQuery(el.fisheyeCfg.itemsText, this).get(0).style.display = 'block'
            }).bind('mouseout', function () {
                jQuery(el.fisheyeCfg.itemsText, this).get(0).style.display = 'none'
            });
            jQuery(document).bind('mousemove', function (e) {
                var pointer = jQuery.iUtil.getPointer(e);
                var toAdd = 0;
                if (el.fisheyeCfg.halign && el.fisheyeCfg.halign == 'center') var posx = pointer.x - el.fisheyeCfg.pos.x - (el.offsetWidth - el.fisheyeCfg.itemWidth * el.fisheyeCfg.items.size()) / 2 - el.fisheyeCfg.itemWidth / 2;
                else if (el.fisheyeCfg.halign && el.fisheyeCfg.halign == 'right') var posx = pointer.x - el.fisheyeCfg.pos.x - el.offsetWidth + el.fisheyeCfg.itemWidth * el.fisheyeCfg.items.size();
                else var posx = pointer.x - el.fisheyeCfg.pos.x;
                var posy = Math.pow(pointer.y - el.fisheyeCfg.pos.y - el.offsetHeight / 2, 2);
                el.fisheyeCfg.items.each(function (nr) {
                    distance = Math.sqrt(Math.pow(posx - nr * el.fisheyeCfg.itemWidth, 2) + posy);
                    distance -= el.fisheyeCfg.itemWidth / 2;
                    distance = distance < 0 ? 0 : distance;
                    distance = distance > el.fisheyeCfg.proximity ? el.fisheyeCfg.proximity : distance;
                    distance = el.fisheyeCfg.proximity - distance;
                    extraWidth = el.fisheyeCfg.maxWidth * distance / el.fisheyeCfg.proximity;
                    this.style.width = el.fisheyeCfg.itemWidth + extraWidth + 'px';
                    this.style.left = el.fisheyeCfg.itemWidth * nr + toAdd + 'px';
                    toAdd += extraWidth
                });
                jQuery.iFisheye.positionContainer(el, toAdd)
            })
        })
    },
    positionContainer: function (el, toAdd) {
        if (el.fisheyeCfg.halign) if (el.fisheyeCfg.halign == 'center') el.fisheyeCfg.container.get(0).style.left = (el.offsetWidth - el.fisheyeCfg.itemWidth * el.fisheyeCfg.items.size()) / 2 - toAdd / 2 + 'px';
        else if (el.fisheyeCfg.halign == 'left') el.fisheyeCfg.container.get(0).style.left = -toAdd / el.fisheyeCfg.items.size() + 'px';
        else if (el.fisheyeCfg.halign == 'right') el.fisheyeCfg.container.get(0).style.left = (el.offsetWidth - el.fisheyeCfg.itemWidth * el.fisheyeCfg.items.size()) - toAdd / 2 + 'px';
        el.fisheyeCfg.container.get(0).style.width = el.fisheyeCfg.itemWidth * el.fisheyeCfg.items.size() + toAdd + 'px'
    },
    positionItems: function (el) {
        el.fisheyeCfg.items.each(function (nr) {
            this.style.width = el.fisheyeCfg.itemWidth + 'px';
            this.style.left = el.fisheyeCfg.itemWidth * nr + 'px'
        })
    }
};
jQuery.fn.Fisheye = jQuery.iFisheye.build;

Other links (lifted from the very same page):

其他链接（来自同一页面）：

• Chrome: jsbeautify-for-chromeby Tom Rix,
• Chrome: Pretty Beautiful JavaScriptby Will McSweeney,
• Firefox: Javascript deminifierby Ben Murphy, to be used together with the firebug,
• Safari: Safari extensionby Sandro Padin,
• Opera: Readable JavaScriptby Dither,
• Opera: Sourceextension by Deathamns,
• Fiddlerproxy: JavaScript Formatter addon

• Chrome：Tom Rix 的jsbeautify-for-chrome，
• Chrome：Will McSweeney 的非常漂亮的 JavaScript，
• Firefox：Ben Murphy 的Javascript deminifier，与 firebug 一起使用，
• Safari：Sandro Padin 的Safari 扩展，
• Opera：Dither可读的 JavaScript，
• Opera：Deathamns 的源扩展，
• Fiddler代理：JavaScript Formatter 插件

回答by Mark Byers

Using one of the unpackers mentioned on this question:

使用这个问题中提到的解包器之一：

• How to unpack the contents of a Javascript file?

• 如何解压 Javascript 文件的内容？

you can unpack the packed javascript to the following code:

您可以将打包好的 javascript 解压为以下代码：

jQuery.iFisheye = {
    build: function (options) {
        return this.each(function () {
            var el = this;
            el.fisheyeCfg = {
                items: jQuery(options.items, this),
                container: jQuery(options.container, this),
                pos: jQuery.iUtil.getPosition(this),
                itemWidth: options.itemWidth,
                itemsText: options.itemsText,
                proximity: options.proximity,
                valign: options.valign,
                halign: options.halign,
                maxWidth: options.maxWidth
            };
            jQuery.iFisheye.positionContainer(el, 0);
            jQuery(window).bind('resize', function () {
                el.fisheyeCfg.pos = jQuery.iUtil.getPosition(el);
                jQuery.iFisheye.positionContainer(el, 0);
                jQuery.iFisheye.positionItems(el)
            });
            jQuery.iFisheye.positionItems(el);
            el.fisheyeCfg.items.bind('mouseover', function () {
                jQuery(el.fisheyeCfg.itemsText, this).get(0).style.display = 'block'
            }).bind('mouseout', function () {
                jQuery(el.fisheyeCfg.itemsText, this).get(0).style.display = 'none'
            });
            jQuery(document).bind('mousemove', function (e) {
                var pointer = jQuery.iUtil.getPointer(e);
                var toAdd = 0;
                if (el.fisheyeCfg.halign && el.fisheyeCfg.halign == 'center') var posx = pointer.x - el.fisheyeCfg.pos.x - (el.offsetWidth - el.fisheyeCfg.itemWidth * el.fisheyeCfg.items.size()) / 2 - el.fisheyeCfg.itemWidth / 2;
                else if (el.fisheyeCfg.halign && el.fisheyeCfg.halign == 'right') var posx = pointer.x - el.fisheyeCfg.pos.x - el.offsetWidth + el.fisheyeCfg.itemWidth * el.fisheyeCfg.items.size();
                else var posx = pointer.x - el.fisheyeCfg.pos.x;
                var posy = Math.pow(pointer.y - el.fisheyeCfg.pos.y - el.offsetHeight / 2, 2);
                el.fisheyeCfg.items.each(function (nr) {
                    distance = Math.sqrt(Math.pow(posx - nr * el.fisheyeCfg.itemWidth, 2) + posy);
                    distance -= el.fisheyeCfg.itemWidth / 2;
                    distance = distance < 0 ? 0 : distance;
                    distance = distance > el.fisheyeCfg.proximity ? el.fisheyeCfg.proximity : distance;
                    distance = el.fisheyeCfg.proximity - distance;
                    extraWidth = el.fisheyeCfg.maxWidth * distance / el.fisheyeCfg.proximity;
                    this.style.width = el.fisheyeCfg.itemWidth + extraWidth + 'px';
                    this.style.left = el.fisheyeCfg.itemWidth * nr + toAdd + 'px';
                    toAdd += extraWidth
                });
                jQuery.iFisheye.positionContainer(el, toAdd)
            })
        })
    },
    positionContainer: function (el, toAdd) {
        if (el.fisheyeCfg.halign) if (el.fisheyeCfg.halign == 'center') el.fisheyeCfg.container.get(0).style.left = (el.offsetWidth - el.fisheyeCfg.itemWidth * el.fisheyeCfg.items.size()) / 2 - toAdd / 2 + 'px';
        else if (el.fisheyeCfg.halign == 'left') el.fisheyeCfg.container.get(0).style.left = -toAdd / el.fisheyeCfg.items.size() + 'px';
        else if (el.fisheyeCfg.halign == 'right') el.fisheyeCfg.container.get(0).style.left = (el.offsetWidth - el.fisheyeCfg.itemWidth * el.fisheyeCfg.items.size()) - toAdd / 2 + 'px';
        el.fisheyeCfg.container.get(0).style.width = el.fisheyeCfg.itemWidth * el.fisheyeCfg.items.size() + toAdd + 'px'
    },
    positionItems: function (el) {
        el.fisheyeCfg.items.each(function (nr) {
            this.style.width = el.fisheyeCfg.itemWidth + 'px';
            this.style.left = el.fisheyeCfg.itemWidth * nr + 'px'
        })
    }
};
jQuery.fn.Fisheye = jQuery.iFisheye.build;

回答by ruakh

In this case, you can get the original source here: http://interface.eyecon.ro/download. It's not really "obfuscated", in that the goal wasn't really obfuscation; rather, the goal was "compression" (minification), and the tool for that was a compressor/obfuscator.

在这种情况下，您可以在此处获取原始来源：http: //interface.eyecon.ro/download。它并不是真正的“混淆”，因为目标并不是真正的混淆；相反，目标是“压缩”（缩小），而实现这一目标的工具是压缩器/混淆器。

(Of course, the tools that everyone else mentions are indispensable here. I used jsbeautifier.org to find that the whole thing is an assignment to jQuery.iFisheye, which then told me what to Google to find the above.)

（当然，其他人提到的工具在这里是少不了的。我用jsbeautifier.org发现整个东西是一个赋值给jQuery.iFisheye，然后告诉我去谷歌搜索上面的东西。）