fix: 优化 slave 跳转方法

This commit is contained in:
NICE CODE BY DEV 2024-03-27 11:38:12 +08:00
parent 8eb6ad5fd7
commit c4088792e8
38 changed files with 296 additions and 157 deletions

View File

@ -1,5 +1,14 @@
# @zhst/biz
## 0.11.2
### Patch Changes
- Updated dependencies
- @zhst/func@0.9.0
- @zhst/hooks@0.8.9
- @zhst/meta@0.9.6
## 0.11.1
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@zhst/biz",
"version": "0.11.1",
"version": "0.11.2",
"description": "业务库",
"keywords": [
"business",

View File

@ -6,6 +6,5 @@ toc: content
---
<embed src="../../README.md" ></embed>
<embed src="../../CHANGELOG.md" ></embed>

View File

@ -1,5 +1,15 @@
# @zhst/utils
## 0.9.0
### Minor Changes
- 优化 slave 跳转方法
### Patch Changes
- @zhst/request@0.8.9
## 0.8.3
### Patch Changes

View File

@ -10,26 +10,34 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import React, { useState } from 'react';
import { getValueByUrl } from '@zhst/func';
import { Input, Button, Space } from 'antd';
var demo = function demo() {
var _useState = useState(null),
_useState2 = _slicedToArray(_useState, 2),
inputVal = _useState2[0],
setInputVal = _useState2[1];
url = _useState2[0],
setUrl = _useState2[1];
var _useState3 = useState(null),
_useState4 = _slicedToArray(_useState3, 2),
outputVal = _useState4[0],
setOutPutVal = _useState4[1];
keyword = _useState4[0],
setKeyword = _useState4[1];
var _useState5 = useState(null),
_useState6 = _slicedToArray(_useState5, 2),
outputVal = _useState6[0],
setOutPutVal = _useState6[1];
var handleClick = function handleClick() {
var val = getValueByUrl('to', inputVal);
var val = getValueByUrl(keyword, url);
setOutPutVal(val);
};
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("input", {
value: inputVal,
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Space, null, "\u94FE\u63A5\uFF1A", /*#__PURE__*/React.createElement(Input, {
onChange: function onChange(e) {
return setInputVal(e.target.value);
return setUrl(e.target.value);
}
}), /*#__PURE__*/React.createElement("button", {
}), "\u83B7\u53D6\u5B57\u6BB5\uFF1A", /*#__PURE__*/React.createElement(Input, {
onChange: function onChange(e) {
return setKeyword(e.target.value);
}
}), /*#__PURE__*/React.createElement(Button, {
onClick: handleClick
}, "\u63D0\u4EA4"), /*#__PURE__*/React.createElement("p", null, "\u8F93\u51FA\uFF1A", outputVal)));
}, "\u63D0\u4EA4")), /*#__PURE__*/React.createElement("p", null, "\u8F93\u51FA\uFF1A", outputVal));
};
export default demo;

View File

@ -34,13 +34,15 @@ __export(getValueByUrl_exports, {
module.exports = __toCommonJS(getValueByUrl_exports);
var import_react = __toESM(require("react"));
var import_func = require("@zhst/func");
var import_antd = require("antd");
var demo = () => {
const [inputVal, setInputVal] = (0, import_react.useState)(null);
const [url, setUrl] = (0, import_react.useState)(null);
const [keyword, setKeyword] = (0, import_react.useState)(null);
const [outputVal, setOutPutVal] = (0, import_react.useState)(null);
const handleClick = () => {
let val = (0, import_func.getValueByUrl)("to", inputVal);
let val = (0, import_func.getValueByUrl)(keyword, url);
setOutPutVal(val);
};
return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement("input", { value: inputVal, onChange: (e) => setInputVal(e.target.value) }), /* @__PURE__ */ import_react.default.createElement("button", { onClick: handleClick }, "提交"), /* @__PURE__ */ import_react.default.createElement("p", null, "输出:", outputVal)));
return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(import_antd.Space, null, "链接:", /* @__PURE__ */ import_react.default.createElement(import_antd.Input, { onChange: (e) => setUrl(e.target.value) }), "获取字段:", /* @__PURE__ */ import_react.default.createElement(import_antd.Input, { onChange: (e) => setKeyword(e.target.value) }), /* @__PURE__ */ import_react.default.createElement(import_antd.Button, { onClick: handleClick }, "提交")), /* @__PURE__ */ import_react.default.createElement("p", null, "输出:", outputVal));
};
var getValueByUrl_default = demo;

