uniapp使用云函數(shù)中的插件uni-id實現(xiàn)微信小程序的登錄

  • uni-id是官方為我們寫好的插件,通過這個插件,我們只需要在前端寫入相對應(yīng)的數(shù)據(jù)就會在云函數(shù)中生成相應(yīng)的數(shù)據(jù),他里面是封裝好的登錄注冊等接口(可以直接將用戶的信息傳遞到云數(shù)據(jù)庫中,并為我們做了一些驗證的方法),我們只需要調(diào)用傳值就可以了,可以說是很方便我們的使用,但是怎么使用呢?請繼續(xù)往下看!
  • 首先我們自己的項目中要先創(chuàng)建一個云服務(wù)空間,并且關(guān)聯(lián)上這個云服務(wù)空間,之后再官方的文檔中有或者是去插件市場搜索uni-id,下載并導(dǎo)入到云服務(wù)空間及部署到我們的項目中,如果不會創(chuàng)建的話,請看我的另一篇,unicloud入門里面有講解到。
image.png

image.png
  • 然后進入到插件市場中


    image.png

    image.png
  • 之后根據(jù)提示導(dǎo)入到你的項目中就可以了


    image.png
  • 為了方便你更好的理解,官方也有uni-id的項目,可以在創(chuàng)建一個項目進行查看


    image.png
  • 然后我們將下載的官方提供的案例下的云服務(wù)空間下的文件拷貝一下


    image.png
  • 將圖中的兩個文件復(fù)制到我們的云服務(wù)空間的文件夾下,然后進行上傳部署及初始化云數(shù)據(jù)庫,這里有興趣的小伙伴可以打開user-center文件夾下的index.js進行查看源碼,你就差不多明白了我們接下來的操作
  • 在這里演示下,微信小程序的登錄并將數(shù)據(jù)上傳到云數(shù)據(jù)庫中
這是微信小程序中的點擊按鈕進行登錄,獲取用戶的信息,方便我們后面獲取用戶的token
<button class="my-nav-title wx-title"  open-type="getUserInfo"
            @getuserinfo = "wx_user">未登入,點擊登入</button>

wx_user(e){//點擊獲取用戶信息
            var that = this;
                uni.showLoading({
                    title:'登錄中...'
                })
                uni.login({
                    success(res) {
                        uniCloud.callFunction({
                            name:'user-center',
                            data:{
                                action: 'loginByWeixin',//這是我們云函數(shù)文件中的微信登錄的值
                                params:{
                                    code:res.code//這是登錄的code值
                                }
                            },
                            success:ret=>{
                                if(ret.result.code == 0){
                                    that.is_token = true;
                                    uni.hideLoading();
                                    that.img_url = e.detail.userInfo.avatarUrl;
                                    that.userName = e.detail.userInfo.userName;
                                    console.log(that.img_url);
                                    console.log(that.userName)
                                    uni.setStorageSync('user',e.detail.userInfo);
                                    uni.setStorageSync('token',ret.result.token);
                                    uni.setStorageSync('uni_id_token_expired',ret.result.tokenExpired);
                                }
                            },
                            fail:msg1=>{
                                that.is_token = false;
                                uni.hideLoading();
                                console.error(msg1);
                                uni.showModal({
                                    showCancel: false,
                                    content: '微信登錄失敗,請稍后再試'
                                })
                            }
                        })
                    },fail:msg=>{
                        that.is_token = false;
                        uni.hideLoading();
                        console.error(msg);
                        uni.showModal({
                            showCancel: false,
                            content: '微信登錄失敗,請稍后再試'
                        })
                    }
                })
                
            },
  • 好了,基本的uni-id云函數(shù)你學(xué)會了嗎,想要了解更多的,你可以看看官方的文檔中uni-id下的API,里面有好多方法,盡情的挖掘吧!
?著作權(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ù)。

相關(guān)閱讀更多精彩內(nèi)容

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