この記事では、WeChat ミニ プログラム に関する関連知識を提供し、主にミニ プログラムの認(rèn)証ログイン機(jī)能の実裝方法を紹介します。一緒に見ていきましょう。みんな。

[関連する學(xué)習(xí)の推奨事項: 小プログラム學(xué)習(xí)チュートリアル]

私たちの日常の仕事や勉強(qiáng)の中で、私たちの生活の中で、WeChat ミニ プログラムは私たちの切り離せない一部になっています。注意深く注意してみると、新しいミニ プログラムを使用するたびに、必ず次のページに遭遇することになります:

これは WeChat ミニ プログラムの認(rèn)証ログイン機(jī)能です。認(rèn)証ログイン後、ミニ プログラムを通常に使用できるようになり、ミニ プログラムはユーザー権限、攜帯電話番號、その他の個人情報も取得します

認(rèn)可ログイン機(jī)能の分析

WeChat アプレットの認(rèn)可ログインの具體的な手順は次のとおりです。

#詳細(xì)実裝には主に次の 3 つのステップがあります。

• wx.login() WeChat API を呼び出して、一時的なログイン資格情報コードを取得し、それをサーバーに送り返します。開発者サーバー

• auth.code2Session WeChat API インターフェイスを呼び出して、ユーザーの一意の識別子 OpenID、WeChat オープン プラットフォーム アカウントのユーザーの一意の識別子 UnionID、およびセッション キー session_key

  # を取得します。
• ##手順通り 2. 取得したパラメータを復(fù)號し、ユーザーの攜帯電話番號やアバターなどを取得し、必要なデータをキャッシュに保存します。

  #コードを?qū)g裝する手順は次のとおりです:

1. 一時的なログイン資格情報コードを取得します

WeChat が getUserInfo インターフェイスを正式に変更したため、 WeChat アプレットに入るとすぐに認(rèn)証ウィンドウが自動的にポップアップすることを認(rèn)識することは現(xiàn)在不可能なので、ボタン ボタンを使用して手動で

をトリガーできるのはユーザーだけです。まず簡単なポップアップを作成しましょうボックスを開き、isShow

変數(shù)で制御します。isShow は手順 3 でキャッシュされた情報に依存します。すべての手順が完了すると、ユーザー情報が正しくキャッシュされます。このとき、ポップアップ ボックスは非表示、それ以外の場合、ポップアップ ボックスは表示狀態(tài)になります。

??<view>
????????<view>
??????????<text>需要先授權(quán)獲取個人信息</text>
??????????<button>微信賬號快速授權(quán)</button>
????????</view>
??</view>

ボタンをクリックすると、getUserInfo メソッドが呼び出されます。

isShow

Set false に設(shè)定し、wx.login を使用してログイン資格情報コードを取得します

getUserInfo:e=>{??????this.setData({????????isShow:false
??????})

??????wx.login({????????success:?function?(res)?{???????????????let?code?=?res.code?//?登錄憑證code
?????????}
??????})
??????
??}

2. ログイン資格情報コードに基づいてユーザーのログイン情報を取得します

ログイン資格情報を取得しますコード 最後に、auth.code2Session WeChat API インターフェイスを呼び出します (これはサーバー側(cè)の操作であり、バックエンド ボスが処理します。私たちは彼から提供されたインターフェイスを直接呼び出すだけです)

?????????wx.request({????????????????url:?獲取用戶信息的auth.code2Session微信api接口,????????????????method:?'POST',????????????????data:{??????????????????code:code//登錄憑證code
????????????????},????????????????header:?{??????????????????'content-type':?'application/json;charset=UTF-8'
????????????????},????????????????
????????????????success:?function?(res)?{??????????????????var?userphone=?res.data.data??????????????????//解密手機(jī)號
??????????????????var?msg?=?e.detail.errMsg;??????????????????var?sessionKey?=?userphone.session_key;//會話密鑰
??????????????????var?encryptedData=e.detail.encryptedData;?//簽名
??????????????????var?unionid?=?userphone.unionid//唯一標(biāo)識
??????????????????var?iv=?e.detail.iv;??????????????????//授權(quán)成功
??????????????????if?(msg?==?'getPhoneNumber:ok')?{
????????????????????wx.checkSession({??????????????????????success:function(){????????????????????????//進(jìn)行請求服務(wù)端解密手機(jī)號
????????????????????????this.deciyption(sessionKey,encryptedData,iv,unionid);
??????????????????????}
????????????????????})
??????????????????}
????????????????}
??????????????})
????????}
??????})

現(xiàn)時點では、ユーザー情報の大部分を取得しましたが、ユーザーの攜帯電話番號、ユーザーのアバター、その他の情報はまだ暗號化されているため、これらのパラメータを取得するには復(fù)號化する必要があります

3。ユーザー情報に従って、復(fù)號化してください。ユーザーの攜帯電話番號を取得します

deciyption(sessionKey,encryptedData,iv,unionid){????var?that?=?this;
????wx.request({??????url:?解密接口,??????method:?'POST',??????data:?{????????sessionKey:?sessionKey,????????encryptedData:encryptedData,????????iv:?iv
??????},??????header:?{????????'content-type':?'application/json;charset=UTF-8'
??????},??????success:?function(res)?{
????????let?data?=?res.data????????if?(data.resultCode?==?'success')?{
????????????wx.setStorageSync('userTel',?data.data.phoneNumber);//存儲解密后的用戶手機(jī)號
????????}else{
????????????wx.showToast({????????????????title:?'獲取信息失敗請重新授權(quán)',????????????????icon:?'none'
????????????})
????????????that.setData({????????????????isShow:true
????????????})
????????}????
??????},
??????fail:function(res)?{
????????wx.showToast({????????????title:?'獲取失敗請重新授權(quán)',????????????icon:?'none'
????????})
????????that.setData({??????????isShow:true
????????})
??????}
????})
??},

現(xiàn)時點で、承認(rèn)されたログイン機(jī)能は完了しています

[関連する學(xué)習(xí)上の推奨事項:

小プログラム學(xué)習(xí)チュートリアル

]

以上が簡単な紹介: ミニプログラムの認(rèn)可ログイン機(jī)能を?qū)g裝するの詳細(xì)內(nèi)容です。詳細(xì)については、PHP 中國語 Web サイトの他の関連記事を參照してください。