APP微信登錄

微信,QQ等第三方登錄在在App上很常見,便于用戶快速登錄。所以這篇文章說的是App如何調(diào)用微信登錄實現(xiàn)功能;
以下的談?wù)擁椖靠蚣懿皇窃_發(fā),是以uni-app框架為背景的,但需要參考微信官方關(guān)于移動應(yīng)用登錄指南。而且涉及到的代碼更多是前端代碼,后端只是講下流程。
uni-app框架本身通過h5Plus的封裝是可以開發(fā)微信登錄的,但這里參考的是微信官方的文檔及h5Plus部分api所開發(fā)的。

大致流程:

1 客戶端通過h5+的api獲取到授權(quán)臨時票據(jù)(code),傳給服務(wù)端;
2 服務(wù)端通過code獲取access_token,得到相應(yīng)的參數(shù),eg:openid,refresh_token等;

到這一步其實已經(jīng)完成了登錄過程。至于之后再獲取用戶個人信息時,由服務(wù)端去調(diào)用相關(guān)api獲??;
流程看起來很簡單,但前端還是存在一些坑,需要填下。

前端:

var aweixin=null;
var _this=this
plus.oauth.getServices(function(services){
    console.log(services)
    services.forEach((item)=>{
        if(item.id=='weixin'){
            aweixin = item;
        }
    })
        if(!aweixin){//沒有取得微信登陸的服務(wù)
        uni.showToast({
            title:'當(dāng)前環(huán)境不支持微信登錄',
            icon:'none'
        })
        return;
    }
      if(!aweixin.authResult){//是否登錄認證過
        aweixin.authorize((e)=>{
          console.log(e.code)
          //將這個code 傳給服務(wù)端,服務(wù)端調(diào)用相關(guān)api做操作,進而自定義業(yè)務(wù)邏輯
        },(e)=>{
          uni.showToast({
            title:'用戶取消授權(quán)',
            icon:'none'
          })
        },{scope:'snsapi_userinfo',state:'authorize',appid:''})
    }else{
        console.log('已經(jīng)登錄過了')
        uni.showToast({
            title:'請使用其他登錄方式',
            icon:'none'
        })
    }
}, function(e){
    console.log(e)
    uni.showToast({
        title:'獲取登錄授權(quán)服務(wù)列表失敗',
        icon:'none'
    })
});
用戶退出登錄

用戶退出登錄,還是需要調(diào)用h5+的api退出;否則可能會出現(xiàn)用戶退出登錄再登錄時,會執(zhí)行authResult已經(jīng)執(zhí)行登錄過了的情況。

plus.oauth.getServices(function(services){
    console.log(services)
    if(services.length!=0){
        services.forEach(item=>{
                if(item.id=='weixin'){
                    item.logout(function(e){
                        console.log(e)
                    }, function(e){
                        console.log(e)
                    });
                }
        })
    }
})

以上的代碼是前端的操作;

authorize函數(shù)的第三個參數(shù)在Android端是可以不用填的,在ios端也是可以實現(xiàn)授權(quán)登錄的,但是APP Store在審核時,出現(xiàn)了問題,并沒有走的第一個函數(shù)回調(diào),而是執(zhí)行第二個函數(shù),具體原因不明,因為本人在多臺設(shè)備上測試并沒有復(fù)現(xiàn) 出bug。所以解決方法是加上第三個參數(shù)即可;

服務(wù)端:

服務(wù)端通過調(diào)用微信的api獲取到openid,refresh_token ,access_token等;服務(wù)端要將access_token保存起來,2h有效期,過期后需要通過refresh_token進行刷新獲??;
客戶端在每一次登錄時,服務(wù)端都是要獲取用戶的信息,然后插入到數(shù)據(jù)庫中便于更新用戶信息;

1 這塊獲取到的unionId不一定會有,如果開發(fā)者需要用unionId去做用戶的判別,則需要再通過openid等參數(shù)調(diào)用api獲取unionid;
2 服務(wù)端需要對access_token 進行過期的刷新,一般是提前5min重新刷新。

總結(jié):

APP端的微信登錄用h5+的api也是能開發(fā)的,但實際上并沒有去直接跟微信服務(wù)器交互,調(diào)h5+的api能夠直接獲取到openid,unionID以及用戶的信息,客戶端載將這個數(shù)據(jù)提交給服務(wù)端,完成登錄的操作;
但實際上,本人在開發(fā)時,問題很多,比如 authorize的方法,用戶在每次授權(quán)彈窗時,會調(diào)用authorize兩次,即用戶需要授權(quán)兩次才能執(zhí)行接下來的進程;ios端是獲取不到unionId,因為項目使用unionID做用戶身份的識別。而且api所需要的appSecret是保存在客戶端的,當(dāng)然也可以保存在服務(wù)端,回傳給客戶端,但這樣是比較麻煩或者保存在客戶端不安全。
所以最好的方式是用微信文檔的流程操作
要是有不對的地方,請大佬指教?。?!

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

友情鏈接更多精彩內(nèi)容