淺談前后端分離技術(shù)在權(quán)限管理系統(tǒng)中的應(yīng)用

盧彥曉

摘要：在各種基于Web技術(shù)的應(yīng)用系統(tǒng)中，基于系統(tǒng)安全性的需求，都需要對(duì)用戶在系統(tǒng)中的權(quán)限進(jìn)行管理，隨著Web前后端開發(fā)技術(shù)的發(fā)展與應(yīng)用，基于前后端分離的架構(gòu)得到了深入和廣泛的應(yīng)用，逐漸成為Web開發(fā)的標(biāo)準(zhǔn)。該文在對(duì)前端框架Vue.js、后端SpringBoot框架、Apache Shiro安全框架技術(shù)進(jìn)行分析的基礎(chǔ)之上，基于RBAC的權(quán)限設(shè)計(jì)理念，對(duì)前后端分離在權(quán)限管理系統(tǒng)中的應(yīng)用進(jìn)行分析，為權(quán)限管理系統(tǒng)的設(shè)計(jì)提供了一個(gè)思路。

關(guān)鍵詞：前后端分離架構(gòu);Vue.js;權(quán)限管理系統(tǒng);基于角色的訪問控制;Apache Shiro安全框架

中圖分類號(hào)：TP391? ? ? 文獻(xiàn)標(biāo)識(shí)碼：A

文章編號(hào)：1009-3044（2021）34-0068-02

隨著互聯(lián)網(wǎng)技術(shù)的飛速發(fā)展和應(yīng)用的深入，B/S開發(fā)模式在基于Web的應(yīng)用中逐漸成為主流的開發(fā)模式。雖然B/S開發(fā)模式得到了廣泛的應(yīng)用，但它也存在著諸多的缺點(diǎn)，例如前后端代碼的耦合度高，網(wǎng)站流量較大時(shí)，服務(wù)器的壓力較大，以及網(wǎng)站響應(yīng)速度慢等。

另一方面，隨著互聯(lián)網(wǎng)應(yīng)用的深入，網(wǎng)站流量的增加，業(yè)務(wù)需求的改變，項(xiàng)目勢(shì)必需要進(jìn)行升級(jí)擴(kuò)展和結(jié)構(gòu)優(yōu)化。但傳統(tǒng)的開發(fā)模式，雖然引入了MVC思想，使代碼得到了一定的解耦合，但仍然有大量的前后端代碼耦合在一起，需要開發(fā)人員必須同時(shí)學(xué)習(xí)前后端技術(shù)，給開發(fā)人員帶來了極大的學(xué)習(xí)壓力和成本，同時(shí)造成代碼的可讀性和可維護(hù)性較差，給后期項(xiàng)目的擴(kuò)展和維護(hù)增加了難度。

因此，伴隨著前端技術(shù)的發(fā)展，在Web開發(fā)中引入前后端分離的開發(fā)模式是必然的趨勢(shì)，前端與后端分離后，不僅降低了前端開發(fā)人員學(xué)習(xí)新知識(shí)的成本，同時(shí)提高了開發(fā)的效率，縮短了項(xiàng)目開發(fā)周期，提高了項(xiàng)目的可維護(hù)和可擴(kuò)展性。

1 前后端分離技術(shù)概述

傳統(tǒng)的Web開發(fā)，開發(fā)人員不僅要負(fù)責(zé)后端，還要負(fù)責(zé)前端，開發(fā)人員不能同時(shí)進(jìn)行，項(xiàng)目開發(fā)的效率較低。而在前后端分離的開發(fā)模式中，開發(fā)人員各司其職，前端開發(fā)人員只需要關(guān)注于前端頁面的呈現(xiàn)、樣式、行為，通過調(diào)用后端的API實(shí)現(xiàn)數(shù)據(jù)的渲染;后端人員則只需要關(guān)注于數(shù)據(jù)訪問和業(yè)務(wù)邏輯，根據(jù)項(xiàng)目前端需求提供相應(yīng)的API接口供前端調(diào)用即可。前后端分離實(shí)現(xiàn)了Web開發(fā)的高度解耦，開發(fā)人員分工明確、職責(zé)分明，前后端只通過API進(jìn)行交互。

1.1 前端Vue.js

