JavaScript實現(xiàn)單點(diǎn)登錄的示例
項目中遇到單點(diǎn)登錄這個問題,當(dāng)點(diǎn)擊鏈接的時候跳轉(zhuǎn)到另一個系統(tǒng)中并實現(xiàn)自動登錄進(jìn)去,直接進(jìn)去系統(tǒng)的頁面
因為不同的系統(tǒng)涉及到跨域的問題,所以使用nginx來解決跨域的問題
先跳轉(zhuǎn)到另一個系統(tǒng)的一個頁面,在這個頁面里實現(xiàn)登錄操作再跳轉(zhuǎn)到系統(tǒng)中我們需要的頁面
還有一個問題就是登錄的時候需要用戶名和密碼,用戶名和密碼不是固定的,需要動態(tài)獲取,所以跳轉(zhuǎn)到過渡頁面的時候需要攜帶參數(shù)
攜帶參數(shù)是通過url傳遞的,這里用戶名和密碼使用了簡單的base64加密

過渡頁面接受參數(shù)
var params = window.location.search;
const params1 = params.match(/=(\S*)&/)[1];
const params2 = params1.split("=")[1];
const login = params1.split("&")[0];
const pass = params1.split("=")[1];
const url = params.split("url=")[1];
var postData = {
"login": login,
"password": pass
};
postData = (function(obj){ // 轉(zhuǎn)成post需要的字符串.
var str = "";
for(var prop in obj){
str += prop + "=" + obj[prop] + "&"
}
return str;
})(postData);
var xhr = new XMLHttpRequest();
xhr.open("POST", "/api/authentication/login", true);
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xhr.onreadystatechange = function(){
var XMLHttpReq = xhr;
if (XMLHttpReq.readyState == 4 && XMLHttpReq.status == 200) {
location.replace(url);
}
};
xhr.send(postData);
以上就是JavaScript實現(xiàn)單點(diǎn)登錄的示例的詳細(xì)內(nèi)容,更多關(guān)于JavaScript單點(diǎn)登錄的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
js substring從右邊獲取指定長度字符串(示例代碼)
本篇文章主要是對js substring從右邊獲取指定長度字符串的示例代碼進(jìn)行了介紹,需要的朋友可以過來參考下,希望對大家有所幫助2013-12-12
解決WebStorm?2022.3.x?無法識別?Element?UI?2.15.11?新版本中的?el-
這篇文章主要介紹了解決?WebStorm?2022.3.x?無法識別?Element?UI?2.15.11?新版本中的?el-xxx?標(biāo)簽問題,本文給大家分享兩種解決方案,需要的朋友可以參考下2023-01-01
javascript制作照片墻及制作過程中出現(xiàn)的問題
這篇文章主要介紹了javascript制作照片墻及制作過程中出現(xiàn)的問題,感興趣的朋友可以參考一下2016-04-04
apply和call方法定義及apply和call方法的區(qū)別
apply和call功能一樣,只是傳入的參數(shù)列表形式不同,本文給大家介紹apply和call方法定義及apply和call方法的區(qū)別,感興趣的朋友一起學(xué)習(xí)吧2015-11-11

