功能说明

frontend-gray插件实现了前端用户灰度的的功能，通过此插件，不但可以用于业务A/B实验，同时通过可灰度配合可监控,可回滚策略保证系统发布运维的稳定性。

运行属性

插件执行阶段：认证阶段 插件执行优先级：450

配置字段

名称数据类型填写要求默认值描述
grayKeystring非必填-用户ID的唯一标识，可以来自Cookie或者Header中，比如 userid，如果没有填写则使用rules[].grayTagKey和rules[].grayTagValue过滤灰度规则
graySubKeystring非必填-用户身份信息可能以JSON形式透出，比如：userInfo:{ userCode:”001” },当前例子graySubKey取值为userCode
rulesarray of object必填-用户定义不同的灰度规则，适配不同的灰度场景
rewriteobject必填-重写配置，一般用于OSS/CDN前端部署的重写配置
baseDeploymentobject非必填-配置Base基线规则的配置
grayDeploymentsarray of object非必填-配置Gray灰度的生效规则，以及生效版本

rules字段配置说明：

名称数据类型填写要求默认值描述
namestring必填-规则名称唯一标识，和deploy.gray[].name进行关联生效
grayKeyValuearray of string非必填-用户ID 白名单列表
grayTagKeystring非必填-用户分类打标的标签key值，来自Cookie
grayTagValuearray of string非必填-用户分类打标的标签value值，来自Cookie

rewrite字段配置说明：

indexRouting首页重写和fileRouting文件重写，本质都是前缀匹配，比如/app1: /mfe/app1/{version}/index.html代表/app1为前缀的请求，路由到/mfe/app1/{version}/index.html页面上，其中{version}代表版本号，在运行过程中会被baseDeployment.version或者grayDeployments[].version动态替换。

{version} 作为保留字段，在执行过程中会被baseDeployment.version或者grayDeployments[].version动态替换前端版本。

名称数据类型填写要求默认值描述
hoststring非必填-host地址，如果是OSS则设置为 VPC 内网访问地址
notFoundUristring非必填-404 页面配置
indexRoutingmap of string to string非必填-用于定义首页重写路由规则。每个键 (Key) 表示首页的路由路径，值 (Value) 则指向重定向的目标文件。例如，键为 /app1 对应的值为 /mfe/app1/{version}/index.html。生效version为0.0.1， 访问路径为 /app1，则重定向到 /mfe/app1/0.0.1/index.html。
fileRoutingmap of string to string非必填-用于定义资源文件重写路由规则。每个键 (Key) 表示资源访问路径，值 (Value) 则指向重定向的目标文件。例如，键为 /app1/ 对应的值为 /mfe/app1/{version}。生效version为0.0.1，访问路径为 /app1/js/a.js，则重定向到 /mfe/app1/0.0.1/js/a.js。

baseDeployment字段配置说明：

名称数据类型填写要求默认值描述
versionstring必填-Base版本的版本号，作为兜底的版本

grayDeployments字段配置说明：

名称数据类型填写要求默认值描述
versionstring必填-Gray版本的版本号，如果命中灰度规则，则使用此版本。如果是非CDN部署，在header添加x-higress-tag
backendVersionstring必填-后端灰度版本，会在XHR/Fetch请求的header头添加 x-mse-tag到后端
namestring必填-规则名称和rules[].name关联，
enabledboolean必填-是否启动当前灰度规则

配置示例

基础配置

  1. grayKey: userid
  2. rules:
  3. - name: inner-user
  4.   grayKeyValue:
  5.   - ‘00000001’
  6.   - ‘00000005’
  7. - name: beta-user
  8.   grayKeyValue:
  9.   - ‘00000002’
  10.   - ‘00000003’
  11.   grayTagKey: level
  12.   grayTagValue:
  13.   - level3
  14.   - level5
  15. baseDeployment:
  16.   version: base
  17. grayDeployments:
  18.   - name: beta-user
  19.     version: gray
  20.     enabled: true

cookie中的用户唯一标识为 userid，当前灰度规则配置了beta-user的规则。

当满足下面调试的时候，会使用version: gray版本

  • cookie中userid等于00000002或者00000003
  • cookie中level等于level3或者level5的用户

否则使用version: base版本

用户信息存在JSON中

  1. grayKey: appInfo
  2. graySubKey: userId
  3. rules:
  4. - name: inner-user
  5.   grayKeyValue:
  6.   - ‘00000001’
  7.   - ‘00000005’
  8. - name: beta-user
  9.   grayKeyValue:
  10.   - ‘00000002’
  11.   - ‘00000003’
  12.   grayTagKey: level
  13.   grayTagValue:
  14.   - level3
  15.   - level5
  16. baseDeployment:
  17.   version: base
  18. grayDeployments:
  19.   - name: beta-user
  20.     version: gray
  21.     enabled: true

cookie存在appInfo的JSON数据，其中包含userId字段为当前的唯一标识 当前灰度规则配置了beta-user的规则。 当满足下面调试的时候，会使用version: gray版本

  • cookie中userid等于00000002或者00000003
  • cookie中level等于level3或者level5的用户

否则使用version: base版本

rewrite重写配置

一般用于CDN部署场景

  1. grayKey: userid
  2. rules:
  3. - name: inner-user
  4.   grayKeyValue:
  5.   - ‘00000001’
  6.   - ‘00000005’
  7. - name: beta-user
  8.   grayKeyValue:
  9.   - ‘00000002’
  10.   - ‘00000003’
  11.   grayTagKey: level
  12.   grayTagValue:
  13.   - level3
  14.   - level5
  15. rewrite:
  16.   host: frontend-gray.oss-cn-shanghai-internal.aliyuncs.com
  17.   notFoundUri: /mfe/app1/dev/404.html
  18.   indexRouting:
  19.     /app1: ‘/mfe/app1/{version}/index.html’
  20.     /: ‘/mfe/app1/{version}/index.html’,
  21.   fileRouting:
  22.     /: ‘/mfe/app1/{version}’
  23.     /app1/: ‘/mfe/app1/{version}’
  24. baseDeployment:
  25.   version: base
  26. grayDeployments:
  27.   - name: beta-user
  28.     version: gray
  29.     enabled: true

{version}会在运行过程中动态替换为真正的版本

indexRouting：首页路由配置

访问 /app1, /app123,/app1/index.html, /app1/xxx, /xxxx 都会路由到’/mfe/app1/{version}/index.html’

fileRouting：文件路由配置

下面文件映射均生效

  • /js/a.js => /mfe/app1/v1.0.0/js/a.js
  • /js/template/a.js => /mfe/app1/v1.0.0/js/template/a.js
  • /app1/js/a.js => /mfe/app1/v1.0.0/js/a.js
  • /app1/js/template/a.js => /mfe/app1/v1.0.0/js/template/a.js