專案中遇到單點登入這個問題，當點選連結的時候跳轉到另一個系統中並實現自動登入進去，直接進去系統的頁面

因為不同的系統涉及到跨域的問題，所以使用nginx來解決跨域的問題

先跳轉到另一個系統的一個頁面，在這個頁面裡實現登入操作再跳轉到系統中我們需要的頁面

還有一個問題就是登入的時候需要使用者名稱和密碼，使用者名稱和密碼不是固定的，需要動態獲取，所以跳轉到過渡頁面的時候需要攜帶引數

攜帶引數是通過url傳遞的，這裡使用者名稱和密碼使用了簡單的base64加密

過渡頁面接受引數

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){ // 轉成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實現單點登入的示例的詳細內容，更多關於JavaScript單點登入的資料請關注我們其它相關文章！