今天小編給大家分享一下微信小程序怎么實現(xiàn)登錄的相關(guān)知識點,內(nèi)容詳細,邏輯清晰,相信大部分人都還太了解這方面的知識,所以分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后有所收獲,下面我們一起來了解一下吧。
創(chuàng)新互聯(lián)建站是一家企業(yè)級云計算解決方案提供商,超15年IDC數(shù)據(jù)中心運營經(jīng)驗。主營GPU顯卡服務(wù)器,站群服務(wù)器,四川服務(wù)器托管,海外高防服務(wù)器,機柜大帶寬租用·托管,動態(tài)撥號VPS,海外云手機,海外云服務(wù)器,海外服務(wù)器租用托管等。一、小程序開發(fā)前準備
二、小程序登錄
我先開始的時候在登錄就出問題了,因為當時官方給的文檔就讓人很糾結(jié),因為官方給的文檔讓人感覺就凌亂了,在這里我解釋一下,
官方給的流程:
第一步:獲取用戶授權(quán)信息(每次的授權(quán)信息都不一樣)
第二部: 上代碼
wx.request({ url : API_URL,//自己的服務(wù)接口地址 method : 'POST', // 在這里需要格外注意了,所有的post請求header必須是下面的格式不然你又入坑了 header : {'content-type':'application/x-www-form-urlencoded'}, data : { iv: res2.iv, code: code, encryptedData: res2.encryptedData }, success: function (data) { // 4.解密成功后 獲取自己服務(wù)器返回的結(jié)果 // 解密的sdk在開發(fā)文檔上搜索-簽名加密-然后你閱讀后就知道了-下載屬于自己語言的解碼包 if(data.data.status == 1) { var userInfo_ = data.data.userInfo; }else { console.log('解密失敗') } }, fail:function() { console.log('系統(tǒng)錯誤') } })
他的意思是所有的操作在后臺進行,這樣相對安全一點,還有一點就是公眾號需要的unionId可以通過解密獲取到,那樣的話就可以在公眾號的頁面看到你的小程序了,unionId是公眾號和小程序的共用ID,如果你們的項目是需要關(guān)聯(lián)的話那我還是建議你按照官方的走,如果不是的話,下面的方式可以迅速解決你的登錄問題
自定義流程:
//app.js function Login(code,username,img) { var that = this wx.request({ url:HTTP_URL, data: { appid : '你后臺獲取的appdi', secret : '你后臺獲取的secret', js_code : code, grant_type : 'authorization_code' }, method:'GET', header:{'content-type': 'application/json'}, success: function (a) { var openid = a.data.openid // 請求自己的服務(wù)器 wx.request({ url:API_URL, data: { img : img openid : openid, username : username, }, success: function(b) { // 成功返回用戶的ID(這是數(shù)據(jù)庫ID) console.log(b.data.uid) // 我這里是把用戶返回的ID存到了緩存里因為,我在使用全局變 // 量時候發(fā)現(xiàn)有時候引入了js但是還會有丟失找不到的現(xiàn)象 wx.setStorageSync('uid', b.data.uid) } }) }, fail: function () { // 在這里你要考慮到用戶登錄失敗的情況 wx.showToast({ title: '網(wǎng)站正在維護中...', icon: 'loading', duration: 10000 }); } }) } // 自己服務(wù)器的地址 // 注意:開發(fā)時可以是http協(xié)議,但是如果上線必須申請https協(xié)議(也就是SSL協(xié)議)協(xié)議可以在阿里和騰訊的控制 // 臺都可以購買,例子:阿里-管理控制臺-安全(云盾)-證書服務(wù),一般用dv免費的就可以了協(xié)議申請完后需要補全, // 補全完畢后下載文件是個壓縮包,里面有兩個文件,把他們放到你服務(wù)器上,然后再配置文件中指明這是ssl協(xié)議并 // 且指明路徑,這樣 你就算配置成功了,至于如何配置,網(wǎng)上開源的教程挺多的,nginx有Apache也有如果你 var API_URL = "自己服務(wù)器的地址"; // 微信提供的接口地址:這里必須要把https://api.weixin.qq.com這個網(wǎng)址在微信后臺安全域名中添加進去否則你會 // 感覺生活是如此的黑暗完全看不到希望 var HTTP_URL = "https://api.weixin.qq.com/sns/jscode2session?appid=appid&secret=app_sectet&grant_type=authorization_code&js_code=code"; App({ onLaunch: function () { // 調(diào)用API從本地緩存中獲取數(shù)據(jù) var logs = wx.getStorageSync('logs') || [] logs.unshift(Date.now()) wx.setStorageSync('logs', logs) }, getUserInfo: function (cb) { var that = this if(this.globalData.userInfo) { typeof cb == "function" && cb(this.globalData.userInfo) }else { // 調(diào)用登錄接口 wx.login({ // login流程 success: function (res) { //登錄成功 if (res.code) { // 這里是用戶的授權(quán)信息每次都不一樣 var code = res.code; wx.getUserInfo({ // getUserInfo流程 success: function (res2) { // console.log(res2) that.globalData.userInfo = res2.userInfo typeof cb == "function" && cb(that.globalData.userInfo) var username = res2.userInfo.nickName var img = res2.userInfo.avatarUrl // 請求自己的服務(wù)器 Login(code,username,img); } }) }else { wx.showModal({ title: '提示', content: '獲取用戶登錄態(tài)失敗!'+res.errMsg }) } } }) } }, globalData: { userInfo:null } })
下面附兩張圖片是申請SSL協(xié)議的大概流程圖
以上就是“微信小程序怎么實現(xiàn)登錄”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家閱讀完這篇文章都有很大的收獲,小編每天都會為大家更新不同的知識,如果還想學(xué)習(xí)更多的知識,請關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。
標題名稱:微信小程序怎么實現(xiàn)登錄-創(chuàng)新互聯(lián)
URL鏈接:http://jinyejixie.com/article6/ggoog.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供服務(wù)器托管、網(wǎng)站收錄、響應(yīng)式網(wǎng)站、營銷型網(wǎng)站建設(shè)、小程序開發(fā)、微信公眾號
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容