单点登录(sso)

76 篇文章 3 订阅

整理的比较简单,后期再补充

单点登录概念
指在多系统应用中,只需要登录一个系统,就可以访问其他相互信任的应用系统。不需要再次登录
sso需要一个独立的认证中心,只有认证中心能接受用户的用户名密码等安全信息,其他系统不提供登录入口,只接受认证中心的间接授权。
单个系统登录的时候,

<template>
  <div class="login-bg">
  </div>
</template>
<script lang="ts" setup>
import { reactive, ref } from "vue";
import axios from "axios";
import {
  queryLoginUserInfo,
  getTreeListDev,
  getTreeListDevDept,
  getAuthorize,
} from "@/api/serviceModule/common";
import { setToken } from "@/utils/auth";
import { useStore } from "vuex";
import { message } from "ant-design-vue";
import { useRouter } from "vue-router";
const store = useStore();
const router = useRouter();
const BASE64 = require("@/utils/base64");
const sm2 = require("sm-crypto").sm2;
const cpwRef = ref();
const GetQueryValue = (queryName: any) => {
  //获取其他应用参数
  // var query = decodeURI(window.location).split("?");
  var query = window.location.search.split("?");
  if (query.length > 1) {
    var vars = query[1].split("&");
    for (var i = 0; i < vars.length; i++) {
      var pair = vars[i].split("=");
      if (pair[0] == queryName) {
        return pair[1];
      }
    }
    return null;
  }
};
const hrefData = {
  authorization: "q162tSAo:cd273d09ffcf9f64f694ec6522e19d1d09ae1ded",
  appId: "q162tSAo",
  publicKey:
    "04c50c6d69aa0cd606302ef09f52e765f78357634069564bd668767e8dab0ff48a88e58d48b4b548a4fb41b2a72a1179f79ff3a9873e5c5e88f5658b5294687c99",
};
//2、如果没有登录的话,跳转到应用中心,redirect_uri为在应用中心登录后跳转回来的地址
const oauthAuthorize = () => {
  let params = `client_id=${hrefData.appId}&redirect_uri=${location.origin}${location.pathname}&response_type=code`;
  location.href = `http://devcloud.cddpi.com/lbcloud-oauth/oauth/authorize?${params}`;
};
//3、如果链接上携带了授权码,就用授权码请求token
const oauthTokenEnd = (code: any) => {
  let params = {
    grant_type: "authorization_code",
    scope: "all",
    code: code,
    redirect_uri: `${location.origin}${location.pathname}`,
  };
  axios({
    method: "post",
    url: `/lbcloud-oauth/oauth/token`,
    data: params,
    headers: {
      "Content-Type": "application/x-www-form-urlencoded",
      "Tenant-Id": "000000",
      Authorization: `Basic ${BASE64.encode(hrefData.authorization)}`,
    },
    transformRequest: [
      function (data) {
        let ret = "";
        for (let it in data) {
          ret +=
            encodeURIComponent(it) + "=" + encodeURIComponent(data[it]) + "&";
        }
        return ret;
      },
    ],
    withCredentials: true,
  }).then((res) => {
    if (res.data.access_token) {
      setToken(res.data);
      loginBtn();
    } else {
      oauthAuthorize();
    }
  });
};
//4、登录后的操作
const loginBtn = () => {

};
//1、先判断链接上有没有授权码
if (GetQueryValue("code")) {
  //已登录
  oauthTokenEnd(GetQueryValue("code"));
} else {
  //未登录
  oauthAuthorize();
}
</script>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值