master

分支 (1)

管理

管理

master

xzctf
/
index.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>小卓CTF练习平台</title>
<script>
  onload = ()=>{
    init();
    list();
    请遵守开源协议不删版权信息();
  };
  let init = ()=>{
    let title = $('h1');
    title.innerText = '小卓CTF练习平台';
    box = $('div');
    box.type = {};
    push(box, title);
    box.black = $('div');
    box.style.cssText = 'width:850px;margin:35px auto;transition:1s;';
    box.black.style.cssText = 'width:100%;height:-webkit-fill-available;position:fixed;z-index:-1;transition:1s;background:url("data:image/svg+xml;base64,PHN2ZyBjbGFzcz0ibXlzdmciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDE2MDAgOTAwIj48ZGVmcz48bGluZWFyR3JhZGllbnQgaWQ9ImEiIHgxPSIwIiB4Mj0iMCIgeTE9IjEiIHkyPSIwIj48c3RvcCBvZmZzZXQ9IjAiIHN0b3AtY29sb3I9IiMwRkYiPjwvc3RvcD48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiNDRjYiPjwvc3RvcD48L2xpbmVhckdyYWRpZW50PjxsaW5lYXJHcmFkaWVudCBpZD0iYiIgeDE9IjAiIHgyPSIwIiB5MT0iMCIgeTI9IjEiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI0YwMCI+PC9zdG9wPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI0ZDMCI+PC9zdG9wPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxnIGZpbGw9IiNGRkYiIGZpbGwtb3BhY2l0eT0iMCIgc3Ryb2tlLW1pdGVybGltaXQ9IjEwIj48ZyBzdHJva2U9InVybCgjYSkiIHN0cm9rZS13aWR0aD0iMiI+PHBhdGggdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCAwKSIgZD0iTTE0MDkgNTgxIDE0NTAuMzUgNTExIDE0OTAgNTgxeiI+PC9wYXRoPjxjaXJjbGUgc3Ryb2tlLXdpZHRoPSI0IiB0cmFuc2Zvcm09InJvdGF0ZSgwIDgwMCA0NTApIiBjeD0iNTAwIiBjeT0iMTAwIiByPSI0MCI+PC9jaXJjbGU+PHBhdGggdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCAwKSIgZD0iTTQwMC44NiA3MzUuNWgtODMuNzNjMC0yMy4xMiAxOC43NC00MS44NyA0MS44Ny00MS44N1M0MDAuODYgNzEyLjM4IDQwMC44NiA3MzUuNXoiPjwvcGF0aD48L2c+PGcgc3Ryb2tlPSJ1cmwoI2IpIiBzdHJva2Utd2lkdGg9IjQiPjxwYXRoIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgMCkiIGQ9Ik0xNDkuOCAzNDUuMiAxMTguNCAzODkuOCAxNDkuOCA0MzQuNCAxODEuMiAzODkuOHoiPjwvcGF0aD48cmVjdCBzdHJva2Utd2lkdGg9IjgiIHRyYW5zZm9ybT0icm90YXRlKDAgMTA4OSA3NTkpIiB4PSIxMDM5IiB5PSI3MDkiIHdpZHRoPSIxMDAiIGhlaWdodD0iMTAwIj48L3JlY3Q+PHBhdGggdHJhbnNmb3JtPSJyb3RhdGUoMCAxNDAwIDEzMikiIGQ9Ik0xNDI2LjggMTMyLjQgMTQwNS43IDE2OC44IDEzNjMuNyAxNjguOCAxMzQyLjcgMTMyLjQgMTM2My43IDk2IDE0MDUuNyA5NnoiPjwvcGF0aD48L2c+PC9nPjwvc3ZnPg==");';
    box.black.innerHTML = '<div id="flagright" style="width:max-content;background:#fff;border-radius:10px;box-shadow:0 0 15px 0 #999;padding:15px 30px;font-size:18px;margin:30px auto;display:none;"><span style="width:20px;height:20px;color:#fff;background:#5b3;border:1px solid #aaa;border-radius:50%;text-align:center;line-height:20px;font-size:14px;display:inline-block;margin:5px;">✔</span><h4 style="display:inline;">Flag正确</h4><br>恭喜你作答正确题目：<span id="flagtitle"></span></div>';
    box.black.onclick = (e)=>{
      if(e.target!=box.black || box.ctf[0].style.display=='none')return;
      box.ctf[0].style.display = 'none';
      box.style.filter = 'blur(0px)';
      setTimeout(()=>box.black.style.zIndex='-1',1500);
      document.body.style.background = 'rgba(0,0,0,0.0)';
    }
    box.ctf = ['div','h3','p','input','div'].map(x=>$(x));
    box.ctf.slice(1).forEach(x=>push(box.ctf[0], x));
    hash = async x=>[...new Uint8Array(await crypto.subtle.digest('SHA-1',new TextEncoder().encode(x)))].map(x=>x.toString(16).padStart(2,0)).join('');
    box.ctf[0].style.cssText = 'margin:80px auto;max-width:800px;width:max-content;background:#fff;border:1px solid #000;border-radius:5px;padding:30px 30px 80px 30px;display:none;'
    box.ctf[2].style.cssText = 'padding:30px;max-height:400px;overflow-y:auto;';
    push(box.black, box.ctf[0]);
    push(document.body, box.black);
    push(document.body, box);
  };
  let list = async ()=>{
    (await (await fetch('problems.json')).json())
    .forEach(({category, title, intro, flag})=>{
      let type = box.type[category]||$('div');
      if(!type.children[0]){
        let title = $('h2');
        title.innerText = category;
        box.type[category] = type;
        push(type, title); push(box, type);
        type.style.cssText = 'width:850px;display:inline-block;';
      }
      let ctf = $('div');
      ctf.innerText = title;
      ctf.content = {title, intro, flag};
      ctf.style.cssText = 'width:200px;height:100px;margin:15px;line-height:100px;'+css;
      if(localStorage.getItem(ctf.content.title))ctf.style.background='#5b3';
      ctf.onclick = e=>show(e.target); push(type, ctf);
    });
    box.ctf[3].type = 'text';
    box.ctf[4].innerText = '提交';
    box.ctf[3].style.cssText = 'width:300px;padding:10px;float:left;border-radius:5px;';
    box.ctf[4].style.cssText = 'width:60px;margin:0px 15px;line-height:40px;'+css;
  };
  let $ = tag=>document.createElement(tag);
  let push = (p, c)=>p.appendChild(c);
  let css = 'float:left;background:#49f;border-radius:5px;cursor:pointer;text-align:center;font-size:16px;color:#fff;';
  let show = (ctf)=>{
    box.black.style.zIndex = '1';
    box.style.filter = 'blur(5px)';
    document.body.style.background = 'rgba(0,0,0,0.3)';
    setTimeout(()=>{box.ctf[0].style.display='block';box.ctf[3].focus();},500);
    box.ctf[1].innerText = ctf.content.title;
    box.ctf[2].innerHTML = ctf.content.intro;
    box.ctf[3].value = localStorage.getItem(ctf.content.title)||'';
    box.ctf[3].onkeypress = e=>e.keyCode==13?box.ctf[4].click():0;
    box.ctf[4].onclick = async ()=>{
      if(box.ctf[4].innerText != '提交')return;
      if(await hash(box.ctf[3].value) == ctf.content.flag){
        box.black.click();
        ctf.style.background = '#5b3';
        flagright.style.display = 'block';
        flagtitle.innerText = ctf.content.title;
        setTimeout(()=>flagright.style.display='none',1500);
        localStorage.setItem(ctf.content.title, box.ctf[3].value);
        return;
      }
      box.ctf[4].innerText = '错误'; box.ctf[4].style.background = '#d33';
      setTimeout(()=>{box.ctf[4].innerText='提交';box.ctf[4].style.background='#49f';},3000);
      ('left,center,right,'.repeat(2)+'center').split(',').forEach((x,i)=>{
        setTimeout(()=>box.ctf[4].style.textAlign=x, i*60);
      });
    };
  };
  let 请遵守开源协议不删版权信息 = ()=>{
    let 版权信息 = $('div');
    版权信息.style.textAlign = 'center';
    版权信息.innerHTML = 'Deployed by <a href="https://github.com/mmdjiji/ctfe">CTFe</a>(<a href="https://github.com/mmdjiji">Author:JiJi</a>) in <a href="https://choosealicense.com/licenses/gpl-3.0/">GPLv3.0</a> license.';
    push(document.body, 版权信息);
  };
</script>
</head>
<body></body>
</html>