微信小程序记账应用实例教程（续二）_H5之家 - 中国HTML5教程资源分享第一站

小程序教程

微信小程序记账应用实例教程（续二）

字号+ 作者：来源： 2016-11-23 09:49 我要评论( )

步骤1.小程序端通过微信第三方登录，取出nickname向服务端请求登录，成功后本地并缓存uid,accessToken

接口出处：https://mp.weixin.qq.com/debug/wxadoc/dev/api/api-login.html

App({
onLaunch: function() {
wx.login({
success: function(res) {
if (res.code) {
//发起网络请求
wx.request({
url: 'https://test.com/onLogin',
data: {
code: res.code
}
})
} else {
console.log('获取用户登录态失败！' + res.errMsg)
}
}
});
}
})

复制代码

缓存用户的基本信息

index.js

onLoad: function(){
var that = this
//调用应用实例的方法获取全局数据
app.getUserInfo(function(userInfo){
//请求登录
console.log(userInfo.nickName);
app.httpService(
'user/login',
{
openid: userInfo.nickName
},
function(response){
//成功回调
console.log(response);
// 本地缓存uid以及accessToken
var userinfo = wx.getStorageSync('userinfo') || {};
userinfo['uid'] = response.data.uid;
userinfo['accessToken'] = response.data.accessToken;
console.log(userinfo);
wx.setStorageSync('userinfo', userinfo);
}
);
})
}

复制代码

app.js

定义一个通用的网络访问函数：

httpService:function(uri, param, cb) {
// 分别对应相应路径，参数，回调
wx.request({
url: 'http://financeapi.applinzi.com/index.php/' + uri,
data: param,
header: {
'Content-Type': 'application/json'
},
success: function(res) {
cb(res.data)
},
fail: function() {
console.log('接口错误');
}
})
},

复制代码

这里method默认为get，如果设置为其他，比如post，那么服务端怎么也取不到值，于是改动了服务端的取值方式，由$_POST改为$_GET。

在Storage面板中，检查到数据已成功存入

　

1.本站遵循行业规范，任何转载的稿件都会明确标注作者和来源；2.本站的原创文章，请转载时务必注明文章作者和来源，不尊重原创的行为我们将追究责任；3.作者投稿可能会经我们编辑修改或补充。

相关文章

微信小程序轮播图 swiper图片组件

2016-11-23 09:49
微信小程序开发微信开发者工具快捷键

2016-11-23 09:49
微信小程序页面跳转传递参数

2016-11-23 09:49
微信小程序如何获取时间

2016-11-23 09:49

网友点评

精彩导读

2-HelloWorld微信小程序

微信小程序轮播图 swiper图片组件

微信小程序开发记账应用实战服务端之用户注册

微信小程序倒计时组件

微信小程序实现购物车页面

热门资讯

关注我们

关注微信公众号，了解最新精彩内容

-