1、在uniapp中配置小程序appid
打开 manifest.json ,找到微信小程序配置,填写 appid 重启应用;
// 您需要注册成为微信小程序开发者才能获取 appid
2、视图添加登录按钮
<template>
<view>
<!-- #ifdef MP-WEIXIN -->
<button type="primary" open-type="getUserInfo" @getuserinfo="getUserInfo">使用微信登录</button>
<!-- #endif -->
</view>
</template>
3、js 核心代码
<script>
var _self, pageOptions, session_key, openid;
export default {
data() {
return {
};
},
methods:{
// #ifdef MP-WEIXIN
getUserInfo : (info) => {
info = info.mp.detail.userInfo;
//userInfo {"nickName":"深海","gender":1,...avatarUrl":"https://7tdPvkPaJlkaLFFbLAffGVApluZdanLkDVplNlAhq1EJA/132"}
// 与服务器交互将数据提交到服务端数据库
uni.request({
url: _self.apiServer+'member&m=login',
method: 'POST',
header: {'content-type' : "application/x-www-form-urlencoded"},
data: {
openid : openid,
name : info.nickName,
face : info.avatarUrl,
},
success: res => {
console.log(res);
res = res.data;
// 登录成功 记录会员信息到本地
if(res.status == 'ok'){
uni.showToast({title:"登录成功"});
uni.setStorageSync('SUID' , res.data.u_id + '');
uni.setStorageSync('SRAND', res.data.u_random + '');
uni.setStorageSync('SNAME', res.data.u_name + '');
uni.setStorageSync('SFACE', res.data.u_face + '');
// 跳转
if(pageOptions.backtype == 1){
uni.redirectTo({url:pageOptions.backpage});
}else{
uni.switchTab({url:pageOptions.backpage});
}
}else{
uni.showToast({title:res.data});
}
},
fail: (e) => {
console.log(JSON.stringify(e));
}
});
},
// #endif
},
onLoad:function(options){
_self = this;
pageOptions = options;
// #ifdef MP-WEIXIN
// 调用 微信 login 获取 code
uni.login({
success: (res) => {
uni.request({
url:_self.apiServer+'member&m=codeToSession&code='+res.code,
success: (sessions) => {
// sessions.date 数据格式
// expires_in:7200
// openid:"oS6of0V0rdp9nY_BuvCnQUasOHYc"
// session_key:"87sE2oDD8lc+aDJj0tB6+g=="
// 获取 unionId
session_key = sessions.data.session_key;
openid = sessions.data.openid;
},
});
}
});
// #endif
//app 端微信登录
// 手册位置 https://uniapp.dcloud.io/api/plugins/login?id=getuserinfo
// #ifdef APP-PLUS
uni.login({
success: (res) => {
// res 对象格式
//{"code":"***",
//"authResult":{
//"openid":"***",
//"scope":"snsapi_userinfo",
//"refresh_token":"**",
//"code":"****",
//"unionid":"***",
//"access_token":"***",
//"expires_in":7200
//},
//"errMsg":"login:ok"}
uni.getUserInfo({
success: (info) => {
// info 对象格式
// {"errMsg":"getUserInfo:ok",
// "rawData":"...
// "userInfo":{
//"openId":"***",
//"nickName":"***",
//"gender":1,
// "city":"Xi'an",
// "province":"Shaanxi",
// "country":"China",
// "avatarUrl":"头像",
// "unionId":"oU5Yyt_agt547zWyA0v0eLfFPqxo"
//},"signature":""}
// 与服务器交互将数据提交到服务端数据库
uni.request({
url: _self.apiServer+'member&m=login',
method: 'POST',
header: {'content-type' : "application/x-www-form-urlencoded"},
data: {
openid : info.userInfo.openId,
name : info.userInfo.nickName,
face : info.userInfo.avatarUrl,
},
success: res => {
console.log(JSON.stringify(res));
res = res.data;
// 登录成功 记录会员信息到本地
if(res.status == 'ok'){
uni.showToast({title:"登录成功"});
uni.setStorageSync('SUID' , res.data.u_id + '');
uni.setStorageSync('SRAND', res.data.u_random + '');
uni.setStorageSync('SNAME', res.data.u_name + '');
uni.setStorageSync('SFACE', res.data.u_face + '');
// 跳转
if(options.backtype == 1){
uni.redirectTo({url:options.backpage});
}else{
uni.switchTab({url:options.backpage});
}
}else{
uni.showToast({title:res.data});
}
},
fail: (e) => {
console.log(JSON.stringify(e));
}
});
},
fail: () => {
uni.showToast({title:"微信登录授权失败"});
}
})
},
fail: () => {
uni.showToast({title:"微信登录授权失败"});
uni.hideLoading();
}
})
// #endif
}
}
</script>
<style></style>
php 后端代码
<?php
namespace hsC;
class member{
public function index(){
}
public function login(){
//调用模型完成用户登录及注册
$memberModel = new \hsModel\member();
$memberModel->login();
}
public function codeToSession(){
if(empty($_GET['code'])){exit(jsonCode('error', 'code error'));}
$url = "https://api.weixin.qq.com/sns/jscode2session?appid=".HS_APPID.
"&secret=".HS_SECRET."&js_code=".$_GET['code']."&grant_type=authorization_code";
$curl = new \hsTool\curl();
$res = $curl->get($url);
echo $res;
}
}