vue iframe嵌套f5刷新页面空白

img

img


页面菜单点击都能显示,但是手动刷新页面空白,看dom显示,刷新后主应用好像直接没有加载,直接加载的是iframe地址的页面

回答不易,求求您采纳点赞哦 感激不尽

如果您在 Vue 中使用 iframe 嵌套页面,并且在手动刷新页面时遇到空白页面,可能有以下原因:

  • iframe 加载页面缓存。当您在浏览器中手动刷新页面时,浏览器可能会从缓存中加载 iframe 页面,而不是重新请求服务器上的页面。您可以尝试清除浏览器缓存,然后再次刷新页面。

  • iframe 页面加载超时。当 iframe 加载的页面非常慢或者超时时,可能会导致空白页面。您可以尝试增加 iframe 加载页面的超时时间,或者在加载时显示加载中的提示信息,以提高用户体验。

  • iframe 加载的页面存在跨域问题。如果 iframe 加载的页面和主应用不在同一个域名下,可能会存在跨域问题。您可以尝试在 iframe 加载页面的服务器上设置合适的跨域策略,或者将 iframe 加载页面和主应用部署在同一个域名下。

  • Vue-router 路由配置问题。如果您使用 Vue-router 管理路由,可能需要在路由配置中添加路由刷新机制,以确保手动刷新页面时能够正确加载应用。

  • 主应用和 iframe 页面的页面渲染机制不同。可能是主应用和 iframe 页面使用的页面渲染机制不同,例如主应用使用 Vue,而 iframe 页面使用 React。您可以尝试在 iframe 页面中使用 Vue 或者与主应用相同的渲染机制,以确保两个页面的兼容性。

这些是造成 Vue iframe 嵌套页面手动刷新后空白的常见原因。您可以根据具体情况逐一排查,以便解决问题。

不知道你这个问题是否已经解决, 如果还没有解决的话:

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^