什么是单点登录：
单点登录是一种认证技术，它允许用户使用一个用户ID和密码访问不同的应用程序。在多个应用系统中，用户只需要登录一次就可以访问所有相互信任的应用系统。
缺点：它虽然提高了便利性，但在某些情况下可能会降低安全性。因为一旦你在一个系统上登录，就可以访问所有关联的系统，这意味着如果一个系统被黑客攻击，那么你的所有关联系统的安全都可能受到威胁。
1、输入A系统网站地址，在没有token 的情况下，跳转到 iam 认证登录网页
需要用到环境变量（vue2环境）vuex ，
router.beforeEach((to, from, next) => {=NProgress.start()if (getToken()) { /* has token*/if(process.env.VUE_APP_BASE=='' || process.env.VUE_APP_BASE=='/'){if(to.path === '/index'){next({ path: '/main' })NProgress.done()}}if (to.path === '/login') {next({ path: '/' })NProgress.done()}else {if (store.getters.roles.length === 0) { // 判断当前用户是否已拉取完user_info信息store.dispatch('GetInfo').then(res => {// 拉取user_infoconst roles = res.rolesstore.dispatch('GRoutes', { roles,"vue":"vue"}).then(accessRoutes => {// 根据roles权限生成可访问的路由表router.addRoutes(accessRoutes) // 动态添加可访问路由表next({ ...to, replace: true }) // hack方法 确保addRoutes已完成})}).catch(err => {store.dispatch('FedLogOut').then(() => {Message.error(err)next({ path: '/' })})})} else {next()}}} else {// 没有tokenconsole.log(whiteList.indexOf(to.path) !== -1 , '我是白名单')if (whiteList.indexOf(to.path) !== -1) {// 在免登录白名单，直接进入next()} else {// 开发的时候不用进行对eip 登录的校验（注意-对开发环境进行单独处理）if(process.env.VUE_APP_ENV === 'dev'){next(`/login?redirect=${to.fullPath}`)}else{// iam 登录接口（就是iam 的网站登录地址例子： https:www.baidu.com）location.href = process.env.VUE_APP_IAM_URL}NProgress.done()}}
})
2、退出的时候
// iam 退出接口（环境变量）
const url = (process.env.VUE_APP_ENV === 'dev')?`${process.env.VUE_APP_URL}login`:process.env.VUE_APP_IAM_LOGOUT
location.href = url
3、登录失败（同上 url ）配合vuex 使用
store.dispatch('LogOut').then(() => {location.href = url1
})
4、实现方式：
单点登录：它通常依赖于一个或多个身份验证服务器来实现。当你在一个系统上登录时，这个系统会将你的身份信息发送到身份验证服务器进行验证。一旦验证通过，身份验证服务器会返回一个令牌（token），你可以使用这个令牌来访问所有关联的系统。
写一个空白页面进行操作，iam 验证成功之， 我们需要重新接入我们自己的登录校验，成功 进行我们的页面，失败退回 iam 的退出页面
<template><div class="iam-css"><!-- 1、登录页重定向到iam登录页 --><!-- 2、会在iam页面进行校验后跳转到此处空白页进行接口登录 --><!-- 3、通过query拿到iam 返回的code进行接口处理 --><!-- 4、根据之前登录逻辑，重新写一个store 的异步 NewLogin --></div>
</template><script>import { Login } from "@/api";export default {data() {return {loading:false,redirect: undefined,}},created() {console.log('进入空白页面了')this.setNewLogin()},methods:{setNewLogin() {console.log('进入系统')this.loading = trueconst {code} = this.$route.query || ''Login({code:code}).then(res=>{this.loading = false;const store = this.$store;const router = this.$router;var _this = this;if(res.success){store.dispatch("Login", res) // vuex 需要进行 return Promise {} .then((res) => {console.log('接收 --开始登录了吗', res)if (process.env.VUE_APP_BASE == "" || process.env.VUE_APP_BASE == "/") {this.$router.push({ path: this.redirect || "/main" });} else {this.$router.push({ path: this.redirect || "/" });}}).catch((err) => {this.loading = false;});}else{this.$message.error(res.message)}}).catch(error=>{console.log(error, '失败退出到iam 登录页面')setTimeout(()=>{location.href = process.env.VUE_APP_IAM_LOGOUT},500)})}},
}
</script><style>
</style>
注意事项：
1-白名单页面的使用，在页面内剔除要校验token 的页面（iam 要使用空白页（中转站）返回认证后code,我们再根据code进行A系统的登录）
2-注意死循环的进入（登录和退出是两个地址， 失败是退出接口，成功是-iam 登录接口）
3-其他概念区别：安全认证
