微信小程序开放了微信登录的api,无论是个人还是企业申请的小程序均可使用。

首先创建一个项目,把这些代码都清空,我们自己写!

然后,开始写了!
首先index.wxml,写一个button用于发起登录

index.wxml

<!--index.wxml-->
<button bindtap='login'>登录</button>

然后写index.js

通过wx.login()来获取code
如果成功获取,那么返回code
然后调用wx.request()向服务端发起一个请求,即向登录api接口发送code
换取openid和session_key

api接口:

https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=APPSECRET&js_code=CODE&grant_type=authorization_code
//index.js
//获取应用实例
const app = getApp()
Page({
data: { },
//登录获取code
login:function(){
wx.login({
success:function(res){
console.log(res.code)
//发送请求
wx.request({
url: 'test.php', //接口地址
data: {code:res.code},
header: {
'content-type': 'application/json' //默认值
},
success: function (res) {
console.log(res.data)
}
})
}
})
}
})

app.js,这个清空,留下这样就行了

//app.js
App({ })

那么到这里,小程序端已经搞定了。
开始写服务端,也很容易。

首先获取从小程序传过来的code
再配置自己小程序的appid和appscret
把这些参数拼接到api接口上进行请求发送就可以返回openid和session_key

<?php
//声明CODE,获取小程序传过来的CODE
$code = $_GET["code"];
//配置appid
$appid = "修改成你小程序的APPID";
//配置appscret
$secret = "修改成你小程序的APPSECRET";
//api接口
$api = "https://api.weixin.qq.com/sns/jscode2session?appid={$appid}&secret={$secret}&js_code={$code}&grant_type=authorization_code";
//获取GET请求
function httpGet($url){
$curl = curl_init();
curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
curl_setopt($curl, CURLOPT_TIMEOUT, 500);
curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, true);
curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, true);
curl_setopt($curl, CURLOPT_URL, $url);
$res = curl_exec($curl);
curl_close($curl);
return $res;
}
//发送
$str = httpGet($api);
echo $str;
?>

OK完成!把服务端上传到服务器,换到上面的这里

然后就可以再控制台打印出openid和session_key了

获取到了,你想怎么玩就怎么玩!后面可以通过wx.getUserinfo获取用户基本信息(头像,昵称,城市,个性签名等相关信息)

作者:tanking

微信小程序wx.login()获取openid,附:前端+后端代码的更多相关文章

  1. 微信小程序开发之获取openid及用户信息

    1. 获取openid 1.1 获取code 调用接口获取登录凭证(code)进而换取用户登录态信息,包括用户的唯一标识(openid) 及本次登录的会话密钥(session_key).用户数据的加解 ...

  2. 微信小程序wx.login先执行onLaunch与onLoad加载顺序问题

    @ 目录 遇到问题 请求api返回需要先登录,实际上登录已成功 问题分析 解决问题 自定义回调函数 app.js index.js 扩展提问 学习交流 随机数字随机幸运数+ My Blog 技术交流 ...

  3. 微信小程序wx.getLocation()获取经纬度及JavaScript SDK调用腾讯地图API获取某一类地址

    简介 腾讯位置服务为微信小程序提供了基础的标点能力.线和圆的绘制接口等地图组件和位置展示.地图选点等地图API位置服务能力支持,使得开发者可以自由地实现自己的微信小程序产品. 在此基础上,腾讯位置服务 ...

  4. 微信小程序案例:获取微信访问用户的openid

    在微信开发项目中,获取openid是项目常遇的问题,本文通过主要讲解实现在微信小程序中如何获取用户的openid,案例实现非常简单 具体实现方法是通过登录接口获取登录凭证,然后通过request请求微 ...

  5. 用Spingboot获得微信小程序的Code以及openid和sessionkey

    ​ 这篇文章主要写的是怎么用spingboot来获取微信小程序的Code以及openid和sessionke,我觉得已经很详细了 我们要获得openid和sessionkey,就必须先要获得code, ...

  6. 微信小程序之动态获取元素宽高

    我以前一直以为微信小程序不能动态获取view元素的宽高.但是自从看到: wx.createSelectorQuery() 这个api接口,以前的某些问题就能得到解决了... 那么,这个api接口怎么用 ...

  7. 微信小程序wx.request接口

    微信小程序wx.request接口 wx.request是小程序客户端与服务器端交互的接口 HTTPS 请求 一个微信小程序,只能同时(同时不能大于5个)有5个网络请求 wx.request(OBJE ...

  8. 监控微信小程序wx.request请求失败

    在微信小程序里,与后台服务器交互的主要接口函数是wx.request(),用于发起 HTTPS 网络请求.其重要性不言而喻.然而,却经常遇到请求失败的问题,笔者特意谷歌"wx.request ...

  9. [技术博客] 微信小程序的formid获取

    微信小程序的formid获取 formId的触发 微信小程序可以通过收集用户的formid,获取formid给用户主动推送微信消息.获取formid有两个途径,一个是触发一次表单提交,或者触发一次支付 ...

随机推荐

  1. docker学习笔记(3)——联合文件系统与数据卷

    参考资料: 1.官网教程:https://docs.docker.com/reference/ 2.视频教程:https://www.bilibili.com/video/BV1og4y1q7M4?t ...

  2. salesforce零基础学习(一百一十二)项目中的零碎知识点小总结(四)

    本篇参考: https://trailblazer.salesforce.com/issues_view?id=a1p4V0000003znDQAQ https://salesforce.stacke ...

  3. laravel7 jqAjax下拉框搜索

    html: 设置页面改变事件 <div id="show"> <div class="page-container" style=" ...

  4. CentOS 8 关闭 Firewalld 及 SELinux

    检查 SELinux 是否开启 执行 sestatus 指令可以检视目前 SELinux 的状态, 其中一项是是否有开启, 执行以下指令: # sestatus | grep status 如果看到 ...

  5. vue中使用keepAlice的各种问题

    项目需求:从项目列表页index,进入到列表的详情页detail,再从detail返回到index,需要缓存index的数据 在App.vue中的配置 <template> <div ...

  6. Mybatis数据库分页

    使用limit分页(sql语句) SELECT * FROM user limit 0,2 #从第0个开始查,查2个 使用Mybatis实现分页,核心还是sql(map) <select id= ...

  7. [SPDK/NVMe存储技术分析]015 - 理解内存注册(Memory Registration)

    使用RDMA, 必然关系到内存区域(Memory Region)的注册问题.在本文中,我们将以mlx5 HCA卡为例回答如下几个问题: 为什么需要注册内存区域? 注册内存区域有嘛好处? 注册内存区域的 ...

  8. Cobalt Strike的使用

    0x00  Cobalt Strike简介       Cobalt Strike 一款以metasploit为基础的GUI的框架式渗透测试工具,集成了端口转发.服务扫描,自动化溢出,多模式端口监听, ...

  9. [SHA2017](web) writeup

    [SHA2017](web) writeup Bon Appétit (100) 打开页面查看源代码,发现如下 自然而然想到php伪协议,有个坑,看不了index.php,只能看 .htaccess ...

  10. Presidential-01

    环境搭建 官网地址:https://www.vulnhub.com/entry/presidential-1,500/ 靶机下载地址: https://download.vulnhub.com/pre ...