Contexte
Le code de l'applet précédent était déroutant, donc au début du nouveau projet, nous avions prévu d'encapsuler la demande de l'applet WeChat
Processus
Parlons d'abord de l'ensemble du processus :
1 Après avoir saisi .appjs, obtenez les informations utilisateur. Si vous n'êtes pas connecté, vous vous connecterez par défaut. Aucune gestion des erreurs n'est effectuée ici
2. .S'il n'accepte pas l'autorisation, il passera toujours à la page d'autorisation
3. Après avoir cliqué sur Autorisation de connexion sur la page d'autorisation, appelez l'interface de connexion. Après succès, revenez à la page où l'autorisation est appelée. informations utilisateur dansapp.js
onLaunch
appSelf = this;
// 应用程序第一次进入，获取用户信息，不做任何错误处理
userInfo().then( (res)=>{
console.log(res);// 打印结果
if (!res.code) {
appSelf.globalData.userInfo = res
}
}).catch( (errMsg)=>{
console.log(errMsg);// 错误提示信息
});
httpUtils.js
demande d'encapsulation
const request = function (path, method, data, header) {
let user_id = "";
let token = "";
try {
user_id = wx.getStorageSync(USER_ID_KEY);
token = wx.getStorageSync(TOKEN_KEY);
} catch (e) {}
header = header || {};
let cookie = [];
cookie.push("USERID=" + user_id);
cookie.push("TOKEN=" + token);
cookie.push("device=" + 1);
cookie.push("app_name=" + 1);
cookie.push("app_version=" + ENV_VERSION);
cookie.push("channel=" + 1);
header.cookie = cookie.join("; ");
return new Promise((resolve, reject) => {
wx.request({//后台请求
url: API_BASE_URL + path,
header: header,
method: method,
data: data,
success: function (res) {
if (res.statusCode !== 200) {
reject(res.data)
} else {
if (res.data.code === 20006) {
login().then( (res)=>{
resolve(res)
}).catch( (errMsg)=>{
reject(errMsg);
})
}
resolve(res.data)
}
},
fail: function (res) {
reject("not data");
}
});
});
}
login
const login = function () {
try {
wx.removeStorageSync(USER_ID_KEY)
wx.removeStorageSync(TOKEN_KEY)
} catch (e) {}
return new Promise((resolve, reject) => {
wx.login({
success: res => {
let code = res.code;
// 已经授权，可以直接调用 getUserInfo 获取头像昵称，不会弹框
wx.getUserInfo({
withCredentials: true,
success: res => {
let userInfo = res.userInfo;
let name = userInfo.nickName;
let avatar = userInfo.avatarUrl;
let sex = userInfo.gender;
let data = {
code: code,
encryptedData: res.encryptedData,
iv: res.iv,
name: name,
avatar: avatar,
sex: sex,
from: FROM,
};
request("/api/user/login/byWeChatApplet", "POST", data).then( (res)=>{
if (!res.code) {
try {
wx.setStorageSync(USER_ID_KEY, res.user_id);
wx.setStorageSync(TOKEN_KEY, res.token)
} catch (e) {
reject(JSON.stringify(e));
}
}
resolve(res)
}).catch( (errMsg)=>{
reject(errMsg)
});
},
fail: function (res) {
console.log(res);
if (res.errMsg && res.errMsg.startsWith("getUserInfo:fail") && res.errMsg.search("unauthorized") != -1) {
// 跳转授权页面
wx.navigateTo({
url: '/pages/auth/auth'
})
return;
}
wx.getSetting({
success: (res) => {
if (!res.authSetting["scope.userInfo"]) {
// 跳转授权页面
wx.navigateTo({
url: '/pages/auth/auth'
})
}
}
});
}
})
}
})
});
};
auth.js
Page d'autorisation js
Page({
data: {
},
onLoad: function () {
self = this;
},
auth: function (e) {
console.log(app.globalData.userInfo);
if (e.detail.userInfo) {
login().then( (res)=>{
console.log(res);// 打印结果
if (res.code) {
// 接口错误
return
}
// 跳转回上一个页面
wx.navigateBack()
}).catch( (errMsg)=>{
console.log(errMsg);// 错误提示信息
});
}
},
});
Adresse du projet
https://github.com/ lmxdawn/wx...
Gestion backend construite avec vue + thinkphp5.1 : https://github.com/ lmxdawn/vu...
Démo :<br>