微信公众号开发,获取openid,授权登录

24 篇文章 0 订阅

微信公众号开发
功能:自动登录,获取个人信息,上传图片
超多麻烦的情况,怎样获取openid呢?
以下我给大家提供源码,文本,视频资料
保证让你看了就明白哈

look效果

1.拉起用户授权
在这里插入图片描述

2.后台获取到的openid
在这里插入图片描述

3.前端展示用户信息
在这里插入图片描述


视频教程

不懂的可以先看看这个视频:
https://www.bilibili.com/video/BV13W4y1u7fy/?vd_source=125d808bbbad2b8400f221b816a0f674
想多了解的话,再看这个
https://www.bilibili.com/video/BV1XL411T73G/?vd_source=125d808bbbad2b8400f221b816a0f674

核心代码展示

/**
// 获取用户信息,三部曲
// 感谢网友的文章 https://blog.csdn.net/qq_39506978/article/details/109410343
// 参考微信官方文档:https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_webpage_authorization.html#3
app.get("/login.html", (req, res) => {
  console.log(Date.now()+':login.html页面响应--用户,有信息 :', req.body, req.query);
  // 如果是获取用户信息的回调,就重定向 
  if(req.query && req.query.code){
    let code = req.query.code
    res.redirect(`/${staticUrl}?code=`+code)
  }
})

// 通过后台,获取用户信息1
app.get("/getUserInfo", (req,res)=>{
  let code = req.query.code
  // 通过code,获取access_token
  let url = `https://api.weixin.qq.com/sns/oauth2/access_token?appid=${wxConfig.appId}&secret=${wxConfig.appsecret}&code=${code}&grant_type=authorization_code`
    
  request(url, async function (error, response, body) {
    if (!error) {
      console.log('openId_成功_用户信息:error, response, body', typeof body)
      
      // 通过access_token,最后获取用户信息
      let userInfo = await getUserInfo(JSON.parse(body))
      console.log('userInfo',userInfo);
      res.send(userInfo)
    } else {
      console.log('error:', error)
      res.send(JSON.parse(error))
    }
  });
})

如何运行:

环境准备

你需要安装nodejs环境,
直接去nodejs官网https://nodejs.org/en/
在这里插入图片描述

下载项目源码到本地

https://gitee.com/618859/WeChat-official-account-openid.git

安装项目依赖

在本项目根目录运行以下命令
一定要进入到:项目根目录,否则无法正确安装依赖

npm install

安装request模块

npm install request

启动后台:方法1

node app.js

启动后台:方法2:

可以安装了nodemon

npm i nodemon -g

或者如果你安装了nodemon的话

nodemon app.js

最后访问

在微信开发者工具中访问你内网穿透的地址
在这里插入图片描述

  • 4
    点赞
  • 17
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值