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; } }