View File

@ -1,6 +1,6 @@
{
"name": "@zhst/func",
"version": "0.8.3",
"version": "0.9.0",
"description": "函数合集",
"keywords": [
"hooks"

View File

@ -1,7 +1,4 @@
---
nav:
title: func
order: 2
title: 相机相关
---

View File

@ -1,6 +1,4 @@
---
nav:
title: 元组件
title: 版本更新日志
toc: content
order: 99

View File

@ -1,6 +1,7 @@
---
nav:
title: func
title: 函数库
order: 4
title: 其它
order: 4
---

View File

@ -1,7 +1,4 @@
---
nav:
title: func
order: 2
title: 文件处理
---

View File

@ -1,6 +1,6 @@
---
nav:
title: utils
title: 函数库
order: 1
title: 快速上手
---

View File

@ -1,7 +1,4 @@
---
nav:
title: func
order: 3
title: 地图相关
---

View File

@ -1,7 +1,4 @@
---
nav:
title: func
order: 3
title: 字符串相关
toc: content
---
@ -23,4 +20,4 @@ const value3 = getValueByUrl('a', 'a=123&token=asdfasdfsdf')
// --> 123
```
<code src="./demo/getValueByUrl.tsx" debug>调试台</code>
<code src="./demo/getValueByUrl.tsx">调试台</code>

View File

@ -1,6 +1,4 @@
---
nav:
title: func
title: 时间相关
order: 4
---

View File

@ -1,5 +1,12 @@
# @zhst/hooks
## 0.8.9
### Patch Changes
- Updated dependencies
- @zhst/func@0.9.0
## 0.8.8
### Patch Changes

View File

@ -1,6 +1,8 @@
# @zhst/hooks
## 介绍
业务中常用函数方法
常用函数方法
## 安装

View File

@ -1,6 +1,6 @@
{
"name": "@zhst/hooks",
"version": "0.8.8",
"version": "0.8.9",
"description": "hooks合集",
"keywords": [
"hooks"

View File

@ -1,9 +1,5 @@
# @zhst/icon
:::info{title=开发中}
稍等...
:::
## 介绍
静态变量库

View File

@ -1,5 +1,11 @@
# @zhst/map
## 0.2.1
### Patch Changes
- 添加 react
## 0.2.0
### Minor Changes

View File

@ -1,9 +1,5 @@
# @zhst/map
:::info{title=开发中}
稍等...
:::
## 介绍
地图库基于map-box开发

View File

@ -1,6 +1,6 @@
{
"name": "@zhst/map",
"version": "0.2.0",
"version": "0.2.1",
"description": "地图库",
"keywords": [
"map",

View File

@ -1,6 +1,6 @@
---
nav:
title: Map
title: 地图库
order: 1
toc: content
title: 快速上手

View File

@ -1,5 +1,15 @@
# @zhst/material
## 0.7.4
### Patch Changes
- Updated dependencies
- @zhst/func@0.9.0
- @zhst/biz@0.11.2
- @zhst/hooks@0.8.9
- @zhst/meta@0.9.6
## 0.7.3
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@zhst/material",
"version": "0.7.3",
"version": "0.7.4",
"description": "物料库",
"keywords": [
"business",

View File

@ -1,5 +1,14 @@
# @zhst/utils
## 0.9.6
### Patch Changes
- Updated dependencies
- @zhst/func@0.9.0
- @zhst/hooks@0.8.9
- @zhst/meta@0.9.6
## 0.9.5
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@zhst/meta",
"version": "0.9.5",
"version": "0.9.6",
"description": "原子组件",
"keywords": [
"meta",

View File

@ -1,5 +1,12 @@
# @zhst/request
## 0.8.9
### Patch Changes
- Updated dependencies
- @zhst/func@0.9.0
## 0.8.8
### Patch Changes

View File

@ -1,6 +1,6 @@
{
"name": "@zhst/request",
"version": "0.8.8",
"version": "0.8.9",
"description": "请求库",
"keywords": [
"request",

View File

@ -1,6 +1,7 @@
---
nav:
title: 其它
order: 999
title: 请求库
toc: content
---

View File

@ -1,5 +1,16 @@
# @zhst/slave
## 0.4.0
### Minor Changes
- 优化 slave 跳转方法
### Patch Changes
- Updated dependencies
- @zhst/func@0.9.0
## 0.3.0
### Minor Changes

View File

@ -7,44 +7,3 @@
## 安装
> pnpm install @zhst/slave
## 使用
```jsx
import React from 'react';
import slave from '@zhst/slave'
export default () => {
const handleInit = () => {
slave.init({
jumpUrl: `http://10.0.0.222:30058/metarial/login`,
to: 'http://www.baidu.com',
jumpToLogin: false,
tokenKey: 'token',
})
}
return (
<button onClick={handleInit} >测试</button>
)
}
```
## API
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --- | --- | --- | --- | --- |
| jumpToLogin | 是否打开登录校验跳转 | boolean | true | - |
| jumpUrl | 登录跳转页面 | string | - | - |
| tokenKey | 从链接获取的登录校验字段 | string | token | - |
| showMsg | 是否显示“请先登录”提示框 | boolean | true | - |
| msgText | 提示框自定义文案 | string | 请先登录 | - |
| from | 来自哪个链接(可选) | string | - | - |
| to | 准备去的链接(可选) | string | - | - |
## slave 实例方法
| 方法 | 说明 | 类型 | 默认值 | 版本 |
| --- | --- | --- | --- | --- |
| init | 初始化实例 | function | (data: SlaveProps) => void | - |
| logOut | 退出登录 | function | () => void | - |

View File

@ -9,59 +9,66 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
import { message } from "antd";
import { getValueByUrl } from '@zhst/func';
import { isUrl } from '@zhst/func';
var Slave = /*#__PURE__*/function () {
// eslint-disable-next-line @typescript-eslint/no-useless-constructor
// 设置参数
function Slave() {
_classCallCheck(this, Slave);
_defineProperty(this, "token", void 0);
_defineProperty(this, "config", void 0);
_defineProperty(this, "jumpUrl", void 0);
this.token = null;
this.jumpUrl = undefined;
_defineProperty(this, "authTokenDefine", void 0);
this.authTokenDefine = 'ZHST_AUTH_TOKEN';
}
_createClass(Slave, [{
key: "init",
value: function () {
var _init = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
var opt,
_opt$jumpToLogin,
jumpToLogin,
jumpUrl,
tokenKey,
_opt$showMsg,
showMsg,
msgText,
_token,
jumpUrlObj,
_args = arguments;
var _init = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(opt) {
var _opt$jumpToLogin, jumpToLogin, jumpUrl, tokenKey, _opt$showMsg, showMsg, msgText, from, to, currentUrl, currentJumpUrl, _token, _fromUrl, _toUrl;
return _regeneratorRuntime().wrap(function _callee$(_context) {
while (1) switch (_context.prev = _context.next) {
case 0:
opt = _args.length > 0 && _args[0] !== undefined ? _args[0] : {};
_opt$jumpToLogin = opt.jumpToLogin, jumpToLogin = _opt$jumpToLogin === void 0 ? true : _opt$jumpToLogin, jumpUrl = opt.jumpUrl, tokenKey = opt.tokenKey, _opt$showMsg = opt.showMsg, showMsg = _opt$showMsg === void 0 ? true : _opt$showMsg, msgText = opt.msgText; // eslint-disable-next-line @typescript-eslint/no-unused-expressions
_token = getValueByUrl(tokenKey || 'token', location.href) || localStorage.getItem('ZHST_AUTH_TOKEN');
this.token = _token;
localStorage.setItem('ZHST_AUTH_TOKEN', _token);
_opt$jumpToLogin = opt.jumpToLogin, jumpToLogin = _opt$jumpToLogin === void 0 ? true : _opt$jumpToLogin, jumpUrl = opt.jumpUrl, tokenKey = opt.tokenKey, _opt$showMsg = opt.showMsg, showMsg = _opt$showMsg === void 0 ? true : _opt$showMsg, msgText = opt.msgText, from = opt.from, to = opt.to;
this.checkUrl(jumpUrl, 'jumpUrl');
// 当前链接
currentUrl = new URL(location.href); // 当前待跳转链接
currentJumpUrl = new URL(jumpUrl);
_token = currentUrl.searchParams.get(tokenKey || 'token') || this.getToken();
this.setToken(_token);
_fromUrl = from || location.origin + location.pathname;
this.checkUrl(_fromUrl, 'from');
// 判段from字段是否为链接
if (!currentJumpUrl.searchParams.get('from')) {
currentJumpUrl.searchParams.set('from', _fromUrl);
}
_toUrl = to || location.origin + location.pathname;
this.checkUrl(_toUrl, 'to');
if (!currentJumpUrl.searchParams.get('to')) {
currentJumpUrl.searchParams.set('to', _toUrl);
}
// 判断当前登录环境
this.checkEnv({
showMsg: showMsg,
msgText: msgText
});
// 是否执行跳转页面
if (jumpToLogin && jumpUrl && !_token) {
jumpUrlObj = new URL(jumpUrl); // 判断是否为同一个域,采用不同的跳转方式
if (jumpUrlObj.origin === location.origin) {
history.pushState('', '', jumpUrl);
// 判断是否为同一个域,采用不同的跳转方式
// 同一个域名下
if (currentJumpUrl.origin === location.origin) {
history.pushState('', '', currentJumpUrl.href);
} else {
location.href = jumpUrl;
location.href = currentJumpUrl.href;
}
}
case 7:
case 14:
case "end":
return _context.stop();
}
}, _callee, this);
}));
function init() {
function init(_x) {
return _init.apply(this, arguments);
}
return init;
@ -69,17 +76,46 @@ var Slave = /*#__PURE__*/function () {
}, {
key: "checkEnv",
value: function checkEnv(_opt) {
if (!this.token && _opt.showMsg) {
var _token = this.getToken() || String(this.getToken());
if (!_token && _token !== 'null' && _opt.showMsg) {
message.error(_opt.msgText || '请先登录!');
return;
return false;
}
return true;
}
// 检查是否为url并且跑出错误
}, {
key: "checkUrl",
value: function checkUrl(url, label) {
if (!isUrl(url)) {
throw Error("\u8BF7\u8F93\u5165\u6B63\u786E\u7684 ".concat(label, " \u94FE\u63A5\u5730\u5740\uFF0C\u4EE5http(s)://\u5F00\u5934\uFF01'"));
}
}
// 退出登录
}, {
key: "logOut",
value: function logOut() {
localStorage.removeItem('ZHST_AUTH_TOKEN');
this.removeToken();
location.replace(location.origin + location.pathname);
}
}, {
key: "setToken",
value: function setToken(val) {
val && localStorage.setItem(this.authTokenDefine, val);
}
}, {
key: "removeToken",
value: function removeToken(cb) {
localStorage.removeItem(this.authTokenDefine);
cb === null || cb === void 0 || cb();
}
}, {
key: "getToken",
value: function getToken() {
return localStorage.getItem(this.authTokenDefine);
}
}]);
return Slave;
}();

View File

@ -25,42 +25,73 @@ module.exports = __toCommonJS(src_exports);
var import_antd = require("antd");
var import_func = require("@zhst/func");
var Slave = class {
// eslint-disable-next-line @typescript-eslint/no-useless-constructor
// 设置参数
constructor() {
this.token = null;
this.jumpUrl = void 0;
this.authTokenDefine = "ZHST_AUTH_TOKEN";
}
async init(opt = {}) {
async init(opt) {
const {
jumpToLogin = true,
jumpUrl,
tokenKey,
showMsg = true,
msgText
msgText,
from,
to
} = opt;
let _token = (0, import_func.getValueByUrl)(tokenKey || "token", location.href) || localStorage.getItem("ZHST_AUTH_TOKEN");
this.token = _token;
localStorage.setItem("ZHST_AUTH_TOKEN", _token);
this.checkUrl(jumpUrl, "jumpUrl");
let currentUrl = new URL(location.href);
let currentJumpUrl = new URL(jumpUrl);
let _token = currentUrl.searchParams.get(tokenKey || "token") || this.getToken();
this.setToken(_token);
let _fromUrl = from || location.origin + location.pathname;
this.checkUrl(_fromUrl, "from");
if (!currentJumpUrl.searchParams.get("from")) {
currentJumpUrl.searchParams.set("from", _fromUrl);
}
let _toUrl = to || location.origin + location.pathname;
this.checkUrl(_toUrl, "to");
if (!currentJumpUrl.searchParams.get("to")) {
currentJumpUrl.searchParams.set("to", _toUrl);
}
this.checkEnv({ showMsg, msgText });
if (jumpToLogin && jumpUrl && !_token) {
let jumpUrlObj = new URL(jumpUrl);
if (jumpUrlObj.origin === location.origin) {
history.pushState("", "", jumpUrl);
if (currentJumpUrl.origin === location.origin) {
history.pushState("", "", currentJumpUrl.href);
} else {
location.href = jumpUrl;
location.href = currentJumpUrl.href;
}
}
}
// 判端是否登录
checkEnv(_opt) {
if (!this.token && _opt.showMsg) {
const _token = this.getToken() || String(this.getToken());
if (!_token && _token !== "null" && _opt.showMsg) {
import_antd.message.error(_opt.msgText || "请先登录!");
return;
return false;
}
return true;
}
// 检查是否为url并且跑出错误
checkUrl(url, label) {
if (!(0, import_func.isUrl)(url)) {
throw Error(`请输入正确的 ${label} 链接地址以http(s)://开头!'`);
}
}
// 退出登录
logOut() {
localStorage.removeItem("ZHST_AUTH_TOKEN");
this.removeToken();
location.replace(location.origin + location.pathname);
}
setToken(val) {
val && localStorage.setItem(this.authTokenDefine, val);
}
removeToken(cb) {
localStorage.removeItem(this.authTokenDefine);
cb == null ? void 0 : cb();
}
getToken() {
return localStorage.getItem(this.authTokenDefine);
}
};
var src_default = new Slave();

