|
|
@@ -0,0 +1,222 @@
|
|
|
+<!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>
|
liuyanpeng