qiankun icon indicating copy to clipboard operation
qiankun copied to clipboard

[Bug]子应用加载过程中容器销毁了,重新进入页面加载会失败

Open hello-astar opened this issue 1 year ago • 15 comments

What happens?

类似这个issue的问题(https://github.com/umijs/qiankun/issues/690),复现方式是将网络调整为slowly 3G,访问子应用页面然后立即离开页面(离开的时候状态应该是Loading_source_code),会报错:Target container with #xxx not existed while xxx loading! 然后重新进入子应用页面,页面白屏,一直报:Target container with #xxx not existed while xxx loading!

最小可复现仓库

我使用的是loadMicroApp手动加载

复现步骤,错误日志以及相关配置

相关环境信息

  • qiankun 版本 2.7.4
  • 浏览器版本:版本 120.0.6099.71(正式版本) (x86_64)
  • 操作系统:macos

hello-astar avatar Dec 13 '23 09:12 hello-astar

复现步骤

  1. 进入子应用页面,调用loadMicroApp加载子应用
  2. 快速切换到其他页面,这时候子应用到状态是Loading_source_code,还在加载中,突然销毁了container,所以报错:Target container with #xxx not existed while xxx loading!
  3. 返回子应用页面,重新调用loadMicroApp加载子应用,白屏,报错:Target container with #xxx not existed while xxx loading!

期望效果: 期望第3步无论如何重新唤起子应用

hello-astar avatar Dec 13 '23 09:12 hello-astar

我遇到的问题和这个差不多,子应用正在加载时切换路由到其他页面,控制台报错 Uncaught Error: [qiankun]: Wrapper element for xxxx is not existed! 再跳转回到原来子应用路由页就显示不出来

yukui630 avatar Dec 20 '23 03:12 yukui630

我遇到的问题和这个差不多,子应用正在加载时切换路由到其他页面,控制台报错 Uncaught Error: [qiankun]: Wrapper element for xxxx is not existed! 再跳转回到原来子应用路由页就显示不出来

这个问题也遇到过

hello-astar avatar Dec 21 '23 09:12 hello-astar

我遇到的问题和这个差不多,子应用正在加载时切换路由到其他页面,控制台报错 Uncaught Error: [qiankun]: Wrapper element for xxxx is not existed! 再跳转回到原来子应用路由页就显示不出来

你解决了么

Kimmyzhao avatar Jan 02 '24 05:01 Kimmyzhao

我遇到的问题和这个差不多,子应用正在加载时切换路由到其他页面,控制台报错 Uncaught Error: [qiankun]: Wrapper element for xxxx is not existed! 再跳转回到原来子应用路由页就显示不出来

你解决了么

没有呢,等待qiankun解决bug

yukui630 avatar Jan 02 '24 11:01 yukui630

复现步骤

  1. 进入子应用页面,调用loadMicroApp加载子应用
  2. 快速切换到其他页面,这时候子应用到状态是Loading_source_code,还在加载中,突然销毁了container,所以报错:Target container with #xxx not existed while xxx loading!
  3. 返回子应用页面,重新调用loadMicroApp加载子应用,白屏,报错:Target container with #xxx not existed while xxx loading!

期望效果: 期望第3步无论如何重新唤起子应用

有一种办法可以达到你的期望,在qiankun执行前,注入 window.__SINGLE_SPA_DEVTOOLS__ = {} ; 这一步将single-spa的devtools方法注入到了window对象里。 之后遇到这个报错是可以通过 window.__SINGLE_SPA_DEVTOOLS__.exposedMethods.getRawAppData()[0].status = "NOT_LOADED" 重置应用的状态,在下次路由切换时即可使single-spa重新渲染改应用。(getRawAppData将获取所有当前注册的微应用,这里假设你的微应用是第一个)

wang-ran avatar Jan 17 '24 07:01 wang-ran

复现步骤

  1. 进入子应用页面,调用loadMicroApp加载子应用
  2. 快速切换到其他页面,这时候子应用到状态是Loading_source_code,还在加载中,突然销毁了container,所以报错:Target container with #xxx not existed while xxx loading!
  3. 返回子应用页面,重新调用loadMicroApp加载子应用,白屏,报错:Target container with #xxx not existed while xxx loading!

期望效果: 期望第3步无论如何重新唤起子应用

有一种办法可以达到你的期望,在qiankun执行前,注入 window.SINGLE_SPA_DEVTOOLS = {} ; 这一步将single-spa的devtools方法注入到了window对象里。 之后遇到这个报错是可以通过 window.SINGLE_SPA_DEVTOOLS.exposedMethods.getRawAppData()[0].status="NOT_LOADED" 重置应用的状态,在下次路由切换时即可使single-spa重新渲染改应用。(getRawAppData将获取所有当前注册的微应用,这里假设你的微应用是第一个)

我在报错的时候去调用window.SINGLE_SPA_DEVTOOLS.exposedMethods.getRawAppData()报错了,没有exposedMethods这个属性,window.SINGLE_SPA_DEVTOOLS还是最初设置的{}

yukui630 avatar Feb 18 '24 07:02 yukui630

我用的是"@umijs/plugin-qiankun": "2.37.2"

yukui630 avatar Feb 18 '24 07:02 yukui630

看了下singlespa的源码解析,

// 暴露的方法集合
// window.__SINGLE_SPA_DEVTOOLS__  single-spa在window中挂载的变量
if (isInBrowser && window.__SINGLE_SPA_DEVTOOLS__) {
  window.__SINGLE_SPA_DEVTOOLS__.exposedMethods = devtools;
}

挂载的变量之前写错了,应该是__SINGLE_SPA_DEVTOOLS__,但还是没有解决那个问题, window.__SINGLE_SPA_DEVTOOLS__.exposedMethods.getRawAppData()拿到的是[]

yukui630 avatar Feb 19 '24 02:02 yukui630

What happens?

类似这个issue的问题(https://github.com/umijs/qiankun/issues/690),复现方式是将网络调整为slowly 3G,访问子应用页面然后立即离开页面(离开的时候状态应该是Loading_source_code),会报错:Target container with #xxx not existed while xxx loading! 然后重新进入子应用页面,页面白屏,一直报:Target container with #xxx not existed while xxx loading!

最小可复现仓库

我使用的是loadMicroApp手动加载

复现步骤,错误日志以及相关配置

相关环境信息

* **qiankun 版本** 2.7.4

* **浏览器版本**:版本 120.0.6099.71(正式版本) (x86_64)

* **操作系统**:macos

我的乾坤版本是2.10.16,也出现了类似的报错,主应用侧边栏点击进入子应用时正常,子应用里的router.push进入新页面子应用执行unmunt,会有一样的报错

woshixiaobaibaiya avatar Mar 14 '24 06:03 woshixiaobaibaiya

What happens?

类似这个issue的问题(https://github.com/umijs/qiankun/issues/690),复现方式是将网络调整为slowly 3G,访问子应用页面然后立即离开页面(离开的时候状态应该是Loading_source_code),会报错:Target container with #xxx not existed while xxx loading! 然后重新进入子应用页面,页面白屏,一直报:Target container with #xxx not existed while xxx loading!

最小可复现仓库

我使用的是loadMicroApp手动加载

复现步骤,错误日志以及相关配置

相关环境信息

* **qiankun 版本** 2.7.4

* **浏览器版本**:版本 120.0.6099.71(正式版本) (x86_64)

* **操作系统**:macos

我的乾坤版本是2.10.16,也出现了类似的报错,主应用侧边栏点击进入子应用时正常,子应用里的router.push进入新页面子应用执行unmunt,会有一样的报错

woshixiaobaibaiya avatar Mar 14 '24 06:03 woshixiaobaibaiya

我遇到的问题和这个差不多,子应用正在加载时切换路由到其他页面,控制台报错 Uncaught Error: [qiankun]: Wrapper element for xxxx is not existed! 再跳转回到原来子应用路由页就显示不出来

这个问题也遇到过

你的问题解决了吗,我也遇到同样的问题

woshixiaobaibaiya avatar Mar 14 '24 09:03 woshixiaobaibaiya

复现步骤

  1. 进入子应用页面,调用loadMicroApp加载子应用
  2. 快速切换到其他页面,这时候子应用到状态是Loading_source_code,还在加载中,突然销毁了container,所以报错:Target container with #xxx not existed while xxx loading!
  3. 返回子应用页面,重新调用loadMicroApp加载子应用,白屏,报错:Target container with #xxx not existed while xxx loading!

期望效果: 期望第3步无论如何重新唤起子应用

有一种办法可以达到你的期望,在qiankun执行前,注入 window.SINGLE_SPA_DEVTOOLS = {} ; 这一步将single-spa的devtools方法注入到了window对象里。 之后遇到这个报错是可以通过 window.SINGLE_SPA_DEVTOOLS.exposedMethods.getRawAppData()[0].status="NOT_LOADED" 重置应用的状态,在下次路由切换时即可使single-spa重新渲染改应用。(getRawAppData将获取所有当前注册的微应用,这里假设你的微应用是第一个)

我在报错的时候去调用window.SINGLE_SPA_DEVTOOLS.exposedMethods.getRawAppData()报错了,没有exposedMethods这个属性,window.SINGLE_SPA_DEVTOOLS还是最初设置的{}

我这边解决方案是在调用loloadMicroApp的时候将container参数修改为具体的dom节点(而非名称),如:container: document.querySelector(#appContainer), 运行挺长一段时间了,没问题

hello-astar avatar Mar 22 '24 07:03 hello-astar

你的问题解决了吗,我也遇到同样的问题

JasminieDeng avatar May 26 '24 06:05 JasminieDeng