Bagaimanakah aplikasi uniapp melaksanakan pengesahan pengguna dan pengurusan kebenaran?

Cara aplikasi uniapp melaksanakan pengesahan pengguna dan pengurusan kebenaran

Dengan pembangunan aplikasi mudah alih, pengesahan pengguna dan pengurusan kebenaran telah menjadi fungsi penting. uniapp menyediakan cara yang mudah dan pantas untuk melaksanakan pengesahan pengguna dan pengurusan kebenaran. Artikel ini akan memperkenalkan cara aplikasi uniapp melaksanakan pengesahan pengguna dan pengurusan kebenaran serta memberikan contoh kod yang sepadan.

1. Pelaksanaan fungsi pengesahan pengguna

Pengesahan pengguna ialah proses mengesahkan identiti pengguna, yang boleh digunakan untuk membezakan kebenaran pengguna dan melindungi keselamatan sumber. Dalam uniapp, pengesahan pengguna boleh dicapai dengan menggunakan pemalam atau membangunkannya sendiri.

1. Gunakan pemalam untuk melaksanakan pengesahan pengguna

Terdapat beberapa pemalam pengesahan pengguna yang biasa digunakan dalam uniapp, seperti pemalam uni-id. Pemalam uni-id ialah pemalam pengesahan pengguna berdasarkan fungsi awan Ia menyediakan pendaftaran pengguna, log masuk, mendapatkan kata laluan dan fungsi lain Ia juga menyokong log masuk pihak ketiga, seperti WeChat, Alipay, dll.

Langkah pelaksanaan khusus adalah seperti berikut:

(1) Pasang pemalam uni-id

Dalam projek uniapp, buka terminal dan laksanakan arahan berikut untuk memasang pemalam uni-id:

npm install uni-id

(2) Perkenalkan pemalam uni-id

Perkenalkan pemalam uni-id dalam halaman yang memerlukan pengesahan pengguna:

import uniID from '@/uni-id/uni-id.js'

(3) Gunakan pemalam uni-id untuk pendaftaran dan log masuk pengguna

Di bahagian logik halaman, anda boleh menggunakan pendaftaran dan log masuk yang disediakan oleh kaedah Log masuk pemalam uni-id untuk melengkapkan pengesahan pengguna:

uniID.register({
    username: '张三',
    password: '123456'
})
.then(res => {
    // 注册成功的逻辑处理
})
.catch(err => {
    // 注册失败的逻辑处理
})

uniID.login({
    username: '张三',
    password: '123456'
})
.then(res => {
    // 登录成功的逻辑处理
})
.catch(err => {
    // 登录失败的逻辑处理
})

2. Bangunkan anda sendiri untuk melaksanakan pengesahan pengguna

Jika pemalam dalam uniapp tidak memenuhi keperluan anda, anda juga boleh membangunkan fungsi pengesahan pengguna anda sendiri.

Langkah pelaksanaan khusus adalah seperti berikut:

(1) Buat antara muka untuk pengesahan pengguna

Untuk mencipta antara muka untuk pengesahan pengguna dalam fungsi awan, anda boleh menggunakan uniCloud, pembangunan awan DCloud, dsb.

(2) Panggil antara muka pengesahan pengguna dalam uniapp

Panggil antara muka pengesahan pengguna dalam uniapp, gunakan uni.request atau uniCloud.callFunction untuk memanggil.

2. Pelaksanaan fungsi pengurusan kebenaran

Pengurusan kebenaran adalah untuk mengawal akses dan pengendalian sumber pengguna berdasarkan peranan dan kebenaran pengguna. Dalam uniapp, anda boleh menggunakan vuex untuk pengurusan kebenaran.

1. Buat modul pengurusan kebenaran

Dalam direktori kedai dalam projek uniapp, buat modul vuex untuk pengurusan kebenaran.

// permission.js
const state = {
    roles: [], // 用户角色信息
    permissions: [] // 用户权限信息
}

const mutations = {
    SET_ROLES(state, roles) {
        state.roles = roles
    },
    SET_PERMISSIONS(state, permissions) {
        state.permissions = permissions
    }
}

const actions = {
    setRoles({commit}, roles) {
        commit('SET_ROLES', roles)
    },
    setPermissions({commit}, permissions) {
        commit('SET_PERMISSIONS', permissions)
    }
}

export default {
    namespaced: true,
    state,
    mutations,
    actions
}

2. Tetapkan peranan dan maklumat kebenaran selepas pengguna log masuk

Selepas pengguna berjaya log masuk, peranan dan maklumat kebenaran boleh ditetapkan berdasarkan maklumat identiti pengguna dan disimpan dalam vuex:

import store from '@/store'

const roles = ['admin'] // 用户角色信息
const permissions = ['create', 'update', 'delete'] // 用户权限信息

store.dispatch('permission/setRoles', roles)
store.dispatch('permission/setPermissions', permissions)

3. Apabila kawalan diperlukan Penghakiman kebenaran pada halaman kebenaran

Dalam halaman yang memerlukan kawalan kebenaran, anda boleh menggunakan peranan dan maklumat kebenaran yang disimpan dalam vuex untuk menentukan sama ada pengguna mempunyai kebenaran untuk melakukan operasi yang berkaitan:

import { mapState } from 'vuex'

export default {
    computed: {
        ...mapState('permission', ['roles', 'permissions'])
    },
    methods: {
        hasPermission(permission) {
            return this.permissions.includes(permission)
        }
    }
}

Di atas adalah bagaimana uniapp aplikasi melaksanakan pengesahan pengguna dan pengenalan kepada pengurusan hak. Log masuk pengguna, pendaftaran dan kawalan kebenaran boleh dicapai dengan mudah dengan menggunakan pemalam atau pembangunan diri. Semoga artikel ini dapat membantu anda.

Atas ialah kandungan terperinci Bagaimanakah aplikasi uniapp melaksanakan pengesahan pengguna dan pengurusan kebenaran?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!