<h1 id="heading">如何优雅地在北邮打卡、出校</h1>
<p>开源代码见 <a href="https://github.com/OhYee/bupt-scripts">Github OhYee/bupt-scripts</a></p>
<style>
.api {
    margin:1em; 
    display: grid; 
    grid-template-columns: 5em auto; 
    grid-gap:1em;
    border: 2px solid black;
    padding: 0.5em;
    overflow: auto;
}
</style>
<p>由于疫情原因，每天都需要准时打卡上报数据，且出校需要申请。</p>
<p>尽管本质上该政策没有任何问题，但是对于大部分身体处于健康状态的人来说，每天要做的只是重复性地填写上一天已经填写过的东西。特别是请假出校，甚至连辅导员、手机号都需要每次重新填写。</p>
<p>尽管填写这些东西并不需要花费特别多的时间，但是仍然需要在各种连贯性的工作时，去继续执行这件事。对于这些重复性的工作，应该交由代码来解决。只有某天自己真的发烧时，再关闭脚本修改参数。</p>
<p>尽管目前已有相应的打卡脚本，但是不少都使用的 selenium。从结果上看，这些代码可用，但是从过程上看，这些代码极其不优雅。首先是 selenium 本身是模拟浏览器操作，会有额外的性能损耗。其次是 selenium 需要安装浏览器及其对应版本的浏览器驱动。本身一个非常简单的接口功能却需要安装很多实际上用不到的东西，非常浪费资源。</p>
<p>因此这里采用抓包找接口的形式来实现</p>
<h2 id="heading-1">打卡</h2>
<h3 id="heading-2">打卡登录请求</h3>
<p>首先在电脑端的微信打开疫情防控通填报页面，得到链接<code>https://app.bupt.edu.cn/ncov/wap/default/index</code>。<br>
这时如果为登录，会跳转到<code>https://app.bupt.edu.cn/backend/default/login?redirect=%2F</code>请求登录，测试可知这里账号是学号，密码为服务平台密码（默认为身份证后 8 位）</p>
<p>抓包可知，登录为一个 POST 请求，参数为账户和密码</p>
<div class="api">
  <strong>地址</strong>
  <code>https://app.bupt.edu.cn/uc/wap/login/check</code>
  <strong>类型</strong>
  <span>POST</span>
  <strong>参数</strong>
  <div>
<table>
<thead>
<tr>
<th style="text-align:center">参数名</th>
<th style="text-align:center">类型</th>
<th style="text-align:center">解释</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:center"><code>username</code></td>
<td style="text-align:center">字符串</td>
<td style="text-align:center">账号（学号）</td>
</tr>
<tr>
<td style="text-align:center"><code>password</code></td>
<td style="text-align:center">字符串</td>
<td style="text-align:center">密码（默认身份证后 8 位）</td>
</tr>
</tbody>
</table>
  </div>
</div>
<p>返回值为 JSON 格式，其中<code>e</code>字段为状态码，如果为<code>0</code>说明没有问题，否则则需要查看<code>m</code>字段的错误信息</p>
<h3 id="heading-3">打卡请求</h3>
<p>登陆成功后，即可进入打卡页面。由于一天只能打卡一次，因此要测试需要从页面本身着手。</p>
<p>查看页面的源码，可以发现该页面使用 Vue 实现，且未经过混淆，因此可以直接查看按钮逻辑。可以看到打卡按钮调用 Vue 的<code>confirm()</code>方法，并通过添加<code>wapcf-btn-qx</code>来实现禁止点击样式</p>
<pre style="background-color:#fff">&lt;<span style="color:#000080">div</span> <span style="color:#008080">class</span><span style="font-weight:bold">=</span><span style="color:#b84">&#34;footers&#34;</span>&gt;
    &lt;<span style="color:#000080">a</span> <span style="color:#000080">@click</span><span style="color:#b84">=&#34;confirm()&#34;</span> <span style="font-weight:bold">:</span><span style="color:#008080">class</span><span style="font-weight:bold">=</span><span style="color:#b84">&#34;{&#39;wapcf-btn-qx&#39;: hasFlag == 1}&#34;</span> &gt;提交信息(Submit)&lt;/<span style="color:#000080">a</span>&gt;
