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 相关文章推荐
图片自动更新(说明)
Oct 02 Javascript
ASP.NET jQuery 实例3 (在TextBox里面阻止复制、剪切和粘贴事件)
Jan 13 Javascript
JavaScript初学者应注意的七个细节详细介绍
Dec 27 Javascript
javascript实现获取cookie过期时间的变通方法
Aug 14 Javascript
JavaScript中使用arguments获得函数传参个数实例
Aug 27 Javascript
javascript类型系统 Window对象学习笔记
Jan 07 Javascript
去除字符串左右两边的空格(实现代码)
May 12 Javascript
AngularJS 依赖注入详解及示例代码
Aug 17 Javascript
ECMAScript6--解构
Mar 30 Javascript
React Native之TextInput组件解析示例
Aug 22 Javascript
JavaScript中this关键字用法实例分析
Aug 24 Javascript
原生JS实现拖拽功能
Dec 16 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与MySQL开发中页面乱码的产生与解决
2008/03/27 PHP
PHP7常量数组用法分析
2016/09/26 PHP
php简单中奖算法(实例)
2017/08/15 PHP
javascript动画之圆形运动,环绕鼠标运动作小球
2010/07/20 Javascript
改进UCHOME的记录发布,增强可访问性用户体验
2011/01/17 Javascript
js获取图片大小的函数代码
2011/09/20 Javascript
基于jquery tab切换(防止页面刷新)
2012/05/23 Javascript
js检查页面上有无重复id的实现代码
2013/07/17 Javascript
jquery修改属性值实例代码(设置属性值)
2014/01/06 Javascript
es6+angular1.X+webpack 实现按路由功能打包项目的示例
2017/08/16 Javascript
vue.js系列中的vue-fontawesome使用
2018/02/10 Javascript
AngularJS模态框模板ngDialog的使用详解
2018/05/11 Javascript
详解用async/await来处理异步
2019/08/28 Javascript
原生js实现随机点名功能
2019/11/05 Javascript
原生JS实现无缝轮播图片
2020/06/24 Javascript
[02:43]中国五虎出征TI3视频
2013/08/02 DOTA
python Tcp协议发送和接收信息的例子
2019/07/22 Python
django的csrf实现过程详解
2019/07/26 Python
pandas中DataFrame修改index、columns名的方法示例
2019/08/02 Python
解决Django后台ManyToManyField显示成Object的问题
2019/08/09 Python
python连接mongodb集群方法详解
2020/02/13 Python
Python 下载Bing壁纸的示例
2020/09/29 Python
如何通过python实现IOU计算代码实例
2020/11/02 Python
解决Python import .pyd 可能遇到路径的问题
2021/03/04 Python
html5 worker 实例(二) 图片变换效果
2013/06/24 HTML / CSS
魔声耳机官方网站:Monster是世界第一品牌的高性能耳机
2016/10/26 全球购物
你经历的项目中的SCM配置项主要有哪些?什么是配置项?
2013/11/04 面试题
银行实习鉴定
2013/12/13 职场文书
洗煤厂厂长岗位职责
2014/01/03 职场文书
护士实习求职信
2014/06/22 职场文书
趣味运动会广播稿
2014/09/13 职场文书
党支部季度考核意见
2015/06/02 职场文书
班委竞选稿范文
2015/11/21 职场文书
2016年11月份红领巾广播稿
2015/12/21 职场文书
JS实现扫雷项目总结
2021/05/19 Javascript
Python实现DBSCAN聚类算法并样例测试
2021/06/22 Python