aws 开源的微前端发现实现 frontend-discovery

实际上此协议已经开放一段时间了(一年左右),里边一些实践还是很不错的,对于微前端实现的同学可以参考学习
同时官方也提供了一个基于aws 服务的参考实践,作者的一些演讲也是值得学习的

参考格式

如下图,可以看到包含了一些不错的设计,以及对于实际的部署维护,包含了元数据,多版本,fallback,一致性检查
以及包含了实际部署多版本共存的流量处理

 
{
  "schema": "https://mfewg.org/schema/v1-pre.json",
  "microFrontends": {
    "@my-project/catalog": [
      {
        "url": "https://static.website.com/my-catalog-1.3.5.js",
        "fallbackUrl": "https://alt-cdn.com/my-catalog-1.3.5.js",
        "metadata": {
          "integrity": "e0d123e5f316bef78bfdf5a008837577",
          "version": "1.3.5"
        },
        "extras": {
          "modulefederation": {
            "prefetch": ["@my-project/myaccount"]
          }
        }
      }
    ],
    "@my-project/myaccount": [
      {
        "url": "https://static.website.com/my-account-1.2.2.js",
        "fallbackUrl": "https://alt-cdn.com/my-account-1.2.2.js",
        "metadata": {
          "integrity": "e0d123e5f316bef78bfdf5a008837577",
          "version": "1.2.2"
        },
        "deployment": {
          "traffic": 30,
          "default": false
        }
      },
      {
        "url": "https://static.website.com/my-account-2.0.0.js",
        "fallbackUrl": "https://alt-cdn.com/my-account-2.0.0.js",
        "metadata": {
          "integrity": "e0d123e5f316bef78bfdf5a008837577",
          "version": "2.0.0"
        },
        "deployment": {
          "traffic": 70,
          "default": true
        }
      }
    ]
  }
}

说明

frontend-discovery 是一个挺不错的是实践,值得参考学习下,功能上与opencomponents 有一些类似的,当然opencomponents 提供的是一个比较完整的
微前端组件化方案,对于frontend-discovery的参考实现frontend-discovery-service 利用了不少aws 的服务

参考资料

https://github.com/awslabs/frontend-discovery
https://github.com/awslabs/frontend-discovery-service
https://github.com/opencomponents/oc
https://opencomponents.github.io/

posted on 2023-07-01 08:45  荣锋亮  阅读(31)  评论(0编辑  收藏  举报

导航