浙里办应用-一键登录

1,435 阅读3分钟

目录

前言

又是迭代,原先的servicecodeservicekey没了,变成了ak(AccessKey)= servicecodesk(SecretKey)= servicepwd,只能说就是离谱

文档

总文档在政务外网,联系业主获取,目前保存时间(20221031)
政务外网环境文档查看 https://irsfactoryqa.zj.gov.cn/workshop/search/docDetail?docId=68ad4532e79249399d7f59ec75333bc7
互联网环境文档查看 提取码: mdzz https://pan.baidu.com/s/1U-ARG3z7XcjXD46qHjKfTw?pwd=mdzz

查看群文件文件夹-“浙里办”微信小程序接入相关文档-附件,就两个方法,接口传入ticket,后台通过ticket先获取token,再通过token获取用户信息.

如未上架应用对接微信浙里办小程序获取的微信ticketiddebug_tk_xxx,返回的用户信息也是测试数据,是正常的,不影响审核,上架之后才是真实数据。

浙里办App获取的ticket和支付宝浙里办小程序获取的ticket调用的方法是第一种,微信浙里办小程序获取到的是ticketId,调用的方法是第二种,方法是不同的方法是不同的方法是不同的,如果使用之前的方法,调用后台发起单点登录,返回错误提示是st已经超时失效 无论重新登录多少次,都是这个错误提示。

开始操作

  1. public/index.vue
    <body>
        <!-- 浙里办JS -->
        <script type="text/javascript" src="//assets.zjzwfw.gov.cn/assets/ZWJSBridge/1.1.0/zwjsbridge.js"></script>
        <!-- 埋点JS -->
        <script type="text/javascript" src="//assets.zjzwfw.gov.cn/assets/zwlog/1.0.0/zwlog.js"></script>
        <!-- 日志调试 -->
        <!-- 
        <script src="https://unpkg.com/vconsole@latest/dist/vconsole.min.js"></script>
        <script>
            var vConsole = new window.VConsole();
        </script> 
        -->
        <!-- 这一行千万不能删除 页面容器 删除就白屏了 -->
        <div id="app" />
    </body>
  1. 让业主在csss.zj.gov.cn/verifyComLi…中获取到aksk

  2. 创建中转站页面,所有的业务逻辑放在中转站里index.vue

  3. ak替换servicecode浙里办APP地址https://puser.zjzwfw.gov.cn/sso/mobile.do?action=oauth&scope=1&servicecode=xxxxxxxxxxxxxxxxxxxx,支付宝浙里办小程序地址https://puser.zjzwfw.gov.cn/sso/alipay.do?action=ssoLogin&servicecode=xxxxxxxxxxxxxxxxxxxx

  4. 判断当前处于哪一种环境中,然后分别调用不同的业务

let sUserAgent = window.navigator.userAgent.toLowerCase()
// 浙里办APP
let isApp = sUserAgent.indexOf('dtdreamweb') > -1
// 支付宝浙里办小程序
let isAliPay = sUserAgent.indexOf('alipay') > -1
// 微信浙里办小程序
let isWechat = sUserAgent.indexOf('micromessenger') > -1

---------------------------------------------------------------------------

// 浙里办APP进入 并且处理二次进入白屏问题
onAppLogin() {
    window.onpageshow = (event) => {
        if (event.persisted || (window.performance && window.performance.navigation.type == 2)) {
            ZWJSBridge.close();
        } else {
            console.log("跳转浙里办APP移动端地址登录获取ticket,使用默认回调地址就会回到本页")
            window.location.replace(
                "https://puser.zjzwfw.gov.cn/sso/mobile.do?action=oauth&scope=1&servicecode=xxxxxxxxxx"
            );
        }
    }
}

// 支付宝浙里办小程序进入 并且处理二次进入白屏问题
onAliPayLogin() {
    window.onpageshow = (event) => {
        if (event.persisted || (window.performance && window.performance.navigation.type == 2)) {
            ZWJSBridge.close();
        } else {
            console.log("跳转支付宝浙里办小程序移动端地址登录获取ticket,使用默认回调地址就会回到本页")
            window.location.replace(
                "https://puser.zjzwfw.gov.cn/sso/alipay.do?action=ssoLogin&servicecode=xxxxxxxxxx"
            );
        }
    }
}

// 微信浙里办小程序进入
onWechatLogin() {
    ZWJSBridge.ssoTicket().then(ssoTicketRes => {
        console.log("ZWJSBridge.ssoTicket", ssoTicketRes)
        if (utils.isEmpty(ssoTicketRes.ticketId)) {
            // 登录失效或者没有登录
            ZWJSBridge.openLink({
                type: 'reload'
            }).then(reloadRes => {
                console.log("ZWJSBridge.openLink({type:reload})", reloadRes)
                let ticketId = reloadRes.ticketId
                this.getWxUserInfo(ticketId)
            })
        } else {
            let ticketId = ssoTicketRes.ticketId
            this.getWxUserInfo(ticketId)
        }
    })
}
  1. 支付宝和浙里办页面跳转后使用默认回调地址回到本页面,所以在onLoad()中需要从location.href中获取ticket,存在ticket就直接调用getUserInfo(ticket),不存在再进行页面的跳转。微信不用判断,直接调用onWechatLogin()
            // 获取ticket
            getTicketByUrl() {
                let ticket = null;
                let reg = new RegExp("(^|&)" + "ticket" + "=([^&]*)(&|$)");
                let r = location.href.substr(1).match(reg);
                if (r != null) ticket = unescape(r[2]).replace("#/", "");
                return ticket;
            },