View File

@ -1,6 +1,6 @@
{
"name": "@zhst/slave",
"version": "0.3.0",
"version": "0.4.0",
"description": "微前端子应用方法库",
"keywords": [
"slave",

View File

@ -0,0 +1,14 @@
import React from 'react';
import slave from '@zhst/slave'
export default () => {
const handleInit = () => {
slave.init({
jumpUrl: `http://10.0.0.204:30058/material/login`,
})
}
return (
<button onClick={handleInit} ></button>
)
}

View File

@ -1,9 +1,32 @@
---
nav:
title: slave
title: 微前端库
order: 99
toc: content
title: 快速上手
---
<embed src="../README.md" ></embed>
## 演示
<code src="./demo/init.tsx" ></code>
## API
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --- | --- | --- | --- | --- |
| jumpToLogin | 是否打开登录校验跳转 | boolean | true | - |
| jumpUrl | 登录跳转页面 | string | - | - |
| tokenKey | 从链接获取的登录校验字段 | string | token | - |
| showMsg | 是否显示“请先登录”提示框 | boolean | true | - |
| msgText | 提示框自定义文案 | string | 请先登录 | - |
| from | 来自哪个链接(可选) | string | localhost | - |
| to | 准备去的链接(可选) | string | localhost | - |
## slave 实例方法
| 方法 | 说明 | 类型 | 默认值 | 版本 |
| --- | --- | --- | --- | --- |
| init | 初始化实例 | function | (data: SlaveProps) => void | - |
| logOut | 退出登录 | function | () => void | - |

View File

@ -1,5 +1,5 @@
import { message } from "antd";
import { getValueByUrl } from '@zhst/func'
import { isUrl } from '@zhst/func'
export interface ISlaveConfig {
/**
@ -9,7 +9,7 @@ export interface ISlaveConfig {
/**
*
*/
jumpUrl?: string;
jumpUrl: string;
/**
* token键名称
*/
@ -22,15 +22,12 @@ export interface ISlaveConfig {
class Slave {
config?: ISlaveConfig
jumpUrl?: string;
authTokenDefine: string;
// eslint-disable-next-line @typescript-eslint/no-useless-constructor
authTokenDefine: string; // 设置参数
constructor() {
this.authTokenDefine = 'ZHST_AUTH_TOKEN'
this.jumpUrl = undefined
}
async init (opt: ISlaveConfig = {}) {
async init (opt: ISlaveConfig) {
const {
jumpToLogin = true,
jumpUrl,
@ -40,27 +37,41 @@ class Slave {
from,
to
} = opt
this.checkUrl(jumpUrl, 'jumpUrl')
// 当前链接
let currentUrl = new URL(location.href)
// 当前待跳转链接
let currentJumpUrl = new URL(jumpUrl)
// eslint-disable-next-line @typescript-eslint/no-unused-expressions
let _token = getValueByUrl(tokenKey || 'token', location.href) || this.getToken()
let _from = location.origin + location.pathname
// TODO: 检验是否为url链接
let _to = to
let _token = currentUrl.searchParams.get(tokenKey || 'token') || this.getToken()
this.setToken(_token)
let _fromUrl = from || (location.origin + location.pathname)
this.checkUrl(_fromUrl, 'from')
// 判段from字段是否为链接
if (!currentJumpUrl.searchParams.get('from')) {
currentJumpUrl.searchParams.set('from', _fromUrl)
}
let _toUrl = to || (location.origin + location.pathname)
this.checkUrl(_toUrl, 'to')
if (!currentJumpUrl.searchParams.get('to')) {
currentJumpUrl.searchParams.set('to', _toUrl)
}
// 判断当前登录环境
this.checkEnv({ showMsg, msgText })
// 是否执行跳转页面
if (jumpToLogin && jumpUrl && !_token) {
let jumpUrlObj = new URL(jumpUrl)
// 判断是否为同一个域,采用不同的跳转方式
// 同一个域名下
if (jumpUrlObj.origin === location.origin) {
history.pushState('', '', jumpUrl)
if (currentJumpUrl.origin === location.origin) {
history.pushState('', '', currentJumpUrl.href)
} else {
location.href = jumpUrl
location.href = currentJumpUrl.href
}
}
}
@ -75,7 +86,14 @@ class Slave {
return true
}
// 检查是否为url并且跑出错误
checkUrl(url: string, label: string) {
if (!isUrl(url)) {
throw Error(`请输入正确的 ${label} 链接地址以http(s)://开头!'`)
}
}
// 退出登录
public logOut() {
this.removeToken()
location.replace(location.origin + location.pathname)