LiveGBS-GB28181流媒體服務如何實現跨域鑑權

 

LiveGBS 實現了 GB28181 協議，可以接入各個廠家的監控設備和監控平臺，實現統一管理，和 web 端無插件播放，同時支持手機、微信播放。

LiveGBS 提供簡單的登陸鑑權,客戶端經過用戶名密碼登陸成功後,服務端返回認證token的cookie, 後續的接口訪問, 服務端從cookie讀取token進行校驗. 可是, 在與客戶系統集成時, 每每須要在客戶系統完成鑑權過程. 這時就涉及到跨域的問題. 那麼,這一套鑑權過程如何應用到跨域場景中呢?

服務端處理

服務端須要作如下處理:

1. 登陸成功, 服務端主動寫 token 到 cookie

   按照以前的接口設計, 登陸成功, 服務端在 HTTP Response Body 中返回 token,由客戶端本身負責將 token 寫入 cookie. 在跨域場景中, 這樣就行不通了,因爲瀏覽器的限制, 客戶端沒法將 token 寫到非子域名 cookie. 改成服務端主動寫 token 到 cookie 就沒有這個問題了. 服務端在 HTTP Response Header 中添加 Set-Cookie 字段, 寫入 token=xxx

2. 服務端統一作充許跨域訪問設置

   服務端配置充許跨域而且攜帶cookie, 須要在 HTTP Response Header 中添加如下兩項:

   Access-Control-Allow-Credentials: true
   Access-Control-Allow-Origin: $http_origin

   Access-Control-Allow-Origin 不能夠配置成 *, 而是當前HTTT前求客戶端的 Origin

3. 註銷登陸時, 服務端主動將 token 從 cookie 清理

   Set-Cookie: token=; expires=Thu, 01 Jan 1970 00:00:00 GMT;

客戶端處理

客戶端沒必要顯示保存 token 到 cookie. 全部和 LiveGBS 的交互接口須要添加跨域配置, xhrFields: { withCredentials: true } 和 crossDomain: true

例如跨域登陸接口調用示例以下:

$.ajax({
    type: "GET",
    url: "http://other-domain/api/v1/login",
    xhrFields: { 
        withCredentials: true
    },
    crossDomain: true, 
    data: {
        username: 'admin',
        password: '21232f297a57a5a743894a0e4a801fc3'//admin
    },
    success: function(data) {
        console.log(data);
    }
});