uniapp微信公众号H5获取code进行登录-Toy模板网

这篇具有很好参考价值的文章主要介绍了uniapp微信公众号H5获取code进行登录。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

目前在做H5商城，需要公众号的菜单跳进小程序，前端需要获取到公众号的code传给后端来确认用户的openId,但是咱们前端如何通过小程序或者H5，来获取公众号的code呢？

通过查阅资料，我来总结一下此次遇到的问题及解决方案：

首先先去官网了解一下基本的配置

微信开放平台

然后通过这个方法获取code，把code传给后端获取token

export const getUrlCode = function() {
    let code = getUrlParam('code'); // 截取路径中的code，如果没有就去微信授权，如果已经获取到了就直接传code给后台获取openId
    const local = window.location.href;
    let redirect_url = encodeURIComponent(local) //回调的地址要编码
    if (code == null || code === '') {
        window.location.href =
            `https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx23ab834e27fd68ea&redirect_uri=${redirect_url}&response_type=code&scope=snsapi_userinfo&state=1#wechat_redirect`
    }
}

//判断路径中有没有返回code
const getUrlParam = function(name) {
    var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)');
    var r = window.location.search.substr(1).match(reg);
    if (r != null) return unescape(r[2]);
    return null
}

获取当前URL里面的数据，可以配合下文使用

const pages = getCurrentPages();
const currentPage = pages[pages.length - 1]; //当前页面的全部信息
const route = currentPage.route; //当前路由的路径 pages/login/login
const options = currentPage.options; //url里面的参数json类型

这个截取code看自己的需求

重新获取code的话，要先把URL里面的code给截取掉才能重新获取

let url = this.getnewurl('code')
window.history.replaceState(null, null, url);

//此方法是把code给删掉并把拼接好的URL返回
getnewurl(name) {
                var loca = window.location;
                var baseUrl = loca.origin + loca.pathname;
                var query = loca.search.substr(1);
                const pages = getCurrentPages();
                const currentPage = pages[pages.length - 1];
                const route = currentPage.route; //当前路由的路径 pages/login/login
                const options = currentPage.options; //url里面的参数json类型
                if (query.indexOf(name) > -1) {
                    var obj = {}
                    var arr = query.split("&");
                    for (var i = 0; i < arr.length; i++) {
                        arr[i] = arr[i].split("=");
                        obj[arr[i][0]] = arr[i][1];
                    };
                    delete obj[name];
                    var url = baseUrl + '#/' + route + '?' + JSON.stringify(options).replace(/[\"\{\}]/g, "").replace(
                        /\:/g, "=").replace(/\,/g, "&");
                    return url
                };
            },

有什么看不明白的地方可以联系我文章来源地址https://www.toymoban.com/news/detail-506289.html

到了这里，关于uniapp微信公众号H5获取code进行登录的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！