博客

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

单点登录概念

指在多系统应用中,只需要登录一个系统，就可以访问其他相互信任的应用系统。不需要再次登录

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>