好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

Html5页面获取微信公众号的openid的方法

1、H5页面是运行在微信浏览器的

2、需要与 公众号 关联(即需要o PE nid)

3、判断需求 是否 需要弹窗告知用户授权操作

4、获取地址栏参数判断是否有'code',有的话直接传给后台换取openid,没有就跳转微信提供的获取code的链接

5、获取到的openid做本地存储,判断没有openid进行获取openid操作

6、这边的操作是不需要弹出授权框,且code不能重复使用,所以做了关注二维码弹窗且不能关闭弹窗操作

// 强制关注 公众 号,获取openid
getCode = function () {
    if (sessionStorage.get IT em("openid") && sessionStorage.getItem("openid")!="un define d") {
        return false;
    }
     VAR  code = getUrlPar am ('code') // 截取路径中的code,如果没有就去微信授权,如果已经获取到了就直接传code给后台获取openId
    var local = window.location. hr ef;
    var APPID = 'xxx';
    if (code  ==  null || code  ===  '') {
        window.location.href = 'https://open.w ei xin. QQ  .COM /connect/oauth2/authorize?appid=' + APPID + '&am p;  red irect_uri=' + encodeURI component (local) + '&response_type=code&scope=snsapi_base& stat e= # wec hat _redirect'
    } else {
        getOpenId(code) //把code传给后台获取用户信息
    }
}
//把code传给后台,得到openid
getOpenId = function (code) {
    $.ajax({
        type: 'POST',
        dataType: 'json',
        url: 'xxx',
        data: { code: code },
        success: function (res) {
            if (res.status == -1) {
                // 提示没有关注公众号 没有关注公众号跳转到关注公众号页面
                console. LOG ('您还未关注公众号喔');
                //二维码弹窗
                $('.openPopup').click();
                return;
            } else {
                // 本地存储这个openid,并刷新页面
                sessionStorage.setItem("openid", res.data.openid);
                location.reload();
            }
        }
    });
}
//获取地址栏的参数
getUrlParam= function (name) {
        var reg = new RegE xp ("(^|&)" + name + "=([^&]*)(&|$)");
        var r = window.location.se Arch .s ub str(1).match(reg);
        if (r != null) return unescape(r[2]); return null;
}
//页面执行调用
getCode();

到此这篇关于 HTML5页面 获取微信公众号的openid的方法的 文章 就介绍到这了,更多相关Ht ML 5获取公众号的openid内容请搜索以前的文章或继续浏览下面的相关文章,希望大家以后多多支持!

总结

以上是 为你收集整理的 Html5页面获取微信公众号的openid的方法 全部内容,希望文章能够帮你解决 Html5页面获取微信公众号的openid的方法 所遇到的问题。

如果觉得 网站内容还不错, 推荐好友。

查看更多关于Html5页面获取微信公众号的openid的方法的详细内容...

  阅读:48次