结尾

index.vue

<template>
    <view class="page">
    </view>
</template>
<script>
    import api from '@/api/api.js'
    import utils from '@/utils/utils.js'
    export default {
        onLoad(params) {
            ZWJSBridge.onReady(() => {
                // 判断当前是什么模式 normal普通模式 elder适老模式
                ZWJSBridge.getUiStyle({}).then((res) => {
                    getApp().globalData.elder = res.uiStyle == "elder";
                }).catch(() => {
                    getApp().globalData.elder = false;
                });
                this.login()
            })
        },
        methods: {
            login() {
                if (!getApp().globalData.ZLBRelease) {
                    console.log('\n测试环境\n')
                    // 测试环境 账号密码登录
                    uni.reLaunch({
                        url: '/pages/index/login'
                    })
                } else {
                    let sUserAgent = window.navigator.userAgent.toLowerCase()
                    // 浙里办APP
                    let isApp = sUserAgent.indexOf('dtdreamweb') > -1
                    // 支付宝浙里办小程序
                    let isAliPay = sUserAgent.indexOf('alipay') > -1
                    // 微信浙里办小程序
                    let isWechat = sUserAgent.indexOf('micromessenger') > -1
                    console.log(`isApp=${isApp} isAliPay=${isAliPay} isWechat=${isWechat}`)
                    if (isWechat) {
                        this.onWechatLogin()
                    } else {
                        let ticket = this.getTicketByUrl()
                        if (utils.isEmpty(ticket)) {
                            if (isApp) {
                                this.onAppLogin()
                            } else if (isAliPay) {
                                this.onAliPayLogin()
                            }
                        } else {
                            // 登录成功后携带ticket返回当前页面
                            this.getUserInfo(ticket)
                        }
                    }
                }
            },
            // 获取ticket
            getTicketByUrl() {
                let ticket = null;
                let reg = new RegExp("(^|&)" + "ticket" + "=([^&]*)(&|$)");
                let r = location.href.substr(1).match(reg);
                if (r != null) ticket = unescape(r[2]).replace("#/", "");
                return ticket;
            },
            // 浙里办APP进入 并且处理二次进入白屏问题
            onAppLogin() {
                window.onpageshow = (event) => {
                    if (event.persisted || (window.performance && window.performance.navigation.type == 2)) {
                        ZWJSBridge.close();
                    } else {
                        console.log("跳转浙里办APP移动端地址登录获取ticket,使用默认回调地址就会回到本页")
                        window.location.replace(getApp().globalData.zlbUrl);
                    }
                }
            },
            // 支付宝浙里办小程序进入 并且处理二次进入白屏问题
            onAliPayLogin() {
                window.onpageshow = (event) => {
                    if (event.persisted || (window.performance && window.performance.navigation.type == 2)) {
                        ZWJSBridge.close();
                    } else {
                        console.log("跳转支付宝浙里办小程序移动端地址登录获取ticket,使用默认回调地址就会回到本页")
                        window.location.replace(getApp().globalData.alipayZlbUrl);
                    }
                }
            },
            // 微信浙里办小程序进入
            onWechatLogin() {
                ZWJSBridge.ssoTicket().then(ssoTicketRes => {
                    console.log("ZWJSBridge.ssoTicket", ssoTicketRes)
                    if (utils.isEmpty(ssoTicketRes.ticketId)) {
                        // 登录失效
                        ZWJSBridge.openLink({
                            type: 'reload'
                        }).then(reloadRes => {
                            console.log("ZWJSBridge.openLink({type:reload})", reloadRes)
                            let ticketId = reloadRes.ticketId
                            this.getWxUserInfo(ticketId)
                        })
                    } else {
                        let ticketId = ssoTicketRes.ticketId
                        this.getWxUserInfo(ticketId)
                    }
                })
            },
            // 登录获取用户信息
            getUserInfo(ticket) {
                api.login({
                    st: ticket,
                    clientType: "ZLB",
                }).then((res) => {
                    getApp().setGlobalUser(res);
                    uni.reLaunch({
                        url: "/pages/main/main",
                    });
                });
            },
            getWxUserInfo(ticketId) {
                api.wxLogin({
                    st: ticketId,
                    clientType: "ZLB"
                }).then((res => {
                    getApp().setGlobalUser(res)
                    uni.reLaunch({
                        url: "/pages/main/main",
                    })
                }))
            }
        },
    };
</script>

<style>
</style>