prodog-client-2025
/
pc-client-v5


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222
							<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"
    />
    <script
      type="text/javascript"
      src="http://192.168.1.129:10022/static/jquery/dist/jquery.min.js"
    ></script>
    <script
      type="text/javascript"
      src="http://192.168.1.129:10022/static/vue/dist/vue.global.prod.js"
    ></script>
    <style scoped>
      .jumbotron {
        margin-top: 30px;
      }
    </style>
  </head>

  <body>
    <div id="app1" class="container">
      <div class="jumbotron">
        <h1>登录中</h1>
        <p>{{message}}</p>
        <p>
          <button @click="logout()">注销</button>
        </p>
      </div>
    </div>
    <script>
      Vue.createApp({
        data: function () {
          return {
            urlRoot: "",
            ticket: undefined,
            message: "正在检查您的权限，请稍等...",
            casUrl: undefined, // cas验证url
            authSettingNo: undefined, // 标识
            serviceUrl: undefined, // 传入后台验证地址
            casLogoutUrl: undefined, // cas退出登录url
            casTicketUrl: undefined, // cas Ticket检验Url
            redirectUrl: undefined, // 登录成功后自动跳转的地址
          };
        },
        mounted: function () {
          this.urlRoot = this.getRootPath() + "/";
          this.authSettingNo = this.getQueryString("authSettingNo");
          this.existsCAS();
        },
        methods: {
          getQueryString: function (name) {
            const url = window.location.href;
            const params = new URLSearchParams(url.split("?")[1]);
            return params.get(name);
          },

          // 根据认证跳转系统对应页面
          getTicket: function () {
            const _self = this;
            const redirect_uri = window.location.href; // http:192.168.1.129:10022/casLogin.html?authSettingNo=001
            _self.ticket = _self.getQueryString("ticket");
            if (_self.ticket) {
              // 1.判断是否包含重定向地址
              // 2.判断后台验证登录是否成功
              const newUrl = localStorage.getItem("#redirect_uri");
              if (newUrl.indexOf("redirectUrl") != -1) {
                // 存在redirectUrl地址，调用登录接口，跳转redirectUrl地址
                _self.azureCasLogin(newUrl);
              } else {
                // 没有redirectUrl地址，跳转到x端（PC、Propass、App）选择界面，调用登录，authSettingNo、ticket、newUrl必须传递过去
                const loginUrl = `${_self.urlRoot}#/casLogin?authSettingNo=${_self.authSettingNo}&ticket=${_self.ticket}&serviceUrl=${newUrl}`;
                window.location.href = loginUrl;
              }
            } else {
              localStorage.setItem("#redirect_uri", redirect_uri);
              const casBoard = `${_self.casUrl}?service=${redirect_uri}`;
              window.location.href = casBoard;
            }
          },

          // 注销
          logout: function () {
            let _self = this;

            window.location.href = _self.urlRoot;
          },

          // 单点登录
          azureCasLogin: function (newUrl) {
            let _self = this;
            const params = {
              ticket: _self.ticket,
              redirect_uri: newUrl,
              authSettingNo: _self.authSettingNo,
              languageId: "zh-CN",
            };
            $.ajax({
              url: _self.urlRoot + "api/CasLogin/login",
              type: "post",
              async: true,
              data: params,
              success: function (loginInfoData) {
                if (loginInfoData.errorCode == 0) {
                  _self.setLoginInfo(loginInfoData.data, newUrl);
                } else {
                  _self.message =
                    "不好意思你的账号不在系统中，请点击【注销】按钮，登录其他账号";
                  console.error(loginInfoData.errorMessage);
                }
              },
              error: function (XMLHttpRequest, textStatus, errorThrown) {
                console.log("服务器出错啦。");
              },
            });
          },

          //   获取cas参数值
          existsCAS: function () {
            const _self = this;
            $.ajax({
              url:
                _self.urlRoot +
                "api/CasLogin/casServiceProviderCheck?authSettingNo=" +
                _self.authSettingNo,
              type: "get",
              contentType: "application/json",
              dataType: "json",
              success: function (response) {
                if (response.errorCode === 0) {
                  _self.casUrl = response.data.casUrl;
                  _self.authSettingNo = response.data.no;
                  _self.casLogoutUrl = response.data.casLogoutUrl;
                  _self.getTicket();
                } else {
                  _self.message = response.errorMessage;
                  console.log("错误", response.errorMessage);
                }
              },
              error: function (XMLHttpRequest, textStatus, errorThrown) {
                _self.message = "服务器出错啦。";
                console.log(XMLHttpRequest, textStatus, errorThrown);
              },
            });
          },
          /**
           * 获取主机地址
           */
          getRootPath: function () {
            var protocol = window.location.protocol;
            var host = window.location.host;
            var localhostPath = protocol + "//" + host;
            return localhostPath;
          },

          setLoginInfo: function (loginInfo, newUrl) {
            var _self = this;

            _self.clearLocalStorage();

            _self.setLocalStorage(loginInfo);

            const str = "redirectUrl=";
            const endStart = newUrl.indexOf("redirectUrl");
            const startIndex = endStart + str.length;
            const endIndex = newUrl.length - 1;
            const redirectUrl = newUrl.substring(startIndex, endIndex);

            window.location.href = redirectUrl;
          },

          //  设置localStorage
          setLocalStorage: function (loginInfo) {
            localStorage.setItem("#LoginInfo", JSON.stringify(loginInfo));
            localStorage.setItem("#token", loginInfo.token);
            localStorage.setItem("#accountId", loginInfo.accountId);
          },

          clearLocalStorage: function () {
            // 清理localStorage时需要保留的参数列表
            var reserveParams = [
              "hostPageBaseURL",
              "workShopId",
              "resourceInstanceId",
              "resourceInstanceName",
              "apsBaseUrl",
              "cameraBaseURL",
              "#rememberPassword",
              "#userName",
              "#password",
              "#languageSelected",
            ];
            //存放的信息
            var reserveParamValues = [];

            //获取参数信息
            var len = reserveParams.length;
            for (let i = 0; i < len; i++) {
              var reserveParam = reserveParams[i];
              var reserveParamValue = "";
              if (localStorage.getItem(reserveParam) != undefined) {
                reserveParamValue = localStorage.getItem(reserveParam);
              }
              reserveParamValues.push(reserveParamValue);
            }

            //清理localStorage
            window.localStorage.clear();

            //还原参数信息
            for (let i = 0; i < len; i++) {
              localStorage.setItem(reserveParams[i], reserveParamValues[i]);
            }
          },
        },
      }).mount("#app1");
    </script>
  </body>
</html>