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

子应用window.addEventListener失效 #549

Closed
UmbraCi opened this issue May 16, 2023 · 21 comments
Closed

子应用window.addEventListener失效 #549

UmbraCi opened this issue May 16, 2023 · 21 comments

Comments

@UmbraCi
Copy link
Contributor

UmbraCi commented May 16, 2023

子应用原本是iframe潜在主应用中的,使用的postmessage传递消息,现在子应用想改造成wujie的子应用嵌入到父应用中,不想改动业务代码,发现原本在子应用监听postmessage消息的事件监听器全部失效
image
image
子应用是用window.addEventListener('message'绑定事件的,现在所有事件都绑定到父应用去了,window.WUJIE_RAW_WINDOW.addEventListener('message', 也是一样:
image

image
这种情况难道要全部修改子应用和父应用的交互吗,不想改动postmessage的老代码

@bigyifeng
Copy link

要监听window.parent ,子应用的window是被封装过的,你要是用parent获取到主应用的window,然后再监听

@UmbraCi
Copy link
Contributor Author

UmbraCi commented May 17, 2023

要监听window.parent ,子应用的window是被封装过的,你要是用parent获取到主应用的window,然后再监听

iframe应用原本的父子通讯的方式是postmessage,父应用给子应用发postmessage,子应用监听自己的message事件,怎么能直接监听主应用的window呢

@taoguili
Copy link

大佬,有解决吗

@UmbraCi
Copy link
Contributor Author

UmbraCi commented May 18, 2023

大佬,有解决吗

没有

@yiludege
Copy link
Collaborator

这个地方加一个message?欢迎提一个pr

image

@UmbraCi
Copy link
Contributor Author

UmbraCi commented May 21, 2023

这个地方加一个message?欢迎提一个pr

image

这里可以提一个pr,但是担心影响您其他地方的设计,我现在提一个pr试试

@yiludege
Copy link
Collaborator

这里可以提一个pr,但是担心影响您其他地方的设计,我现在提一个pr试试

这个没有影响,你可以本地拉一下代码,然后加上message,改一下demo看看postmessage是否生效,如果OK把代码推过来就好了

@UmbraCi
Copy link
Contributor Author

UmbraCi commented May 21, 2023

这里可以提一个pr,但是担心影响您其他地方的设计,我现在提一个pr试试

这个没有影响,你可以本地拉一下代码,然后加上message,改一下demo看看postmessage是否生效,如果OK把代码推过来就好了

用example自带的例子试过了,没问题,并且新增了个可选参数用于指定targetWindow,麻烦看下这个PR,第一次提PR不知道合不合规:#555

@UmbraCi
Copy link
Contributor Author

UmbraCi commented May 22, 2023

这里可以提一个pr,但是担心影响您其他地方的设计,我现在提一个pr试试

这个没有影响,你可以本地拉一下代码,然后加上message,改一下demo看看postmessage是否生效,如果OK把代码推过来就好了

今天可以看下PR嘛,有点着急用,3KS

@UmbraCi
Copy link
Contributor Author

UmbraCi commented May 27, 2023

这里可以提一个pr,但是担心影响您其他地方的设计,我现在提一个pr试试

这个没有影响,你可以本地拉一下代码,然后加上message,改一下demo看看postmessage是否生效,如果OK把代码推过来就好了

我看到Pr被合并了但是我当时没有更新package的version版本,这里发版npm怎么做呢,是否需要我再提个pr更新下版本号

@yiludege
Copy link
Collaborator

今天发出来哈

@UmbraCi
Copy link
Contributor Author

UmbraCi commented May 27, 2023

今天发出来哈

不好意思,第一次提pr和这种monorepo的发布形式,请问是让我修改一次版本号嘛,发出来之前需要我再改点东西吗

@yiludege
Copy link
Collaborator

不用的,我这边统一更新版本

@UmbraCi
Copy link
Contributor Author

UmbraCi commented May 27, 2023

不用的,我这边统一更新版本

再多问一句,这种monorepo的仓库是packages内的版本号都统一跟根路径的一致嘛,因为我也想把自己其他项目的改为monorepo的仓库,是多个应用嵌套子应用,用pnpm+workspace+wujie的思路

@yiludege
Copy link
Collaborator

是的,版本我用 lerna-lite 做管理,因为这个支持 pnpm

@IceEnd
Copy link

IceEnd commented May 30, 2023

@yiludege 大佬,请问这个版本发布了么?目前仍是1.0.16版本。我遇到的差不多,是子应用里嵌入了一个iframe,双方通信全被拦截了。
image

@UmbraCi
Copy link
Contributor Author

UmbraCi commented May 30, 2023

@yiludege 大佬,请问这个版本发布了么?目前仍是1.0.16版本。我遇到的差不多,是子应用里嵌入了一个iframe,双方通信全被拦截了。 image
用pnpm的override覆盖一下,我修复的包:
"pnpm": {
"overrides": {
"wujie": "npm:@umbraci/[email protected]"
}
},

image

@loycoder
Copy link

这里你可以提一个pr,但是担心影响其他地方的设计,我现在提一个pr尝试

这个没有影响,你可以在本地拉一下代码,然后加上message,改一下demo看看postmessage是否生效,如果OK把代码推过来就好了

用例子自带的例子试过了,没问题,并且新增了一个用于指定targetWindow的可选参数,麻烦看下这个PR,第一次提PR不知道合不合规:#555

这里引发了其他问题: #773

@Keekuun
Copy link

Keekuun commented Dec 25, 2023

@promiseMIMI
Copy link

promiseMIMI commented Feb 26, 2024

wujie-vue3的模板22版本还没生效呢,源代码里面看着已经存在“message”了
1708943143105

@Tiramisupxl
Copy link

要监听window.parent ,子应用的window是被封装过的,你要是用parent获取到主应用的window,然后再监听

这个可以解决,但是用了这个方法后,子应用和主应用都监听到

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

9 participants