Vue.js是目前應(yīng)用較多的前端開發(fā)框架，它被設(shè)計(jì)為自底向上逐層應(yīng)用，是一套用于快速構(gòu)建前端用戶界面的漸進(jìn)式框架，它只關(guān)注視圖層，并且易于學(xué)習(xí)。它將整個(gè)頁面的內(nèi)容分解為若干個(gè)組件，每一個(gè)組件都有自己的JavaScript代碼和CSS樣式，利用組件來構(gòu)建頁面內(nèi)容，同時(shí)，組件還可以實(shí)現(xiàn)復(fù)用。另一方面，Vue.js提供了強(qiáng)大的前端路由功能，利用其路由守衛(wèi)的功能，在前端進(jìn)行路由跳轉(zhuǎn)的時(shí)候，對(duì)路由進(jìn)行一系列的邏輯判斷，實(shí)現(xiàn)對(duì)頁面組件權(quán)限的控制功能。

1.2 后端SpringBoot開發(fā)框架

在Web開中，Spring的出現(xiàn)解決了傳統(tǒng)EJB開發(fā)繁重的問題，為基于Java的Web開發(fā)提供了一套簡(jiǎn)單實(shí)用的解決方案。但伴隨著互聯(lián)網(wǎng)應(yīng)用的深入，系統(tǒng)的功能越來越多，其復(fù)雜度也越來越高，在Spring中，大量的XML配置，以及與第三方框架的整合問題，給系統(tǒng)開發(fā)者帶來了極大的痛苦。因此，SpringBoot框架應(yīng)運(yùn)而生了，其設(shè)計(jì)的目的就是用來簡(jiǎn)化Spring應(yīng)用的初始化搭建以及開發(fā)過程，它采用了特定的方式進(jìn)行配置，大大減少了項(xiàng)目中的XML配置，使開發(fā)人員可以通過少量的注解即可實(shí)現(xiàn)項(xiàng)目的自動(dòng)化配置，以及導(dǎo)入相關(guān)的依賴，即可實(shí)現(xiàn)與第三方框架進(jìn)行整合，極大地提高了系統(tǒng)開發(fā)的效率。

1.3 Apache Shiro安全框架

在早期的Web應(yīng)用中，安全性與權(quán)限主要通過HttpSessions與數(shù)據(jù)加密來實(shí)現(xiàn)，但這樣的方式，應(yīng)用時(shí)非常麻煩，因此，應(yīng)運(yùn)而生了Apache Shiro框架。它是一個(gè)簡(jiǎn)單易用且功能強(qiáng)大的Java安全框架，它能夠?yàn)閃eb應(yīng)用系統(tǒng)提供用戶認(rèn)證、授權(quán)、數(shù)據(jù)加密以及會(huì)話管理等功能，可以為任何應(yīng)用提供強(qiáng)大的安全保障。由于其易用性、靈活性、對(duì)Web的支持、可插拔、強(qiáng)大的技術(shù)支持等特性，在權(quán)限管理系統(tǒng)中得到了廣泛的應(yīng)用。

2 前后端分離框架技術(shù)在權(quán)限系統(tǒng)中的應(yīng)用分析

在所有的權(quán)限管理系統(tǒng)中，都需要實(shí)現(xiàn)以下兩方面的功能，一是確定訪問系統(tǒng)的用戶身份，二是對(duì)用戶的權(quán)限進(jìn)行管理。在傳統(tǒng)前后端不分離的情況下，路由都由后端統(tǒng)一管理，通過對(duì)訪問的URL進(jìn)行驗(yàn)證實(shí)現(xiàn)權(quán)限的管理。在前后端分離模式中，由于前后端都有相應(yīng)的路由，而且項(xiàng)目不再基于session了，如何確定訪問者的身份、確認(rèn)訪問者的權(quán)限呢？

2.1 基于角色的訪問控制（RBAC）

在不同的應(yīng)用系統(tǒng)中，權(quán)限管理系統(tǒng)的權(quán)限控制部分是不同的，傳統(tǒng)的權(quán)限管理在應(yīng)用于不同的系統(tǒng)時(shí)，需要對(duì)權(quán)限控制部分進(jìn)行重新設(shè)計(jì)，因此，基于角色的訪問控制得到了應(yīng)用。它將用戶和系統(tǒng)的權(quán)限進(jìn)行了分離，用戶在系統(tǒng)中可以配置為不同的角色，通過角色獲得該角色所擁有的權(quán)限，不僅有效地減少了授權(quán)的復(fù)雜性，還降低了出錯(cuò)的概率。

