微信小程序前端页面逆向反解脚本
写个微信小程序前端页面逆向反解，下载到的小程序包 wxapkg 解压后得到一个重要的文件 page-freme.html，它是在小程序在发布时将WXML文件和WXSS文件打包而来的，通过他就可逆向得到小程序的WXML或WXSS文件。
关于小程序的打包原理可以参考其他资料：
直接上干货，把以下代码贴到 page-freme.html 中，在浏览器打开并在控制台中输入 render("path/to/your/wxml/page") 就可以得到 wxml 文件内容了。
<textarea name="" id="output" cols="120" rows="80"></textarea>
<script>
function get(id){ return document.getElementById(id); }
function recursive(node, indent){
var attrs = [];
console.log(node);
console.log(typeof(node));
if( typeof(node)=="string" ) return indent+node+"\n";
if( typeof(node.attr)!="undefined" ){
for( var i in node.attr ) attrs.push( i+'="'+node.attr[i]+'"');
}
var children = "";
for( var i in node.children ){
children += recursive(node.children[i], "\t"+indent);
}
var tag = indent+"<tag ".replace("tag",node.tag) + attrs.join(" ") + ">"+(children? "\n":"")
+children
+(children? indent:"")+"</tag>".replace('tag', node.tag)+"\n";
return tag;
}
function render(path){
// __wxAppCode__['pages/rank/rank.wxml']();
// render('pages/rank/rank.wxml');
var pcode = __wxAppCode__[path]? __wxAppCode__[path]():false;
if( !pcode ) return "no this page to this path "+path;
get("output").value=recursive(pcode, "");
}
</script>
wxapkg.png
UPDATE SCRIPT 2018/06/15 端午前
<textarea name="" id="output" cols="80" rows="50" ></textarea>
<script>
function get(id){ return document.getElementById(id); }
function recursive(node, indent){
var attrs = [];
// console.log(node);
// console.log(typeof(node));
if( typeof(node)=="string" ) return indent+node+"\n";
if( typeof(node.attr)!="undefined" ){
for( var i in node.attr ) attrs.push( i+'="'+node.attr[i]+'"');
}
var children = "";
for( var i in node.children ){
children += recursive(node.children[i], "\t"+indent);
}
var tag = indent+"<tag ".replace("tag",node.tag) + attrs.join(" ") + ">"+(children? "\n":"")
+children
+(children? indent:"")+"</tag>".replace('tag', node.tag)+"\n";
return tag;
}
function render(path){
// __wxAppCode__['pages/rank/rank.wxml']();
// render('pages/rank/rank.wxml');
// render('pages/rank/rank.wxss');
if( /\.wxss$/.test(path) ){
// <style type="text/css" wxss:path="./rank/rank/index.wxss">…</style>
var pcode = __wxAppCode__[path]? __wxAppCode__[path]():false;
var styles = document.getElementsByTagName('style');
for(var i=0; i<styles.length; i++){
var p = styles[i].getAttribute("wxss:path");
if( p.indexOf(path)>=0 ){
get("output").value = path + ":\n";
get("output").value += styles[i].innerHTML + ":\n";
break;
}else{
get("output").value = "Unmatched:" + p +"\n";
}
}
}else{
var pcode = __wxAppCode__[path]? __wxAppCode__[path]():false;
if( !pcode ) return "no this page to this path "+path;
get("output").value=recursive(pcode, "");
}
}
get("output").value += "RUN WHAT YOU NEED IN CONSOLE OR PAGE\n";
for(var i in __wxAppCode__){
get("output").value += "__wxAppCode__['"+i+"']();\n";
get("output").value += "render('"+i+"');\n";
console.log('render("'+i+'");');
}
</script>
微信扫一扫打赏坚果
