零基础学小程序007---小程序获取用户openid
时间:2022-07-28
本文章向大家介绍零基础学小程序007---小程序获取用户openid,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
我们在做小程序支付,在区分小程序用户时都需要用到openid,用户openid就相当于用户在小程序里的身份证。做为用户的唯一标示,所以获取到用户openid就显得很重要了,今天来教大家怎么样获取要用户的唯一标示 openid
所需参数 |
是否必需 |
---|---|
appid |
必需 |
appsecret |
必需 |
还是先看效果图
获取openid.png
上面就是我们实现后的效果。接下来开始给大家讲解具体实现步骤。
一,先看小程序官方文档(官方文档才是最好的老师)
微信官方文档.png
官方文档已经说了,要先通过wx.login获取一个临时凭证code,然后我们拿这个code去自己的服务器换取用户openid。那么问题来了,我们需要有一个自己的服务器,并且支持https请求。是不是感觉很难,为了帮助大家尽快学习小程序开发,后台的问题我给大家解决。大家可以直接请求我的后台api接口就行,不用自己搭建后台。
二,访问服务器获取openid
不多说先上代码,讲代码是最快的学习方式(微信代码排版有点乱,点击到小程序里查看点击打开学习小程序)
- user.wxml
<button type='primary' bindtap='getOpenid'>获取用户openid</button><text>{{openid}}</text>
- user.js
// pages/user/user.jsPage({
data: {
openid: ''
}, // 获取用户openid
getOpenid: function() {
let that = this; //获取openid不需要授权
wx.login({
success: function(res) { //请求自己后台获取用户openid
wx.request({
url: 'https://30paotui.com/user/wechat',
data: {
appid: '你的小程序appid',
secret: '你的小程序secret',
code: res.code
},
success: function(response) {
var openid = response.data.openid;
console.log('请求获取openid:' + openid); //可以把openid存到本地,方便以后调用
wx.setStorageSync('openid', openid);
that.setData({
openid: "获取到的openid:" + openid
})
}
})
}
})
},
})
注意点
- 1,https://30paotui.com/user/wechat是用来获取openid的服务器接口。(免费提供给大家用)
- 2,下面的apppid和appsecret到你的小程序后台去找,找到后替换到下面的地方
data: { appid: '你的小程序appid',
secret: '你的小程序secret',
code: res.code
},
获取appid和appsecret.png
到这里就可以获取到用户的openid了,是不是很简单。
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法