在RBAC 模型中，主要分為用戶、角色、權(quán)限、資源和操作五個(gè)元素，通過將用戶與系統(tǒng)權(quán)限分離，使得系統(tǒng)中用戶的認(rèn)證和授權(quán)更加靈活。一個(gè)用戶可以擁有多個(gè)角色，因此，一個(gè)用戶可以根據(jù)不同的應(yīng)用場(chǎng)景，相應(yīng)地?fù)碛胁煌慕巧鶕碛械臋?quán)限。

RBAC模型主要分為用戶表、角色表、用戶角色表、資源表、角色資源表，用戶表保存用度的賬號(hào)、密碼等信息，角色保存用戶角色，用戶角色表保存用戶的角色，角色資源表保存角色所擁有的權(quán)限，資源表保存系統(tǒng)中存在的資源，主要url、path、component、name等字段，path表示后端接口的路徑，用于后端權(quán)限控制;path表示前端路由的路徑，用于前端頁面級(jí)的權(quán)限驗(yàn)證。component表示前端路由路徑下的組件;name表示菜單的名稱，parentID表示父級(jí)菜單的編號(hào)，用于生成菜單。

2.2 身份驗(yàn)證與權(quán)限認(rèn)證

當(dāng)用戶訪問權(quán)限管理系統(tǒng)時(shí)，首先判斷用戶是否執(zhí)行了登錄操作，如果用戶沒有登錄，Apache Shiro的安全模塊會(huì)阻止用戶訪問一切資源，只有用戶通過身份認(rèn)證才可以使用系統(tǒng)，當(dāng)ApacheShiro接收到用戶的登錄請(qǐng)求后，會(huì)通過該請(qǐng)求獲得用戶在登錄頁面輸入的用戶名和密碼，然后查詢數(shù)據(jù)庫，取得用戶的相關(guān)信息，例如密碼，然后與用戶輸入的進(jìn)行比對(duì)，如果比對(duì)成功則說明用戶是合法用戶，則允許用戶進(jìn)入權(quán)限管理主界面，否則返回給前端相應(yīng)的錯(cuò)誤信息。

當(dāng)用戶通過身份驗(yàn)證之后，Shiro會(huì)將已登錄用戶的相關(guān)信息保存在Session對(duì)象中，例如其上次登錄時(shí)間、時(shí)間戳、最后操作時(shí)間等。當(dāng)用戶退出系統(tǒng)后，存儲(chǔ)該用戶相關(guān)信息的Session將會(huì)被系統(tǒng)清理，也就是說用戶再次訪問系統(tǒng)必須重新進(jìn)行登錄。

RBAC中用戶的權(quán)限是與其當(dāng)前的角色相關(guān)的，不同的角色在系統(tǒng)中的權(quán)限不同，用戶成功登錄后，服務(wù)端即根據(jù)數(shù)據(jù)庫中用戶的角色，取得該用戶所擁有的所有權(quán)限，當(dāng)前端訪問后端API時(shí)，Shiro會(huì)根據(jù)數(shù)據(jù)庫中的用戶權(quán)限進(jìn)行認(rèn)證，如果認(rèn)證失敗，則向前端返回認(rèn)證失敗信息，從而實(shí)現(xiàn)權(quán)限認(rèn)證。

2.3 前后端技術(shù)在系統(tǒng)中職責(zé)的改變

前后端分離后，由于前后端都有相應(yīng)的路由技術(shù)，權(quán)限管理則面臨著前端一個(gè)頁面同時(shí)調(diào)用后端多個(gè)接口的問題，傳統(tǒng)的通過URL對(duì)用戶權(quán)限進(jìn)行驗(yàn)證方法則不適用了，因此，則需要前后端共同對(duì)權(quán)限進(jìn)行控制。

前后端分離后，基本思想是，前端通過后端提供的API接口向服務(wù)端（后端）請(qǐng)求數(shù)據(jù)，請(qǐng)求時(shí)需要攜帶token信息，服務(wù)端（后端）則根據(jù)token判斷用戶的登錄狀態(tài)、用戶的權(quán)限等。

前端主要實(shí)現(xiàn)用戶登錄頁面、錯(cuò)誤信息頁和管理系統(tǒng)主頁面三個(gè)頁面，用戶登錄成功時(shí)跳轉(zhuǎn)到管理系統(tǒng)主頁。在進(jìn)入主頁之前，通過調(diào)用后端API接口獲取用戶角色所對(duì)應(yīng)的資源，生成系統(tǒng)管理菜單，然后通過菜單的點(diǎn)擊實(shí)現(xiàn)前端的路由跳轉(zhuǎn)，以加載呈現(xiàn)不同的功能頁面，實(shí)現(xiàn)相關(guān)業(yè)務(wù)的操作。