&lt;/<span style="color:#000080">div</span>&gt;
</pre><p><code>confirm()</code>方法根据 Vue 的成员变量<code>hasFlag</code>来判断状态，如果打卡成功，则其为<code>1</code>。因此，如果想要调试，需要想办法把它重置为<code>0</code></p>
<pre style="background-color:#fff">confirm() {
    <span style="font-weight:bold">if</span>(<span style="font-weight:bold">this</span>.hasFlag <span style="font-weight:bold">==</span> <span style="color:#099">1</span>) {
        wapalert(<span style="color:#b84">&#39;每天只能填报一次，你已提交过（Daily Report can only be submitted once a day. You have already submitted）&#39;</span>,<span style="color:#b84">&#39;确认（Confirm）&#39;</span>);
        <span style="font-weight:bold">return</span> <span style="font-weight:bold">false</span>;
    }
    <span style="font-weight:bold">if</span>(<span style="font-weight:bold">!</span><span style="font-weight:bold">this</span>.valid(<span style="font-weight:bold">this</span>.info)) {
        <span style="font-weight:bold">return</span> <span style="font-weight:bold">false</span>;
    }
    wapconfirm(<span style="color:#b84">&#39;每天只能填报一次，请确认信息是否全部正确？（Daily Report can only be submitted once a day. Please confirm that all the information is correct.）&#39;</span>, <span style="color:#b84">&#39;确认&lt;br&gt;Submit&#39;</span>, <span style="color:#b84">&#39;再看看&lt;br&gt;Check again&#39;</span>, <span style="font-weight:bold">function</span> () {
        vm.save();
    });
},
</pre><p>尽管该页面关闭了调试模式，无法直接使用 Vue Devtools 插件来编辑，但是从源码可以看出，Vue 对象实例被赋值给了<code>vm</code>变量</p>
<pre style="background-color:#fff"><span style="font-weight:bold">var</span> vm <span style="font-weight:bold">=</span> <span style="font-weight:bold">new</span> Vue({
    el<span style="font-weight:bold">:</span> <span style="color:#b84">&#39;.form-detail2&#39;</span>,
    ...
});
</pre><p>那么，在控制台直接设置<code>vm._data.hasFlag=0</code>，即可重置其成员变量。如图，可以看到按钮已经可以点击</p>
<p><div class='image'><a href='//static.oyohyee.com/post/bupt_check_leave.png' target='_blank' rel='noopener noreferrer'><img src="//static.oyohyee.com/post/bupt_check_leave.png" alt="重置按钮状态" /></a><span class="img-title">重置按钮状态</span></div></p>
<p>接下来就可以抓包了。</p>
<p>打卡请求本身没有额外的验证，但是需要提交的参数非常多，不过基本都可以在页面本身就有的内容获取。</p>
<p>在代码中，有两部分重要内容<code>def</code>和<code>oldInfo</code>，前者为全局变量，后者为 Vue 的成员变量。不过在爬虫里直接使用正则表达式提取即可。</p>
<p><div class='image'><a href='//static.oyohyee.com/post/bupt_check_leave_2.png' target='_blank' rel='noopener noreferrer'><img src="//static.oyohyee.com/post/bupt_check_leave_2.png" alt="表单数据来源" /></a><span class="img-title">表单数据来源</span></div></p>
<p>这两个变量中，<code>def</code>是当前表单生成的新数据（如当前的表单提交 ID），<code>oldInfo</code>则是上一次提交的值（前一天的数据）。只需要结合这两者的内容，既可以作为当日的新提交。</p>
<p>经过对比，可以得知需要使用新表单的数据只有<code>date</code>、<code>created</code>、<code>id</code>三项，其余的都可以从<code>oldInfo</code>获取（如果不存在则留空（使用<code>oldInfo.get(&quot;date&quot;,&quot;&quot;)</code>可以在检索字典时，获取默认值））</p>
<p>涉及的字段如下：</p>
<pre style="background-color:#fff">oldKeys <span style="font-weight:bold">=</span> [
    <span style="color:#b84">&#34;ismoved&#34;</span>,    <span style="color:#b84">&#34;jhfjrq&#34;</span>, <span style="color:#b84">&#34;jhfjjtgj&#34;</span>, <span style="color:#b84">&#34;jhfjhbcc&#34;</span>, <span style="color:#b84">&#34;sfxk&#34;</span>, <span style="color:#b84">&#34;xkqq&#34;</span>, <span style="color:#b84">&#34;szgj&#34;</span>, <span style="color:#b84">&#34;szcs&#34;</span>, <span style="color:#b84">&#34;zgfxdq&#34;</span>, <span style="color:#b84">&#34;mjry&#34;</span>, <span style="color:#b84">&#34;csmjry&#34;</span>, <span style="color:#b84">&#34;uid&#34;</span>,  <span style="color:#b84">&#34;tw&#34;</span>, <span style="color:#b84">&#34;sfcxtz&#34;</span>, <span style="color:#b84">&#34;sfyyjc&#34;</span>, <span style="color:#b84">&#34;jcjgqr&#34;</span>, <span style="color:#b84">&#34;jcjg&#34;</span>, <span style="color:#b84">&#34;sfjcbh&#34;</span>, <span style="color:#b84">&#34;sfcxzysx&#34;</span>, <span style="color:#b84">&#34;qksm&#34;</span>, <span style="color:#b84">&#34;remark&#34;</span>, <span style="color:#b84">&#34;address&#34;</span>, <span style="color:#b84">&#34;area&#34;</span>, <span style="color:#b84">&#34;province&#34;</span>, <span style="color:#b84">&#34;city&#34;</span>, <span style="color:#b84">&#34;geo_api_info&#34;</span>,  <span style="color:#b84">&#34;sfzx&#34;</span>, <span style="color:#b84">&#34;sfjcwhry&#34;</span>, <span style="color:#b84">&#34;sfcyglq&#34;</span>, <span style="color:#b84">&#34;gllx&#34;</span>,
    <span style="color:#b84">&#34;glksrq&#34;</span>, <span style="color:#b84">&#34;jcbhlx&#34;</span>, <span style="color:#b84">&#34;jcbhrq&#34;</span>, <span style="color:#b84">&#34;sftjwh&#34;</span>, <span style="color:#b84">&#34;sftjhb&#34;</span>, <span style="color:#b84">&#34;fxyy&#34;</span>, <span style="color:#b84">&#34;bztcyy&#34;</span>, <span style="color:#b84">&#34;fjsj&#34;</span>, <span style="color:#b84">&#34;sfjchbry&#34;</span>, <span style="color:#b84">&#34;sfjcqz&#34;</span>, <span style="color:#b84">&#34;jcqzrq&#34;</span>, <span style="color:#b84">&#34;jcwhryfs&#34;</span>, <span style="color:#b84">&#34;jchbryfs&#34;</span>, <span style="color:#b84">&#34;xjzd&#34;</span>, <span style="color:#b84">&#34;sfsfbh&#34;</span>, <span style="color:#b84">&#34;jhfjsftjwh&#34;</span>, <span style="color:#b84">&#34;jhfjsftjhb&#34;</span>, <span style="color:#b84">&#34;szsqsfybl&#34;</span>, <span style="color:#b84">&#34;sfygtjzzfj&#34;</span>, <span style="color:#b84">&#34;gtjzzfjsj&#34;</span>, <span style="color:#b84">&#34;sfsqhzjkk&#34;</span>, <span style="color:#b84">&#34;sqhzjkkys&#34;</span>, <span style="color:#b84">&#34;created_uid&#34;</span>, <span style="color:#b84">&#34;gwszdd&#34;</span>, <span style="color:#b84">&#34;sfyqjzgc&#34;</span>, <span style="color:#b84">&#34;jrsfqzys&#34;</span>, <span style="color:#b84">&#34;jrsfqzfy&#34;</span>
]
defaultKeys <span style="font-weight:bold">=</span> [
    <span style="color:#b84">&#34;date&#34;</span>, <span style="color:#b84">&#34;created&#34;</span>, <span style="color:#b84">&#34;id&#34;</span>,
]
</pre><p>将拼接好的数据通过 POST 方式发送至<code>https://app.bupt.edu.cn/ncov/wap/default/save</code>即可</p>
<p>同登录接口，这里返回的也是一个 JSON 数据，只需要判断<code>e</code>是否为<code>0</code>即可</p>
<h3 id="heading-4">打卡开源</h3>
<p>代码开源与 Github，使用 Python 实现</p>
<p><a href="https://github.com/OhYee/bupt-scripts/tree/master/check">OhYee/bupt-scripts/check</a></p>
<h2 id="heading-5">请假</h2>
<h3 id="heading-6">请假登录</h3>
<p>请假与打卡使用的是同一个账号系统，但是登录跳转的页面不同。</p>
<p>登录会跳转至<code>https://auth.bupt.edu.cn/authserver/login</code></p>
<p>需要特别注意的是，这个页面为了防止 CSRF 每次都会生成一个不同的 LT 值，因此需要先使用 GET 请求获取该值（可以使用正则表达式<code>&lt;input type=&quot;hidden&quot; name=&quot;lt&quot; value=&quot;(.*)&quot; /&gt;</code>获取），再请求对应的登录接口</p>
<div class="api">
  <strong>地址</strong>
  <code>https://auth.bupt.edu.cn/authserver/login?service=https%3A%2F%2Fme.bupt.edu.cn%2Fsite%2Flogin%2Fcas-login</code>
  <strong>类型</strong>
  <span>POST</span>
  <strong>参数</strong>
  <div>
