标签归档:腾讯云

上海公安出入境微信查询系统改进

最近再使用上海公安出入境的微信预约办理大陆证,网上预约与查询都很方便。唯一让我不爽的就是它每次都要让我重新输入身份证号和姓名,于是我做了简单的修改,自己用

出入境微信查询页面
查询页面:http://1251026295.cdn.myqcloud.com/1251026295/CRJ/page/yycheck.html

值得学习的几个地方

  1. 考虑到查询的量可能会特别的大,所以出入境使用了腾讯云(这也是我第一次听说腾讯也在做云)
  2. 考虑到页面展示与动态查询的分离,它使用了JSONP的方式做查询

非常令人抓狂的地方

在你输入身份证查询预约信息以后,再返回页面想查询办件进度查询,必须要再输入身份证与姓名信息,非常的不人性化

解决方案

  1. 最好的解决方案当然是使用跟微信号绑定的方式,如果查询到这个微信用户已经登录过,去后台取用户信息直接返回用户查询结果就好了,这是一种最直接也是最安全的方式,但我们这次改造是接触不到后台的,所以这个方案在前端改造行不通
  2. 使用本地存储,将身份证和姓名记录到本地,当页面初始化的时候,调用方法读取本地的数据。但这样做有一个巨大的问题,就是用户的信息很容易被其他用户数据读取。

具体实施

  1. 复制上面的查询页面
  2. 粘贴到自己新建的html中
  3. 在head中增加base标签
  4. 在上方增加读取本地信息代码

base标签

<base href="http://1251026295.cdn.myqcloud.com/1251026295/CRJ/page/"/>

读取本地信息代码

$(function() {
    if (window.localStorage) {
        var ck_number = localStorage.getItem('ck_number');
        var ck_name = localStorage.getItem('ck_name');
        var ck_id = localStorage.getItem('ck_id');
        if (ck_number) {
            $('#ck_number').val(ck_number);
        }
        if (ck_name) {
            $('#ck_name').val(ck_name);
        }
        if (ck_id) {
            $('#' + ck_id).click();
        }

        $('#ck_sub').click(function() {
            ck_number = $('#ck_number').val();
            ck_name = $('#ck_name').val();
            ck_id = $(':radio[checked]').attr('id');
            if (ck_number) {
                localStorage.setItem('ck_number', ck_number);
            }
            if (ck_name) {
                localStorage.setItem('ck_name', ck_name);
            }
            if (ck_id) {
                localStorage.setItem('ck_id', ck_id);
            }
        });
    }

});

使用中出现的问题

在使用中会出现部分微信的Android手机不能读取到用户信息的问题,开始以为是localStorage的问题,查找结果显示,即使换成了Cookie也存在同样的问题。网上给出的建议还是使用微信绑定的方式来的更直观和安全以些,这个方式只能是个临时解决方案

最后,还是希望出入境开发人员做简单的调整,让我们以更安全更方便的方式来查询请求