美文网首页
9.uniapp公众号授权(1)

9.uniapp公众号授权(1)

作者: 秀萝卜 | 来源:发表于2020-05-09 11:50 被阅读0次

授权整体步骤如下

  1. 引导用户进入授权页面同意授权后微信跳转回调地址并传递参数code 获取code

  2. 通过code换取网页授权access_token(与基础支持中的access_token不同)

  3. 如果需要,开发者可以刷新网页授权access_token,避免过期

  4. 通过网页授权access_token和openid获取用户基本信息(支持UnionID机制)
    其中 本页例子前端只做第1步,后端程序员做2,3,4包括配置公众号上的域名
    新建一个index.vue的页面,在此页面进行授权
    授权需要先拿到code ,获取code需要以下参数

    image
    const base_url = 'http://baidu.com'// 前端域名
    const wx_url = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid='+appid+'&redirect_uri='+base_url+'&response_type=code&scope=snsapi_base&state=123#wechat_redirect'
    export default {
        components: {

        },
        data() {
            return {
                }
        },

        onLoad() {
            // 获取URL 上code
            const code = this.getUrlParam('code')
            // 判断是否存在code
            if(code == null || code == '') {
                // 重新获取code
                // console.log(code)
                window.location.href = wx_url
            } else {
                // 发送code           
                    this.postCode(code)
            }
        },
    methods: {
        // 解析URL 参数
        getUrlParam(name) {
            let reg = new RegExp('(^|&)'+ name + '=([^&]*)(&|$)')
            let r = window.location.search.substr(1).match(reg)
            if(r!=null){
                return unescape(r[2])
            } 
            return null
        },
        // 发送code 获取信息
        postCode(code) {
                              uni.request({
                                     url: 'https://www.example.com/request', //发送code给后台。
                                    success: (res)=> {
                                          //res里面包含用户信息  openid等
                                                            }
                                          });
                            }
               }
    }

作者:微笑是我_f8bb
链接:https://www.jianshu.com/p/c0e8d35f5a85
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

相关文章

  • 9.uniapp公众号授权(1)

    授权整体步骤如下 引导用户进入授权页面同意授权后微信跳转回调地址并传递参数code 获取code 通过code换取...

  • 9.uniapp公众号授权(2)

    先把微信官方文档放在这,如果有需要,可直接进入微信公众号开发文档。 很多时候,我们陷入了一种误区,觉得 uni-A...

  • 微信支付开发前准备(laravel版)

    1、配置公众号:1、微信授权登录授权域名设置,开发者中心-》功能列表-》网页授权登录2、公众号分享安全回调URL设...

  • 授权流程思路

    公众号授权流程: 企微授权流程

  • 好评返现代发设置指南-摇摇啦SCRM

    1、登录摇摇啦SCRM平台,公众号管理员扫码授权绑定公众号; 《好评返现功能设置》 1、登录微信公众平台,添加功能...

  • 微信公众号开发设置

    一、网页授权(支持测试公众号) 1、Appid:每个公众号自带 2、AppSecret:需要管理员权限重置,获取后...

  • 主编编辑器如何解绑公众号

    第一步:点击首页会员中心进入到个人中心,页面拉到下方点击公众号授权,已授权的公众号会有取消授权,点击取消授权。 第...

  • 花间奇谈|"我是主角命"

    本文首发公众号【花间奇谈】,转载请联系公众号授权。 1 “叮——” “24号世界主角人设苏一由于遭遇突发事变,提前...

  • H5页面调用微信授权获取code

    H5调用微信授权获取code(微信公众号微信页面开发网页授权) 一、首先你要有一个公众号(公众号、订阅号),微信公...

  • 江南春:突破困境的4个方向

    内容来源:本文为公众号正和岛(ID:zhenghedao)原创首发,笔记侠经授权发布。转载请联系原公众号授权。 分...

网友评论

      本文标题:9.uniapp公众号授权(1)

      本文链接:https://www.haomeiwen.com/subject/vjzhnhtx.html