<table>
<thead>
<tr>
<th style="text-align:center">参数名</th>
<th style="text-align:center">类型</th>
<th style="text-align:center">解释</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:center"><code>username</code></td>
<td style="text-align:center">字符串</td>
<td style="text-align:center">账号（学号）</td>
</tr>
<tr>
<td style="text-align:center"><code>password</code></td>
<td style="text-align:center">字符串</td>
<td style="text-align:center">密码（默认身份证后 8 位）</td>
</tr>
<tr>
<td style="text-align:center"><code>lt</code></td>
<td style="text-align:center">字符串</td>
<td style="text-align:center">需要从页面中获取</td>
</tr>
<tr>
<td style="text-align:center"><code>execution</code></td>
<td style="text-align:center">字符串</td>
<td style="text-align:center">固定为<code>e1s1</code></td>
</tr>
<tr>
<td style="text-align:center"><code>_eventId</code></td>
<td style="text-align:center">字符串</td>
<td style="text-align:center">固定为<code>submit</code></td>
</tr>
<tr>
<td style="text-align:center"><code>rmShown</code></td>
<td style="text-align:center">整数</td>
<td style="text-align:center">固定为<code>1</code></td>
</tr>
</tbody>
</table>
  </div>
</div>
<h3 id="heading-7">请假请求</h3>
<p>登录成功后，即可在<code>https://service.bupt.edu.cn/v2/matter/start?id=578</code>页面进行申请</p>
<p>在请求之前，可以访问<code>https://service.bupt.edu.cn/site/user/get-name</code>获取用户信息，一方面可以获取用户的学院信息，另一方面也是检查登录是否成功</p>
<div class="api">
  <strong>地址</strong>
  <code>https://service.bupt.edu.cn/site/user/get-name</code>
  <strong>类型</strong>
  <span>GET</span>
  </div>