在此種情況下，會(huì)出現(xiàn)另外一個(gè)問題，假如某個(gè)用戶登錄之后記下了一個(gè)自己沒有訪問權(quán)限的路由URL，然后通過在地址欄手動(dòng)輸入該URL以訪問受限的資源，因?yàn)閷?shí)現(xiàn)了前后端分離，此時(shí)的后端并不了解前端路由變化引起的頁面跳轉(zhuǎn)，則會(huì)給系統(tǒng)帶來極大的安全隱患。所以在前后端的分離中，除了后端進(jìn)行權(quán)限的認(rèn)證外，前端同樣也需要進(jìn)行權(quán)限的認(rèn)證。在Vue.js中可以通過它提供的路由守衛(wèi)來進(jìn)行邏輯判斷，實(shí)現(xiàn)前端的權(quán)限認(rèn)證。例如在路由進(jìn)入前的鉤子中，首先獲取存儲(chǔ)在cookie中的token信息，如果沒有token信息，則通過前端路由跳轉(zhuǎn)到用戶登錄頁面。如果存在token信息，則對(duì)用戶需要訪問的目標(biāo)（資源）進(jìn)行權(quán)限的判斷，如果不需要授權(quán)，則直接進(jìn)行訪問，如果需要進(jìn)行授權(quán)，則根據(jù)后端返回給前端的用戶信息，進(jìn)行權(quán)限的驗(yàn)證，如果在授權(quán)頁面中，則構(gòu)造路由信息，動(dòng)態(tài)加載路由信息，訪問目標(biāo)頁面。

后端則除了進(jìn)行傳統(tǒng)的權(quán)限認(rèn)證管理外，還需要根據(jù)權(quán)限控制的粒度向前端返回不同的數(shù)據(jù)。例如頁面權(quán)限，后端根據(jù)用戶信息篩選有權(quán)限的頁面（接口）返回給前端相應(yīng)的用戶信息;按鈕權(quán)限，后端則將用戶擁有的按鈕數(shù)據(jù)返回給前端，前端通過自定義的相關(guān)指令判斷用戶是否擁有特定按鈕的權(quán)限。

3 結(jié)論

隨著互聯(lián)網(wǎng)技術(shù)的發(fā)展和應(yīng)用的深入，應(yīng)用系統(tǒng)的安全性越來越受到人們的關(guān)注。本文基于目前流行的前后端分離技術(shù)架構(gòu)，對(duì)基于RBAC權(quán)限管理系統(tǒng)的設(shè)計(jì)進(jìn)行探索和分析，對(duì)目前常用的前后端開發(fā)技術(shù)在系統(tǒng)中的應(yīng)用進(jìn)行思考，本文僅僅對(duì)應(yīng)用前后端分離技術(shù)進(jìn)行權(quán)限管理進(jìn)行了分析，并沒有進(jìn)行實(shí)現(xiàn)，通過本文，有望能為系統(tǒng)的開發(fā)者提供一個(gè)設(shè)計(jì)的思路，提供一個(gè)參考。

參考文獻(xiàn)：

[1] 王鋒，劉俊波.前后端分離模式下的WEB系統(tǒng)集成方案[J].通信技術(shù)，2020，53（9）：2347-2350.

[2] 廖祥.基于前后端分離架構(gòu)的用戶權(quán)限控制系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)[J].軟件工程，2020，23（12）：24-26.

[3] 宋清卿.前后端分離Web系統(tǒng)下一種訪問控制方法的設(shè)計(jì)與實(shí)現(xiàn)[J].計(jì)算機(jī)時(shí)代，2020（5）：23-26.

[4] 何鼎權(quán)，胡輝，嚴(yán)家成.基于RBAC的通用權(quán)限管理系統(tǒng)[J].電腦知識(shí)與技術(shù)，2020，16（33）：97-102.

[5] 傅安中，王祥榮.基于Apache Shiro的儲(chǔ)物管理系統(tǒng)權(quán)限管理研究與實(shí)現(xiàn)[J].電腦編程技巧與維護(hù)，2020（3）：99-102.

[6] 白嘉萌，寇英帥，劉澤藝，等.云計(jì)算平臺(tái)基于角色的權(quán)限管理系統(tǒng)設(shè)計(jì)與實(shí)現(xiàn)[J].信息網(wǎng)絡(luò)安全，2020，20（1）：75-82.

【通聯(lián)編輯：唐一東】