获取小程序 openid 返回 null 问题解决

简介: 获取小程序 openid 返回 null 问题解决

获取小程序 openid 返回 null

登录 wx.login() 获取到 code,为了安全 session_key 和 openid 不暴露在客户端,而且

https://api.weixin.qq.com

不能设置白名单,需要使用 code 在服务端换取 session_key 和 openid

之前小程序服务一直正常,无提交任何代码,突然获取openid失败,搜索各种文章解决,遇到各种问题 41004 ,40163,code 只能使用一次没问题,Peer certificate CN=miniapi.x.com' did not match expected CN=api.weixin.qq.com`
DNS服务器无法连接,ping 过发现没有问题,etc/host 配置也没问题,关联公众号白名单也设置了,后端换两种写法也不行。
设置关联小程序的公众号添加IP白名单

看以下步骤

先打印出来 app.js

    globalData: {
   
        appid: 'wx7db46aji5jf6',//小程序appid,需自己提供
        secret: '9cb98jjk57okp245sd',//小程序密钥,需自己提供
        hasLogin: false,
        openid: null,
        firstTime: true,
        accessToken: null
    },
    getUserOpenId: function() {
   
        var that = this;
        //登录
        wx.login({
   
            success: function(res) {
   
              console.log(res)//打印code
              var d = that.globalData;//这里存储了appid、secret、token串  
              var l = 'https://api.weixin.qq.com/sns/jscode2session?appid=' + d.appid + '&secret=' + d.secret + '&js_code=' + res.code + '&grant_type=authorization_code';
              console.log(l)打印 curl
              //以下代码会报错 https://api.weixin.qq.com 不在以下 request 合法域名列表中,也不能设置IP白名单,而且为了安全客户端不暴露 session_key 和 openid,只能服务端获取
              wx.request({
   
                url: l,
                data: {
   },
                method: 'GET',
                // header: {}, // 设置请求的 header  
                success: function (res) {
   
                  console.log(res)
                  var obj = {
   };
                  obj.openid = res.data.openid;
                  obj.expires_in = Date.now() + res.data.expires_in;
                  console.log(obj);
                  //wx.setStorageSync('user', obj);//存储openid  
                }
              });


        /*
        //code 获取 openid 的正确方式,code每次都是最新的而且只能使用一次
        wx.request({
                    url: that.apis.domain + that.apis.login,
                    header: {
                        "Content-Type": "application/x-www-form-urlencoded"
                    },
                    method: 'POST',
                    data: {
                        code: res.code
                    },
                    success: function(res) {
                        if(res.data.status == 1){
                            //console.log('拉取openid成功', res);
              console.log(res)
                            that.globalData.hasLogin = true;
                            that.globalData.openid = res.data.data.openid;
                            that.firstTime(res.data.data.openid);
                        } else {
                            that.globalData.hasLogin = false;
                            //console.log('拉取openID失败,将无法正常使用开放接口等服务',res);
                        }
                    },
                    fail: function(res) {
                        console.log('拉取用户openid失败,将无法正常使用开放接口等服务', res)
                        callback(res)
                    }
                })
        */
            },
            fail: function(err) {
   
                console.log('wx.login 接口调用失败,将无法正常使用开放接口等服务', err)
                callback(err)
            }
        })
    },

看打印结果 code 和 url
B4090E41_26F6_44A8_99EF_9F4BF42F0370

在 postman 测试,先使用 code 请求后端接口,返回 null
1564566554519

把 url 拿出来直接在 postman 请求每次都是成功的,确认是后端服务的问题
1564566948437

把 url 放在服务器直接 curl,各种报错来了 "errcode":41004,"errmsg":"appsecret missing 各种方法用过没有解决问题
B28E2F4A_1B59_4255_9EB6_4973E6953FC5

最后设置关联小程序的公众号添加IP白名单后重启服务器问题解决了,没有更改任何代码

目录
相关文章
|
应用服务中间件 网络安全 nginx
nginx启动成功,但外部不能访问的问题
nginx启动成功,但外部不能访问的问题
5856 0
nginx启动成功,但外部不能访问的问题
|
小程序 JavaScript
小程序云开发获取openid及出现openid是undefind的坑
小程序云开发获取openid及出现openid是undefind的坑
1178 0
|
JavaScript 前端开发 数据安全/隐私保护
vue3+ts+elementplus写一个登录页面教程
【6月更文挑战第3天】本文介绍了如何使用 Vue 3 和 TypeScript 创建一个登录页面。首先,需安装 Vue CLI,然后创建新项目并启用 TypeScript 支持。接着,创建 `Login.vue` 组件,设计登录表单,包括用户账号、密码和验证码字段,并实现相关验证规则。页面样式包括背景、登录框和按钮等元素的布局与样式。最后,展示了`<script>`部分的代码,包括表单验证逻辑、生成验证码的函数以及登录提交处理。文章还提供了一个登录页面的截图和完整代码示例。
6507 1
|
11月前
|
机器学习/深度学习 人工智能 前端开发
终端里的 AI 编程助手:OpenCode 使用指南
OpenCode 是开源的终端 AI 编码助手,支持 Claude、GPT-4 等模型,可在命令行完成代码编写、Bug 修复、项目重构。提供原生终端界面和上下文感知能力,适合全栈开发者和终端用户使用。
60998 11
|
NoSQL JavaScript 前端开发
SpringBoot+Vue实现校园二手系统。前后端分离技术【完整功能介绍+实现详情+源码】
文章介绍了如何使用SpringBoot和Vue实现一个校园二手系统,采用前后端分离技术。系统具备完整的功能,包括客户端和管理员端的界面设计、个人信息管理、商品浏览和交易、订单处理、公告发布等。技术栈包括Vue框架、ElementUI、SpringBoot、Mybatis-plus和Redis。文章还提供了部分源代码,展示了前后端的请求接口和Redis验证码功能实现,以及系统重构和模块化设计的一些思考。
SpringBoot+Vue实现校园二手系统。前后端分离技术【完整功能介绍+实现详情+源码】
|
SQL Java 数据库连接
成功解决:was not registered for synchronization because synchronization is not active
这篇文章是关于解决Mybatis在同步过程中出现"was not registered for synchronization because synchronization is not active"错误的技术博客。
成功解决:was not registered for synchronization because synchronization is not active
|
XML Java 数据库连接
IDEA插件-MyBatisX
MybatisX 是一款用于 IntelliJ IDEA 的插件,旨在帮助开发者更便捷地进行 MyBatis XML 配置文件的编写和调试。它提供了许多功能和工具,以简化 MyBatis 开发流程。
4843 0
IDEA插件-MyBatisX
|
SQL 数据可视化 关系型数据库
2022年最新最详细IDEA关联数据库方式、在IDEA中进行数据库的可视化操作(包含图解过程)
这篇文章详细介绍了如何在IntelliJ IDEA中关联MySQL数据库,包括打开Database侧边栏、选择数据库、输入连接信息、测试连接,并提供了解决连接问题的方案,以及在IDEA中进行数据库的可视化操作步骤。
2022年最新最详细IDEA关联数据库方式、在IDEA中进行数据库的可视化操作(包含图解过程)

热门文章

最新文章