登陸流程
1、使用者登入從後台獲取 token,選單資料
2、將token和選單資料存入sessionstorage,token用來校驗使用者是否已經登入
2、將返回的選單資料前端生成對應選單列表
3、處理每個子選單對應的頁面和子頁面許可權控制
其中後台會判斷使用者操作是否傳過來的會話id是不是同乙個,若不是,說明會話過期並且會報錯,前端返回到登入頁面
這裡校驗session過期可以有兩種方式,一是每一次訪問介面將token帶上,放在requestheader裡面,後台會校驗token;
二是使用者登入後後台直接在瀏覽器中生成jsessionid,之後使用者每次請求都會帶上它如下圖;
這次登入用的是第二種方式,前台需要設定在請求配置中設定config.withcredentials = true,相應後台也需要設定響應頭
子頁面許可權
關於子頁面許可權,使用者登入後台返回的選單資料不包括每個選單的子頁面,也就是說訪問乙個列表頁面,列表中有個按鈕詳情,點選進去的詳情頁面後台並沒有返回,此時稍微設定一下即可
在每個子頁面的路由資訊中加上 一條能識別是屬於哪個選單的
,然後,路由全域性鉤子中判斷路由跳轉,//對應的父頁面路徑
name: '業務查詢明細',
component: businessquerydetail
},
route.beforeeach((to, from, next) =>至於按鈕許可權,該系統中有角色管理,可以修改某個角色的具體許可權,所有按鈕許可權不能按照角色來判定了,只能是傻傻的讓後台記錄所有按鈕id,然後使用者登陸後返回可訪問的按鈕,else
else
}}else
else
}})
前端會有乙份資料對應系統每個按鈕id,根據返回的id做篩選,當載入某個頁面時,展示或者隱藏對應按鈕
前端註冊登入的業務流程 vue篇
專案中有一些路由是需要登入才可以進入的,比如首頁,個人中心等等 有一些路由是不需要登入就可以進入,比如登入頁,註冊頁,忘記密碼等等 那如何判斷路由是否需要登入呢?就要在路由js裡面做文章 需要注意 因為是路由router檔案中使用vue router做跳轉,在這裡就不能直接使用this.router...
前端註冊登入的業務流程 vue篇
專案中有一些路由是需要登入才可以進入的,比如首頁,個人中心等等 有一些路由是不需要登入就可以進入,比如登入頁,註冊頁,忘記密碼等等 那如何判斷路由是否需要登入呢?就要在路由js裡面做文章 需要注意 因為是路由router檔案中使用vue router做跳轉,在這裡就不能直接使用this.router...
純前端vue實現登入的驗證碼
以前是把驗證碼位址和id存在後端redis中,每次請求失敗或成功都作廢一組鍵值對 對於我的小伺服器為了節省資源,我覺得把驗證碼放在前端生成,進行生成驗證 前端客戶端呼叫js,大部分還是前端來提供效能支撐 驗證碼元件 components validcode.vue views login.vue中呼...