公众号网页获取微信授权

公众号网页获取微信授权

自定义网站放在公众号里面进行微信授权

官网地址:https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_webpage_authorization.html

其实官方文档做就可以,只是有些地方写的不是很贴切,所以来写这个

配置:

1.首先需要先去配置在公众号设置你网站部署的域名,
填写的是域名(是一个字符串),而不是URL,因此请勿加 http:// 等协议头。
公众号网页获取微信授权
2.授权回调域名配置规范为全域名,比如需要网页授权的域名为:www.qq.com,配置以后此域名下面的页面http://www.qq.com/music.html 、 http://www.qq.com/login.html 都可以进行OAuth2.0鉴权。但http://pay.qq.com 、 http://music.qq.comhttp://qq.com无法进行OAuth2.0鉴权

有两种授权方式:

区别就是一种需要用户来授权 一种不需要就是转一下
官网写的也很清楚:
公众号网页获取微信授权

使用

举例子: 这是其中一种,需要用户的授权的那种 需要另一种的 根据下图该参数就行了
公众号网页获取微信授权

      var url = ‘https://open.weixin.qq.com/connect/oauth2/authorize?appid=你自己的APPID&redirect_uri=授权完要去的页面&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect‘
window.location.href = url

解释:就是你点击登录的时候打开跳转这个连接就会实现授权操作,授权完成后,你需要的数据就会以URL的方式跳转到你写好的目录去 例如:http://localhost:8081/index?code=081ibxFa1CCeFB0ooiHa1cThA40ibxFQ&state=STATE 然后解析就能得到code

解析:

贴心的我准备了js解析URL的方法

    transform(str) {
      // 创建目标对象
      let $_REQUEST = new Object,
          // 截取数据字符串
          data = str.slice(str.indexOf("?"), str.length - 1),
          // 将数据字符串表现为数组
          aParams = data.substr(1).split("&");
      //console.log(data);
      //console.log(aParams);
      for (let i = 0; i < aParams.length; i++) {
        // 数据属性与数值分离
        let aParam = aParams[i].split("=");
        // 使用属性括号进行属性赋值
        $_REQUEST[aParam[0]] = aParam[1]
      }
      return $_REQUEST;
    }
    
  //使用方法
  let dataNu = this.transform(地址)
  dataNu.code //返回的是个对象可以直接得到

拿到code就可以做很多事情了

公众号网页获取微信授权

上一篇:微信小程序实现node的自动打包上传代码


下一篇:微信内置浏览器 upload 上传文件 “无法打开文件选择器” “没有应用可执行此操作”