微信小程序記帳應用實例教程（續二）

#步驟

#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面板中，檢查到數據已成功存入

源碼下載：關注下方的公衆號->回覆數字1002

對小程序開發有趣的朋友關注公衆號: huangxiujie85，QQ羣: 581513218，微信: small_application，陸續還將推出更多做品。