</div>
<p>该接口不需要任何参数，返回值为 JSON 格式的用户信息，可以在<code>college</code>字段获取用户所处学院。</p>
<p>接下来即可正式提交请假请求了</p>
<div class="api">
  <strong>地址</strong>
  <code>https://service.bupt.edu.cn/site/apps/launch</code>
  <strong>类型</strong>
  <span>POST</span>
  <strong>请求头</strong>
   <div>
<table>
<thead>
<tr>
<th style="text-align:center">名称</th>
<th style="text-align:center">值</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:center"><code>x-requested-with</code></td>
<td style="text-align:center"><code>XMLHttpRequest</code></td>
</tr>
</tbody>
</table>
  </div>
  <strong>参数</strong>
  <div>
<table>
<thead>
<tr>
<th style="text-align:center">参数名</th>
<th style="text-align:center">类型</th>
<th style="text-align:center">解释</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align:center"><code>data</code></td>
<td style="text-align:center">字符串</td>
<td style="text-align:center">转码后的 JSON 数据</td>
</tr>
</tbody>
</table>
  </div>
</div>
<p>有两点需要额外注意：</p>
<ol>
<li>这里的数据并非常见的标准格式，而是将 JSON 直接转换为 string（不是 JSON 解码），而后进行 URL 编码放置在 POST body 中。由于 Python 直接将转换成 string 输出的是单引号而非双引号，同时会添加空格，因此在直接转换后需要进一步对其进行修改（详情可见代码）</li>
<li>这里需要添加一个额外的请求头<code>x-requested-with</code>否则会返回 500 错误</li>
</ol>
<h3 id="heading-8">请假开源</h3>
<p>代码开源与 Github，使用 Python 实现</p>
<p><a href="https://github.com/OhYee/bupt-scripts/tree/master/leave">OhYee/bupt-scripts/leave</a></p>
