微服务架构下前端如何统一管理多个子应用的登录状态？
我们项目用微前端拆了几个子应用，每个子应用都是独立部署的微服务，现在登录状态没法同步，用户在一个子应用登录后，切换到另一个还是未登录状态，这体验太差了。
试过把 token 存 localStorage，但跨域的子应用根本读不到；也试过主应用统一登录再传 token 给子应用，但子应用刷新页面 token 就丢了。有没有靠谱的方案？
目前主应用和子应用域名不同，比如主应用是 main.example.com，子应用是 app1.example.com、app2.example.com 这种结构。
- 2
回答
87浏览
微前端架构下如何统一收集各子应用的错误日志？
最近在用single-spa搭建微前端架构，现在想给各个Vue子应用加错误监控。我在主应用里绑定了window.onerror和window.onunhandledrejection，但发现子应用里的...
- 2
回答
91浏览
微前端应用中如何避免重复加载相同版本的公共库？
我在搭建微前端架构时发现，当多个子应用同时依赖同一版本的React， 每个子应用都会独立加载React包，导致控制台报错：React has been called from "react@18.2....
- 2
回答
31浏览
微前端中多个Vue子应用如何安全共享Vuex状态而不冲突？
我在用Single-SPA搭建微前端时遇到问题：有两个Vue子应用需要共享用户登录状态，尝试在父应用通过Vuex持久化存储，但发现状态会被另一个子应用覆盖，这是为什么呢？ 我在父应用store.js设...
- 2
回答
112浏览
微前端中子应用依赖不同React版本时如何避免冲突？
最近在用single-spa搭建微前端架构，但遇到子应用依赖不同React版本的问题。比如主应用用的是React 18，而某个子应用还用着React 17，运行时老是报错说版本不兼容，Warning:...
- 2
回答
140浏览
微前端架构下如何解决不同子应用样式冲突的问题？
我在用micro-frontends架构开发时遇到样式污染问题。主应用和子应用都用了.button类名，但子应用的样式被主应用覆盖了。 比如这个React组件： import './Button.cs...
- 2
回答
66浏览
微前端架构下多应用路由跳转如何同步状态？
我在用qiankun搭建微前端时遇到个问题，主应用和子应用之间的路由跳转老是丢失状态。比如在子应用点击标签跳转到主应用的/user/123，虽然地址栏变了但页面没更新，得手动刷新才行。 我尝试在子应用...
- 2
回答
47浏览
微前端架构下子应用路由跳转会触发主应用刷新怎么办？
最近在用qiankyun搭建微前端项目，遇到个奇怪的问题：主应用用react-router管理路由，子应用用了vue-router，当子应用内部跳转路径时（比如从/about到/contact），整个...
- 2
回答
79浏览
微前端子应用间如何避免缓存数据互相污染？
在使用qianky微前端架构时，遇到两个子应用都用了localStorage缓存用户信息，但登录状态会互相覆盖。比如主应用登录后，子应用的用户信息却显示为空： const UserContext = ...
- 1
回答
14浏览
微前端子应用调试时如何查看props传递是否正确？
最近在用qiankun搭微前端，主应用向子应用传了一些初始化参数，但子应用里拿不到，控制台也没报错，根本不知道是没传过去还是子应用没接收到。我试过在子应用的mount函数里打印props，但有时候是空...
- 1
回答
42浏览
微前端子应用如何共享主应用的全局状态？
我在用 qiankun 搭微前端，主应用用的是 Vuex，现在子应用也想读写主应用 store 里的用户信息，但不知道怎么安全地共享。试过把 store 挂到 window 上，但感觉不靠谱，而且 T...
具体来说，你可以设置一个身份验证服务器来处理所有的认证请求。主应用和子应用都通过这个身份验证服务器进行登录。用户在主应用登录后，身份验证服务器会颁发一个 JWT（JSON Web Token），这个 token 可以在子应用间安全地传递。
为了实现跨域共享 token，可以使用 cookie 来存储 token，并设置
SameSite=None和Secure标志，这样浏览器会在跨域请求时携带 cookie。但是要注意，这种方法在某些情况下可能会有安全风险，所以需要仔细配置 CORS（跨域资源共享）策略。另一种方案是使用 URL 参数或者 postMessage API 来在子应用之间传递 token。不过这种方法相对复杂，且不如使用 cookie 方便和安全。
在实现过程中，务必参考 OAuth2 或 OpenID Connect 的官方文档，遵循最佳实践，确保系统的安全性和可靠性。