Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: 修复无界主应用内嵌在iframe内部报错 #246

Merged
merged 1 commit into from
Nov 1, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 2 additions & 3 deletions docs/guide/jump.md
Original file line number Diff line number Diff line change
Expand Up @@ -46,12 +46,11 @@ function handleJump() {
```javascript
// 子应用 A 点击跳转处理函数
function handleJump() {
window.$wujie?.props.jump({ path: "/pathB", query: { B: window.encodeURIComponent("/test") } });
window.$wujie?.props.jump({ path: "/pathB", query: { B: "/test" } });
}
```

由于跳转后的链接的查询参数带上了 B 应用的路径信息,而子应用 B 开启了路由同步的能力,所以能从 url 上读回需要同步的路径

由于跳转后的链接的查询参数带上了 B 应用的路径信息,而子应用 B 开启了路由同步的能力,所以能从 url 上读回需要同步的路径,注意这种办法只有在 B 应用未曾激活过才生效。
### 子应用 B 为保活应用

如果子应用 B 是保活应用并且没有被打开过,也就是还没有实例化,上述的打开指定路由的方式可以正常工作,但如果子应用 B 已经实例化,保活应用的内部数据和路由状态都会保存下来不随子应用切换而丢失。
Expand Down
2 changes: 0 additions & 2 deletions packages/wujie-core/src/common.ts
Original file line number Diff line number Diff line change
Expand Up @@ -186,8 +186,6 @@ export const windowRegWhiteList = [

// 保存原型方法
// 子应用的Document.prototype已经被改写了
export const rawCreateElement = window.top.Document.prototype.createElement;
export const rawCreateTextNode = window.top.Document.prototype.createTextNode;
export const rawElementAppendChild = HTMLElement.prototype.appendChild;
export const rawElementRemoveChild = HTMLElement.prototype.removeChild;
export const rawHeadInsertBefore = HTMLHeadElement.prototype.insertBefore;
Expand Down
12 changes: 6 additions & 6 deletions packages/wujie-core/src/proxy.ts
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
import { patchElementEffect, renderIframeReplaceApp } from "./iframe";
import { renderElementToContainer } from "./shadow";
import { pushUrlToWindow } from "./sync";
import { documentProxyProperties, rawDocumentQuerySelector, rawCreateElement, rawCreateTextNode } from "./common";
import { documentProxyProperties, rawDocumentQuerySelector } from "./common";
import { WUJIE_TIPS_RELOAD_DISABLED } from "./constant";
import {
getTargetValue,
Expand Down Expand Up @@ -79,20 +79,20 @@ export function proxyGenerator(
{
get: function (_fakeDocument, propKey) {
const document = window.document;
const shadowRoot = iframe.contentWindow.__WUJIE.shadowRoot;
const { shadowRoot, inject, proxyLocation } = iframe.contentWindow.__WUJIE;
// need fix
if (propKey === "createElement" || propKey === "createTextNode") {
return new Proxy(document[propKey], {
apply(_createElement, _ctx, args) {
const rawCreateMethod = propKey === "createElement" ? rawCreateElement : rawCreateTextNode;
const rawCreateMethod = propKey === "createElement" ? inject.rawCreateElement : inject.rawCreateTextNode;
const element = rawCreateMethod.apply(iframe.contentDocument, args);
patchElementEffect(element, iframe.contentWindow);
return element;
},
});
}
if (propKey === "documentURI" || propKey === "URL") {
return (iframe.contentWindow.__WUJIE.proxyLocation as Location).href;
return (proxyLocation as Location).href;
}

// from shadowRoot
Expand Down Expand Up @@ -217,7 +217,7 @@ export function localGenerator(
createElement: {
get: () => {
return function (...args) {
const element = rawCreateElement.apply(iframe.contentDocument, args);
const element = sandbox.inject.rawCreateElement.apply(iframe.contentDocument, args);
patchElementEffect(element, iframe.contentWindow);
return element;
};
Expand All @@ -226,7 +226,7 @@ export function localGenerator(
createTextNode: {
get: () => {
return function (...args) {
const element = rawCreateTextNode.apply(iframe.contentDocument, args);
const element = sandbox.inject.rawCreateTextNode.apply(iframe.contentDocument, args);
patchElementEffect(element, iframe.contentWindow);
return element;
};
Expand Down
4 changes: 4 additions & 0 deletions packages/wujie-core/src/sandbox.ts
Original file line number Diff line number Diff line change
Expand Up @@ -124,6 +124,8 @@ export default class Wujie {
idToSandboxMap: Map<String, SandboxCache>;
appEventObjMap: Map<String, EventObj>;
mainHostPath: string;
rawCreateElement: typeof Document.prototype.createElement;
rawCreateTextNode: typeof Document.prototype.createTextNode;
};

/** 激活子应用
Expand Down Expand Up @@ -472,6 +474,8 @@ export default class Wujie {
idToSandboxMap: idToSandboxCacheMap,
appEventObjMap,
mainHostPath: window.location.protocol + "//" + window.location.host,
rawCreateElement: window.document.createElement,
rawCreateTextNode: window.document.createTextNode,
};
}
const { name, url, attrs, fiber, degrade, lifecycles, plugins } = options;
Expand Down