@alicloud/alfa-react 1.4.30-alpha.3 → 1.4.30-alpha.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +1 -1
- package/es/createAlfaApp.js +13 -9
- package/es/createAlfaWidget.js +2 -2
- package/es/createApplication.js +106 -16
- package/es/version.js +1 -1
- package/lib/createAlfaApp.js +19 -9
- package/lib/createAlfaWidget.js +2 -2
- package/lib/createApplication.js +106 -16
- package/lib/version.js +1 -1
- package/package.json +1 -1
- package/types/createAlfaApp.d.ts +10 -5
- package/types/createAlfaWidget.d.ts +2 -2
- package/types/createApplication.d.ts +3 -2
- package/types/version.d.ts +1 -1
package/es/createAlfaApp.js
CHANGED
|
@@ -5,7 +5,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
|
|
|
5
5
|
|
|
6
6
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
7
7
|
|
|
8
|
-
import React from 'react';
|
|
8
|
+
import React, { useMemo } from 'react';
|
|
9
9
|
import { BaseLoader } from '@alicloud/alfa-core';
|
|
10
10
|
import ErrorBoundary from './components/ErrorBoundary';
|
|
11
11
|
import createApplication from './createApplication';
|
|
@@ -26,19 +26,23 @@ function createAlfaApp(option) {
|
|
|
26
26
|
return null;
|
|
27
27
|
};
|
|
28
28
|
var passedInOption = option;
|
|
29
|
-
return
|
|
30
|
-
var customProps =
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
29
|
+
return function (props) {
|
|
30
|
+
var customProps = useMemo(function () {
|
|
31
|
+
return _objectSpread(_objectSpread({}, props), {}, {
|
|
32
|
+
__injectHistory: props.history
|
|
33
|
+
});
|
|
34
|
+
}, [props]);
|
|
35
|
+
return /*#__PURE__*/React.createElement(ErrorBoundary, props, /*#__PURE__*/React.createElement(Application // 兼容历史逻辑,优先使用 option 中的 sandbox 参数
|
|
36
|
+
, _extends({}, passedInOption, {
|
|
35
37
|
puppeteer: props.puppeteer,
|
|
36
38
|
basename: props.basename,
|
|
37
39
|
sandbox: option.sandbox || props.sandbox,
|
|
38
40
|
deps: dependencies || {},
|
|
39
|
-
customProps: customProps
|
|
41
|
+
customProps: customProps // 受控模式下,用于触发子应用随主应用路由变更更新
|
|
42
|
+
,
|
|
43
|
+
path: props.puppeteer ? window.location.toString() : props.path
|
|
40
44
|
})));
|
|
41
|
-
}
|
|
45
|
+
};
|
|
42
46
|
}
|
|
43
47
|
|
|
44
48
|
export default createAlfaApp;
|
package/es/createAlfaWidget.js
CHANGED
|
@@ -56,7 +56,7 @@ function createAlfaWidget(option) {
|
|
|
56
56
|
return null;
|
|
57
57
|
};
|
|
58
58
|
var passedInOption = option;
|
|
59
|
-
return
|
|
59
|
+
return function (props) {
|
|
60
60
|
return (
|
|
61
61
|
/*#__PURE__*/
|
|
62
62
|
// Compatible with old logic
|
|
@@ -67,7 +67,7 @@ function createAlfaWidget(option) {
|
|
|
67
67
|
customProps: props
|
|
68
68
|
})))
|
|
69
69
|
);
|
|
70
|
-
}
|
|
70
|
+
};
|
|
71
71
|
}
|
|
72
72
|
|
|
73
73
|
export default createAlfaWidget;
|
package/es/createApplication.js
CHANGED
|
@@ -13,13 +13,46 @@ import Loading from './components/Loading';
|
|
|
13
13
|
import { normalizeName, isOsContext } from './utils';
|
|
14
14
|
import { version as loaderVersion } from './version';
|
|
15
15
|
|
|
16
|
+
var resolvePath = function resolvePath() {
|
|
17
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
18
|
+
args[_key] = arguments[_key];
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
return "/".concat(args.join('/')).replace(/\/+/g, '/');
|
|
22
|
+
};
|
|
23
|
+
/**
|
|
24
|
+
* 去掉 location.origin 的路径
|
|
25
|
+
*/
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
var peelPath = function peelPath(location) {
|
|
29
|
+
return location.pathname + location.search + location.hash;
|
|
30
|
+
};
|
|
31
|
+
|
|
32
|
+
var addBasename = function addBasename(path, basename) {
|
|
33
|
+
if (!basename) return path;
|
|
34
|
+
return resolvePath(basename, path);
|
|
35
|
+
};
|
|
36
|
+
|
|
37
|
+
var stripBasename = function stripBasename(path, basename) {
|
|
38
|
+
if (!basename) return path;
|
|
39
|
+
|
|
40
|
+
var _path = resolvePath(path);
|
|
41
|
+
|
|
42
|
+
var _basename = resolvePath(basename);
|
|
43
|
+
|
|
44
|
+
if (_path === _basename) return '/';
|
|
45
|
+
return _path.replace(new RegExp("^".concat(_basename), 'ig'), '');
|
|
46
|
+
};
|
|
16
47
|
/**
|
|
17
48
|
* container for microApp mount
|
|
18
49
|
* @param loader alfa-core loader
|
|
19
50
|
* @returns
|
|
20
51
|
*/
|
|
52
|
+
|
|
53
|
+
|
|
21
54
|
export default function createApplication(loader) {
|
|
22
|
-
|
|
55
|
+
function Application(props) {
|
|
23
56
|
var name = props.name,
|
|
24
57
|
version = props.version,
|
|
25
58
|
manifest = props.manifest,
|
|
@@ -59,8 +92,17 @@ export default function createApplication(loader) {
|
|
|
59
92
|
var $basename = useRef(basename);
|
|
60
93
|
var tagName = normalizeName(props.name);
|
|
61
94
|
$puppeteer.current = puppeteer;
|
|
62
|
-
$basename.current = basename;
|
|
63
|
-
|
|
95
|
+
$basename.current = basename; // 受控模式锁定一些参数
|
|
96
|
+
|
|
97
|
+
if ($puppeteer.current) {
|
|
98
|
+
// 禁止子应用和 consoleBase 通信
|
|
99
|
+
customProps.consoleBase = null; // 覆写 path 参数,用于通知子应用更新路由
|
|
100
|
+
|
|
101
|
+
customProps.path = stripBasename(peelPath(window.location), $basename.current); // 禁止注入 history
|
|
102
|
+
|
|
103
|
+
customProps.__injectHistory = null;
|
|
104
|
+
}
|
|
105
|
+
|
|
64
106
|
var sandbox = useMemo(function () {
|
|
65
107
|
var _UA_Opt, _RISK_INFO, _um;
|
|
66
108
|
|
|
@@ -118,6 +160,31 @@ export default function createApplication(loader) {
|
|
|
118
160
|
var originalReplaceState;
|
|
119
161
|
var originalGo;
|
|
120
162
|
|
|
163
|
+
var dispatchFramePopstate = function dispatchFramePopstate() {
|
|
164
|
+
var _App, _App$context$baseFram, _App$context$baseFram2;
|
|
165
|
+
|
|
166
|
+
var popstateEvent = new Event('popstate');
|
|
167
|
+
popstateEvent.state = 'mock';
|
|
168
|
+
(_App = App) === null || _App === void 0 ? void 0 : (_App$context$baseFram = _App.context.baseFrame) === null || _App$context$baseFram === void 0 ? void 0 : (_App$context$baseFram2 = _App$context$baseFram.contentWindow) === null || _App$context$baseFram2 === void 0 ? void 0 : _App$context$baseFram2.dispatchEvent(popstateEvent);
|
|
169
|
+
}; // 受控模式下,返回不会触发子应用内的路由更新
|
|
170
|
+
|
|
171
|
+
|
|
172
|
+
var updateAppHistory = function updateAppHistory() {
|
|
173
|
+
if (App) {
|
|
174
|
+
// 如果子应用路径不同,主动通知子应用 popstate 事件
|
|
175
|
+
var nextPath = peelPath(App.context.location);
|
|
176
|
+
|
|
177
|
+
if (nextPath !== stripBasename(peelPath(window.location), $basename.current)) {
|
|
178
|
+
var popstateEvent = new Event('popstate');
|
|
179
|
+
popstateEvent.state = 'mock';
|
|
180
|
+
if (originalReplaceState) originalReplaceState(null, '', stripBasename(peelPath(window.location), $basename.current));
|
|
181
|
+
dispatchFramePopstate();
|
|
182
|
+
}
|
|
183
|
+
}
|
|
184
|
+
};
|
|
185
|
+
|
|
186
|
+
window.addEventListener('popstate', updateAppHistory);
|
|
187
|
+
|
|
121
188
|
_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
|
|
122
189
|
var _app$context$updateBo, _app$context, _app$context$baseFram;
|
|
123
190
|
|
|
@@ -178,18 +245,33 @@ export default function createApplication(loader) {
|
|
|
178
245
|
originalReplaceState = frameWindow === null || frameWindow === void 0 ? void 0 : frameWindow.history.replaceState;
|
|
179
246
|
originalGo = frameWindow === null || frameWindow === void 0 ? void 0 : frameWindow.history.go; // update context history according to path
|
|
180
247
|
|
|
181
|
-
if (path) originalReplaceState(null, '', path);
|
|
248
|
+
if (path) originalReplaceState(null, '', path.replace(/\/+/g, '/'));
|
|
182
249
|
|
|
183
|
-
if (
|
|
250
|
+
if (frameWindow) {
|
|
184
251
|
frameWindow.history.pushState = function (data, unused, _url) {
|
|
185
|
-
|
|
186
|
-
|
|
252
|
+
if ($puppeteer.current) {
|
|
253
|
+
var nextPath = addBasename((_url === null || _url === void 0 ? void 0 : _url.toString()) || '', $basename.current);
|
|
254
|
+
|
|
255
|
+
if ("".concat(nextPath) !== peelPath(window.location)) {
|
|
256
|
+
window.history.pushState(data, unused, nextPath);
|
|
257
|
+
}
|
|
258
|
+
|
|
259
|
+
originalReplaceState(data, unused, _url);
|
|
260
|
+
} else {
|
|
261
|
+
originalPushState(data, unused, _url);
|
|
262
|
+
}
|
|
187
263
|
};
|
|
188
264
|
|
|
189
265
|
frameWindow.history.replaceState = function (data, unused, _url) {
|
|
190
|
-
|
|
266
|
+
var nextPath = addBasename((_url === null || _url === void 0 ? void 0 : _url.toString()) || '', $basename.current);
|
|
267
|
+
|
|
268
|
+
if ($puppeteer.current) {
|
|
269
|
+
window.history.replaceState(data, unused, nextPath);
|
|
270
|
+
}
|
|
271
|
+
|
|
191
272
|
originalReplaceState(data, unused, _url);
|
|
192
|
-
};
|
|
273
|
+
}; // 劫持微应用的返回
|
|
274
|
+
|
|
193
275
|
|
|
194
276
|
frameWindow.history.go = function (n) {
|
|
195
277
|
window.history.go(n);
|
|
@@ -203,10 +285,15 @@ export default function createApplication(loader) {
|
|
|
203
285
|
});
|
|
204
286
|
|
|
205
287
|
case 18:
|
|
206
|
-
|
|
288
|
+
if (frameWindow) {
|
|
289
|
+
// 每次挂载后主动触发子应用内的 popstate 事件,借此触发 react-router history 的检查逻辑
|
|
290
|
+
dispatchFramePopstate();
|
|
291
|
+
} // just run once
|
|
292
|
+
|
|
293
|
+
|
|
207
294
|
setAppInstance(app);
|
|
208
295
|
|
|
209
|
-
case
|
|
296
|
+
case 20:
|
|
210
297
|
case "end":
|
|
211
298
|
return _context.stop();
|
|
212
299
|
}
|
|
@@ -219,19 +306,20 @@ export default function createApplication(loader) {
|
|
|
219
306
|
});
|
|
220
307
|
|
|
221
308
|
return function () {
|
|
222
|
-
var _App$context$
|
|
309
|
+
var _App$context$baseFram3, _App$context$baseFram4;
|
|
223
310
|
|
|
224
311
|
isUnmounted = true;
|
|
312
|
+
window.removeEventListener('popstate', updateAppHistory);
|
|
225
313
|
if (!App) return;
|
|
226
|
-
App.
|
|
227
|
-
var frameHistory = (_App$context$baseFram = App.context.baseFrame) === null || _App$context$baseFram === void 0 ? void 0 : (_App$context$baseFram2 = _App$context$baseFram.contentWindow) === null || _App$context$baseFram2 === void 0 ? void 0 : _App$context$baseFram2.history;
|
|
314
|
+
var frameHistory = (_App$context$baseFram3 = App.context.baseFrame) === null || _App$context$baseFram3 === void 0 ? void 0 : (_App$context$baseFram4 = _App$context$baseFram3.contentWindow) === null || _App$context$baseFram4 === void 0 ? void 0 : _App$context$baseFram4.history;
|
|
228
315
|
|
|
229
316
|
if (frameHistory) {
|
|
230
317
|
if (originalPushState !== frameHistory.pushState) frameHistory.pushState = originalPushState;
|
|
231
318
|
if (originalReplaceState !== frameHistory.replaceState) frameHistory.pushState = originalReplaceState;
|
|
232
319
|
if (originalGo !== frameHistory.go) frameHistory.go = originalGo;
|
|
233
|
-
}
|
|
320
|
+
}
|
|
234
321
|
|
|
322
|
+
App.unmount(); // 在沙箱中嵌套时,必须销毁实例,避免第二次加载时异常
|
|
235
323
|
|
|
236
324
|
if (isOsContext()) App.destroy();
|
|
237
325
|
};
|
|
@@ -257,5 +345,7 @@ export default function createApplication(loader) {
|
|
|
257
345
|
style: style,
|
|
258
346
|
className: className
|
|
259
347
|
})));
|
|
260
|
-
}
|
|
348
|
+
}
|
|
349
|
+
|
|
350
|
+
return /*#__PURE__*/React.memo(Application);
|
|
261
351
|
}
|
package/es/version.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export var version = '1.4.30-alpha.
|
|
1
|
+
export var version = '1.4.30-alpha.5';
|
package/lib/createAlfaApp.js
CHANGED
|
@@ -2,6 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
4
|
|
|
5
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
+
|
|
5
7
|
Object.defineProperty(exports, "__esModule", {
|
|
6
8
|
value: true
|
|
7
9
|
});
|
|
@@ -11,7 +13,7 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
|
|
|
11
13
|
|
|
12
14
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
13
15
|
|
|
14
|
-
var _react =
|
|
16
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
15
17
|
|
|
16
18
|
var _alfaCore = require("@alicloud/alfa-core");
|
|
17
19
|
|
|
@@ -23,6 +25,10 @@ var _beforeResolveHook = _interopRequireDefault(require("./hooks/beforeResolveHo
|
|
|
23
25
|
|
|
24
26
|
var _beforeLoadHook = _interopRequireDefault(require("./hooks/beforeLoadHook"));
|
|
25
27
|
|
|
28
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
29
|
+
|
|
30
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
31
|
+
|
|
26
32
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
27
33
|
|
|
28
34
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
@@ -43,19 +49,23 @@ function createAlfaApp(option) {
|
|
|
43
49
|
return null;
|
|
44
50
|
};
|
|
45
51
|
var passedInOption = option;
|
|
46
|
-
return
|
|
47
|
-
var customProps =
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
+
return function (props) {
|
|
53
|
+
var customProps = (0, _react.useMemo)(function () {
|
|
54
|
+
return _objectSpread(_objectSpread({}, props), {}, {
|
|
55
|
+
__injectHistory: props.history
|
|
56
|
+
});
|
|
57
|
+
}, [props]);
|
|
58
|
+
return /*#__PURE__*/_react.default.createElement(_ErrorBoundary.default, props, /*#__PURE__*/_react.default.createElement(Application // 兼容历史逻辑,优先使用 option 中的 sandbox 参数
|
|
59
|
+
, (0, _extends2.default)({}, passedInOption, {
|
|
52
60
|
puppeteer: props.puppeteer,
|
|
53
61
|
basename: props.basename,
|
|
54
62
|
sandbox: option.sandbox || props.sandbox,
|
|
55
63
|
deps: dependencies || {},
|
|
56
|
-
customProps: customProps
|
|
64
|
+
customProps: customProps // 受控模式下,用于触发子应用随主应用路由变更更新
|
|
65
|
+
,
|
|
66
|
+
path: props.puppeteer ? window.location.toString() : props.path
|
|
57
67
|
})));
|
|
58
|
-
}
|
|
68
|
+
};
|
|
59
69
|
}
|
|
60
70
|
|
|
61
71
|
var _default = createAlfaApp;
|
package/lib/createAlfaWidget.js
CHANGED
|
@@ -76,7 +76,7 @@ function createAlfaWidget(option) {
|
|
|
76
76
|
return null;
|
|
77
77
|
};
|
|
78
78
|
var passedInOption = option;
|
|
79
|
-
return
|
|
79
|
+
return function (props) {
|
|
80
80
|
return (
|
|
81
81
|
/*#__PURE__*/
|
|
82
82
|
// Compatible with old logic
|
|
@@ -87,7 +87,7 @@ function createAlfaWidget(option) {
|
|
|
87
87
|
customProps: props
|
|
88
88
|
})))
|
|
89
89
|
);
|
|
90
|
-
}
|
|
90
|
+
};
|
|
91
91
|
}
|
|
92
92
|
|
|
93
93
|
var _default = createAlfaWidget;
|
package/lib/createApplication.js
CHANGED
|
@@ -35,13 +35,46 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
|
|
|
35
35
|
|
|
36
36
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
37
37
|
|
|
38
|
+
var resolvePath = function resolvePath() {
|
|
39
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
40
|
+
args[_key] = arguments[_key];
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
return "/".concat(args.join('/')).replace(/\/+/g, '/');
|
|
44
|
+
};
|
|
45
|
+
/**
|
|
46
|
+
* 去掉 location.origin 的路径
|
|
47
|
+
*/
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
var peelPath = function peelPath(location) {
|
|
51
|
+
return location.pathname + location.search + location.hash;
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
var addBasename = function addBasename(path, basename) {
|
|
55
|
+
if (!basename) return path;
|
|
56
|
+
return resolvePath(basename, path);
|
|
57
|
+
};
|
|
58
|
+
|
|
59
|
+
var stripBasename = function stripBasename(path, basename) {
|
|
60
|
+
if (!basename) return path;
|
|
61
|
+
|
|
62
|
+
var _path = resolvePath(path);
|
|
63
|
+
|
|
64
|
+
var _basename = resolvePath(basename);
|
|
65
|
+
|
|
66
|
+
if (_path === _basename) return '/';
|
|
67
|
+
return _path.replace(new RegExp("^".concat(_basename), 'ig'), '');
|
|
68
|
+
};
|
|
38
69
|
/**
|
|
39
70
|
* container for microApp mount
|
|
40
71
|
* @param loader alfa-core loader
|
|
41
72
|
* @returns
|
|
42
73
|
*/
|
|
74
|
+
|
|
75
|
+
|
|
43
76
|
function createApplication(loader) {
|
|
44
|
-
|
|
77
|
+
function Application(props) {
|
|
45
78
|
var name = props.name,
|
|
46
79
|
version = props.version,
|
|
47
80
|
manifest = props.manifest,
|
|
@@ -81,8 +114,17 @@ function createApplication(loader) {
|
|
|
81
114
|
var $basename = (0, _react.useRef)(basename);
|
|
82
115
|
var tagName = (0, _utils.normalizeName)(props.name);
|
|
83
116
|
$puppeteer.current = puppeteer;
|
|
84
|
-
$basename.current = basename;
|
|
85
|
-
|
|
117
|
+
$basename.current = basename; // 受控模式锁定一些参数
|
|
118
|
+
|
|
119
|
+
if ($puppeteer.current) {
|
|
120
|
+
// 禁止子应用和 consoleBase 通信
|
|
121
|
+
customProps.consoleBase = null; // 覆写 path 参数,用于通知子应用更新路由
|
|
122
|
+
|
|
123
|
+
customProps.path = stripBasename(peelPath(window.location), $basename.current); // 禁止注入 history
|
|
124
|
+
|
|
125
|
+
customProps.__injectHistory = null;
|
|
126
|
+
}
|
|
127
|
+
|
|
86
128
|
var sandbox = (0, _react.useMemo)(function () {
|
|
87
129
|
var _UA_Opt, _RISK_INFO, _um;
|
|
88
130
|
|
|
@@ -139,6 +181,31 @@ function createApplication(loader) {
|
|
|
139
181
|
var originalPushState;
|
|
140
182
|
var originalReplaceState;
|
|
141
183
|
var originalGo;
|
|
184
|
+
|
|
185
|
+
var dispatchFramePopstate = function dispatchFramePopstate() {
|
|
186
|
+
var _App, _App$context$baseFram, _App$context$baseFram2;
|
|
187
|
+
|
|
188
|
+
var popstateEvent = new Event('popstate');
|
|
189
|
+
popstateEvent.state = 'mock';
|
|
190
|
+
(_App = App) === null || _App === void 0 ? void 0 : (_App$context$baseFram = _App.context.baseFrame) === null || _App$context$baseFram === void 0 ? void 0 : (_App$context$baseFram2 = _App$context$baseFram.contentWindow) === null || _App$context$baseFram2 === void 0 ? void 0 : _App$context$baseFram2.dispatchEvent(popstateEvent);
|
|
191
|
+
}; // 受控模式下,返回不会触发子应用内的路由更新
|
|
192
|
+
|
|
193
|
+
|
|
194
|
+
var updateAppHistory = function updateAppHistory() {
|
|
195
|
+
if (App) {
|
|
196
|
+
// 如果子应用路径不同,主动通知子应用 popstate 事件
|
|
197
|
+
var nextPath = peelPath(App.context.location);
|
|
198
|
+
|
|
199
|
+
if (nextPath !== stripBasename(peelPath(window.location), $basename.current)) {
|
|
200
|
+
var popstateEvent = new Event('popstate');
|
|
201
|
+
popstateEvent.state = 'mock';
|
|
202
|
+
if (originalReplaceState) originalReplaceState(null, '', stripBasename(peelPath(window.location), $basename.current));
|
|
203
|
+
dispatchFramePopstate();
|
|
204
|
+
}
|
|
205
|
+
}
|
|
206
|
+
};
|
|
207
|
+
|
|
208
|
+
window.addEventListener('popstate', updateAppHistory);
|
|
142
209
|
(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
|
|
143
210
|
var _app$context$updateBo, _app$context, _app$context$baseFram;
|
|
144
211
|
|
|
@@ -199,18 +266,33 @@ function createApplication(loader) {
|
|
|
199
266
|
originalReplaceState = frameWindow === null || frameWindow === void 0 ? void 0 : frameWindow.history.replaceState;
|
|
200
267
|
originalGo = frameWindow === null || frameWindow === void 0 ? void 0 : frameWindow.history.go; // update context history according to path
|
|
201
268
|
|
|
202
|
-
if (path) originalReplaceState(null, '', path);
|
|
269
|
+
if (path) originalReplaceState(null, '', path.replace(/\/+/g, '/'));
|
|
203
270
|
|
|
204
|
-
if (
|
|
271
|
+
if (frameWindow) {
|
|
205
272
|
frameWindow.history.pushState = function (data, unused, _url) {
|
|
206
|
-
|
|
207
|
-
|
|
273
|
+
if ($puppeteer.current) {
|
|
274
|
+
var nextPath = addBasename((_url === null || _url === void 0 ? void 0 : _url.toString()) || '', $basename.current);
|
|
275
|
+
|
|
276
|
+
if ("".concat(nextPath) !== peelPath(window.location)) {
|
|
277
|
+
window.history.pushState(data, unused, nextPath);
|
|
278
|
+
}
|
|
279
|
+
|
|
280
|
+
originalReplaceState(data, unused, _url);
|
|
281
|
+
} else {
|
|
282
|
+
originalPushState(data, unused, _url);
|
|
283
|
+
}
|
|
208
284
|
};
|
|
209
285
|
|
|
210
286
|
frameWindow.history.replaceState = function (data, unused, _url) {
|
|
211
|
-
|
|
287
|
+
var nextPath = addBasename((_url === null || _url === void 0 ? void 0 : _url.toString()) || '', $basename.current);
|
|
288
|
+
|
|
289
|
+
if ($puppeteer.current) {
|
|
290
|
+
window.history.replaceState(data, unused, nextPath);
|
|
291
|
+
}
|
|
292
|
+
|
|
212
293
|
originalReplaceState(data, unused, _url);
|
|
213
|
-
};
|
|
294
|
+
}; // 劫持微应用的返回
|
|
295
|
+
|
|
214
296
|
|
|
215
297
|
frameWindow.history.go = function (n) {
|
|
216
298
|
window.history.go(n);
|
|
@@ -224,10 +306,15 @@ function createApplication(loader) {
|
|
|
224
306
|
});
|
|
225
307
|
|
|
226
308
|
case 18:
|
|
227
|
-
|
|
309
|
+
if (frameWindow) {
|
|
310
|
+
// 每次挂载后主动触发子应用内的 popstate 事件,借此触发 react-router history 的检查逻辑
|
|
311
|
+
dispatchFramePopstate();
|
|
312
|
+
} // just run once
|
|
313
|
+
|
|
314
|
+
|
|
228
315
|
setAppInstance(app);
|
|
229
316
|
|
|
230
|
-
case
|
|
317
|
+
case 20:
|
|
231
318
|
case "end":
|
|
232
319
|
return _context.stop();
|
|
233
320
|
}
|
|
@@ -239,19 +326,20 @@ function createApplication(loader) {
|
|
|
239
326
|
});
|
|
240
327
|
});
|
|
241
328
|
return function () {
|
|
242
|
-
var _App$context$
|
|
329
|
+
var _App$context$baseFram3, _App$context$baseFram4;
|
|
243
330
|
|
|
244
331
|
isUnmounted = true;
|
|
332
|
+
window.removeEventListener('popstate', updateAppHistory);
|
|
245
333
|
if (!App) return;
|
|
246
|
-
App.
|
|
247
|
-
var frameHistory = (_App$context$baseFram = App.context.baseFrame) === null || _App$context$baseFram === void 0 ? void 0 : (_App$context$baseFram2 = _App$context$baseFram.contentWindow) === null || _App$context$baseFram2 === void 0 ? void 0 : _App$context$baseFram2.history;
|
|
334
|
+
var frameHistory = (_App$context$baseFram3 = App.context.baseFrame) === null || _App$context$baseFram3 === void 0 ? void 0 : (_App$context$baseFram4 = _App$context$baseFram3.contentWindow) === null || _App$context$baseFram4 === void 0 ? void 0 : _App$context$baseFram4.history;
|
|
248
335
|
|
|
249
336
|
if (frameHistory) {
|
|
250
337
|
if (originalPushState !== frameHistory.pushState) frameHistory.pushState = originalPushState;
|
|
251
338
|
if (originalReplaceState !== frameHistory.replaceState) frameHistory.pushState = originalReplaceState;
|
|
252
339
|
if (originalGo !== frameHistory.go) frameHistory.go = originalGo;
|
|
253
|
-
}
|
|
340
|
+
}
|
|
254
341
|
|
|
342
|
+
App.unmount(); // 在沙箱中嵌套时,必须销毁实例,避免第二次加载时异常
|
|
255
343
|
|
|
256
344
|
if ((0, _utils.isOsContext)()) App.destroy();
|
|
257
345
|
};
|
|
@@ -277,5 +365,7 @@ function createApplication(loader) {
|
|
|
277
365
|
style: style,
|
|
278
366
|
className: className
|
|
279
367
|
})));
|
|
280
|
-
}
|
|
368
|
+
}
|
|
369
|
+
|
|
370
|
+
return /*#__PURE__*/_react.default.memo(Application);
|
|
281
371
|
}
|
package/lib/version.js
CHANGED
package/package.json
CHANGED
package/types/createAlfaApp.d.ts
CHANGED
|
@@ -1,9 +1,14 @@
|
|
|
1
|
-
|
|
1
|
+
/// <reference types="react" />
|
|
2
2
|
import { AlfaFactoryOption } from './types';
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
3
|
+
interface IProps {
|
|
4
|
+
/**
|
|
5
|
+
* @deprecated
|
|
6
|
+
*/
|
|
7
|
+
sandbox: Record<string, any>;
|
|
6
8
|
puppeteer?: boolean;
|
|
7
9
|
basename?: string;
|
|
8
|
-
|
|
10
|
+
history?: any;
|
|
11
|
+
path?: string;
|
|
12
|
+
}
|
|
13
|
+
declare function createAlfaApp<P = any>(option: AlfaFactoryOption): (() => null) | ((props: P & IProps) => JSX.Element);
|
|
9
14
|
export default createAlfaApp;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
/// <reference types="react" />
|
|
2
2
|
import { AlfaFactoryOption } from './types';
|
|
3
|
-
declare function createAlfaWidget<P = any>(option: AlfaFactoryOption): ((props: P) => JSX.Element) | (() => null)
|
|
3
|
+
declare function createAlfaWidget<P = any>(option: AlfaFactoryOption): ((props: P) => JSX.Element) | (() => null);
|
|
4
4
|
export default createAlfaWidget;
|
|
@@ -1,15 +1,16 @@
|
|
|
1
|
-
|
|
1
|
+
import React from 'react';
|
|
2
2
|
import { BaseLoader } from '@alicloud/alfa-core';
|
|
3
3
|
import { AlfaFactoryOption } from './types';
|
|
4
4
|
interface IProps<C = any> extends AlfaFactoryOption {
|
|
5
5
|
customProps: C;
|
|
6
6
|
puppeteer?: boolean;
|
|
7
7
|
basename?: string;
|
|
8
|
+
path?: string;
|
|
8
9
|
}
|
|
9
10
|
/**
|
|
10
11
|
* container for microApp mount
|
|
11
12
|
* @param loader alfa-core loader
|
|
12
13
|
* @returns
|
|
13
14
|
*/
|
|
14
|
-
export default function createApplication(loader: BaseLoader): <C = any>(props: IProps<C>) => JSX.Element
|
|
15
|
+
export default function createApplication(loader: BaseLoader): React.MemoExoticComponent<(<C = any>(props: IProps<C>) => JSX.Element)>;
|
|
15
16
|
export {};
|
package/types/version.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const version = "1.4.30-alpha.
|
|
1
|
+
export declare const version = "1.4.30-alpha.5";
|