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 01 Javascript
使用jquery mobile做幻灯播放效果实现步骤
Jan 04 Javascript
js中arguments,caller,callee,apply的用法小结
Jan 28 Javascript
javascript框架设计读书笔记之种子模块
Dec 02 Javascript
JavaScript中实现Map的示例代码
Sep 09 Javascript
深入JavaScript高级程序设计之对象、数组(栈方法,队列方法,重排序方法,迭代方法)
Dec 01 Javascript
jQuery操作iframe中js函数的方法小结
Jul 06 Javascript
AngularJs自定义服务之实现签名和加密
Aug 02 Javascript
微信小程序 教程之条件渲染
Oct 18 Javascript
JS实现页面中所有img对象添加onclick事件及新窗口查看图片的方法
Dec 27 Javascript
Vue.js如何优雅的进行form validation
Apr 07 Javascript
浅谈Vue Element中Select下拉框选取值的问题
Mar 01 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 学习提高路线分享
2011/10/23 PHP
PHP写的简单数字验证码实例
2017/05/23 PHP
JavaScript的public、private和privileged模式
2009/12/28 Javascript
javascript自执行函数之伪命名空间封装法
2010/12/25 Javascript
使用GruntJS链接与压缩多个JavaScript文件过程详解
2013/08/02 Javascript
浅谈js原生拖放
2016/11/21 Javascript
jQuery 如何实现一个滑动按钮开关
2016/12/01 Javascript
网页中右键功能的实现方法之contextMenu的使用
2017/02/20 Javascript
JavaScript的for循环中嵌套一个点击事件的问题解决
2017/03/03 Javascript
NodeJs中express框架的send()方法简介
2017/06/20 NodeJs
javascript实现贪吃蛇小练习
2020/07/05 Javascript
vue路由分文件拆分管理详解
2020/08/13 Javascript
[01:00:54]TI4正赛第二日开场
2014/07/20 DOTA
在Django的URLconf中使用命名组的方法
2015/07/18 Python
python中 logging的使用详解
2017/10/25 Python
python使用openpyxl库修改excel表格数据方法
2018/05/03 Python
浅谈Pandas 排序之后索引的问题
2018/06/07 Python
python+unittest+requests实现接口自动化的方法
2018/11/29 Python
对python:threading.Thread类的使用方法详解
2019/01/31 Python
Django之PopUp的具体实现方法
2019/08/31 Python
解决pandas展示数据输出时列名不能对齐的问题
2019/11/18 Python
Python算法中的时间复杂度问题
2019/11/19 Python
python opencv如何实现图片绘制
2020/01/19 Python
delegate与普通函数的区别
2014/01/22 面试题
JAVA程序员面试题
2012/10/03 面试题
架构师岗位职责
2013/11/18 职场文书
毕业自荐书
2013/12/09 职场文书
幼儿教育感言
2014/02/05 职场文书
学生喝酒检讨书
2014/02/06 职场文书
给校长的建议书400字
2014/05/15 职场文书
高中教师个人总结
2015/02/10 职场文书
新郎婚礼致辞
2015/07/27 职场文书
2015年小学师德师风建设工作总结
2015/10/23 职场文书
教您:房贷工资收入证明应该怎么写?
2019/08/19 职场文书
Redis数据结构之链表与字典的使用
2021/05/11 Redis
python树莓派通过队列实现进程交互的程序分析
2021/07/04 Python