JavaScript实现单点登录的示例


Posted in Javascript onSeptember 23, 2020

项目中遇到单点登录这个问题,当点击链接的时候跳转到另一个系统中并实现自动登录进去,直接进去系统的页面

因为不同的系统涉及到跨域的问题,所以使用nginx来解决跨域的问题

先跳转到另一个系统的一个页面,在这个页面里实现登录操作再跳转到系统中我们需要的页面

还有一个问题就是登录的时候需要用户名和密码,用户名和密码不是固定的,需要动态获取,所以跳转到过渡页面的时候需要携带参数

携带参数是通过url传递的,这里用户名和密码使用了简单的base64加密

JavaScript实现单点登录的示例

过渡页面接受参数

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单点登录的资料请关注三水点靠木其它相关文章!

Javascript 相关文章推荐
prototype 中文参数乱码解决方案
Nov 09 Javascript
jquery中的$(document).ready()与window.onload的区别
Nov 18 Javascript
jQuery lazyLoad图片延迟加载插件的优化改造方法分享
Aug 13 Javascript
jqGrid读取选择的多行的某个属性代码
May 18 Javascript
jQuery调取jSon数据并展示的方法
Jan 29 Javascript
javascript实现checkbox全选的代码
Apr 30 Javascript
图解prototype、proto和constructor的三角关系
Jul 31 Javascript
微信小程序 页面跳转如何实现传值
Apr 05 Javascript
JavaScript多线程运行库Nexus.js详解
Dec 22 Javascript
vue实现通讯录功能
Jul 14 Javascript
React组件对子组件children进行加强的方法
Jun 23 Javascript
简单了解JavaScript sort方法
Nov 25 Javascript
Vue+Java+Base64实现条码解析的示例
Sep 23 #Javascript
通过实例解析jQ Ajax操作相关原理
Sep 23 #Javascript
js实现三角形粒子运动
Sep 22 #Javascript
js操作两个json数组合并、去重,以及删除某一项元素
Sep 22 #Javascript
js实现删除json中指定的元素
Sep 22 #Javascript
vue使用canvas实现移动端手写签名
Sep 22 #Javascript
JSON 入门教程基础篇 json入门学习笔记
Sep 22 #Javascript
You might like
一些被忽视的PHP函数(简单整理)
2010/04/30 PHP
php中get_headers函数的作用及用法的详细介绍
2013/04/27 PHP
php获取网页里所有图片并存入数组的方法
2015/04/06 PHP
PHP实现腾讯与百度坐标转换
2017/08/05 PHP
Javascript中获取出错代码所在文件及行数的代码
2010/09/23 Javascript
基于jQuery的Tab选项框效果代码(插件)
2011/03/01 Javascript
深入理解JavaScript系列(10) JavaScript核心(晋级高手必读篇)
2012/01/15 Javascript
Jquery提交表单 Form.js官方插件介绍
2012/03/01 Javascript
jQuery使用before()和after()在元素前后添加内容的方法
2015/03/26 Javascript
完美实现bootstrap分页查询
2015/12/09 Javascript
JS Ajax请求如何防止重复提交
2016/06/13 Javascript
BootStrap智能表单实战系列(八)表单配置json详解
2016/06/13 Javascript
axios基本入门用法教程
2017/03/25 Javascript
js 简易版滚动条实例(适用于移动端H5开发)
2017/06/26 Javascript
微信小程序之绑定点击事件实例详解
2017/07/07 Javascript
微信小程序实现点击文字页面跳转功能【附源码下载】
2017/12/12 Javascript
React 组件中的 bind(this)示例代码
2018/09/16 Javascript
JavaScript中window和document用法详解
2020/07/28 Javascript
在Python的Django框架的视图中使用Session的方法
2015/07/23 Python
深入解析Python设计模式编程中建造者模式的使用
2016/03/02 Python
Python向Excel中插入图片的简单实现方法
2018/04/24 Python
Python搭建代理IP池实现检测IP的方法
2019/10/27 Python
nginx+uwsgi+django环境搭建的方法步骤
2019/11/25 Python
基于python获取本地时间并转换时间戳和日期格式
2020/10/27 Python
基于Django集成CAS实现流程详解
2020/11/28 Python
美国领先的户外服装与装备用品店:Moosejaw
2016/08/25 全球购物
PHP如何调用MYSQL存储过程
2014/05/30 面试题
别名指示符是什么
2012/10/08 面试题
营销总经理的岗位职责
2013/12/15 职场文书
好矿嫂事迹材料
2014/01/21 职场文书
迟到早退检讨书
2014/02/10 职场文书
教师三严三实心得体会
2014/10/11 职场文书
基层党员学习党的群众路线教育实践活动心得体会
2014/11/04 职场文书
Nginx同一个域名配置多个项目的实现方法
2021/03/31 Servers
只用40行Python代码就能写出pdf转word小工具
2021/05/31 Python
阿里云国际版 使用Nginx作为HTTPS转发代理服务器
2022/05/11 Servers