美文网首页apifm-wxapi微信小程序微信小程序开发
微信小程序登录获取openid及三方token

微信小程序登录获取openid及三方token

作者: fe1e31171ab2 | 来源:发表于2019-08-06 08:40 被阅读1次

    前言

    本教程是基于 “apifm-wxapi” 模块,教你快速实现小程序开发,所以你可能需要先了解以下知识点:

    《创建 HelloWorld 项目》
    《使用 “apifm-wxapi” 快速开发小程序》
    《免费注册开通后台,获得专属域名》

    需求说明

    利用小程序的 wx.login() 方法获取到临时 code;
    使用临时 code 通过 “apifm-wxapi” 换取用户登录 token;
    后期用户的任何授权登录,都需要提供这个 token 才能操作;
    根据小程序官方文档,为了安全起见,不应该在小程序端暴露任何敏感信息(比如 appid、secret、accesstoken 等),尽量避免直接使用 小程序登录的 session_key;

    预算

    无需成本,免费实现

    需求实现

    准备工作

    因为本例为小程序开发,所以你在进行下述工作之前,必须要先在后台配置你的小程序 appid 和 secret;

    因为只有在后台配置了正确的 小程序 appid 和 secret ,后台才能正确解析小程序提交给 api 接口的加密用户数据,继而才能完成用户登录

    《后台配置小程序的 appid 和 secret》

    如果你还没有注册过用户,调用本例登录将会返回给你用户不存在的错误!
    你可以前往小程序用户注册章节,先完成用户的注册,之后即可实现小程序登录:

    《小程序用户注册,后台可以查看并管理注册用户》

    编写小程序代码:

    const WXAPI = require('apifm-wxapi')
    WXAPI.init('gooking')
    
    Page({
      data: {
    
      },
      onLoad: function (options) {
        
      },
      login(e){
        if (!e.detail.userInfo) {
          // 你点了取消授权
          return;
        }
        wx.login({
          success: function (res) {
            const code = res.code; // 微信登录接口返回的 code 参数,下面登录接口需要用到
            WXAPI.login_wx(code).then(function (res) {
              // 登录接口返回结果
              console.log(res)
            })
          }
        })
      }
    })
    
    

    WXAPI.init('gooking') 这句代码是将你的小程序链接到你的后台,其中 gooking 这个是你的专属域名(请查看前言中关于专属域名的章节说明);

    登录成功后,你将可以获取到当前用户的uid、openid、token
    token 建议你直接保存在小程序的 storage 里面,以后只要涉及到需要用户登录后才能操作的功能,直接传递这个 token 即可!

    故障排查

    《注册 / 登录 失败、无法获取用户 openid》

    期待你的进步!
    感谢!

    相关文章

      网友评论

        本文标题:微信小程序登录获取openid及三方token

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