一、概念

用来指定如何在app内部实现页面跳转

二、使用场景

• 端外拉起app后，跳转到指定页面

• 端内跳转到指定页面

• h5、native、rn不同的页面之间都可以互相跳转、传递参数

image.png

三、目标

• 一个UI页面与一个uri关联，用Uri替代我们的页面。

• 跳转的时候就不需要强依赖UI页面去做匹配，而只需要通过一段字符串去匹配就行

• 实现页面之间的解耦、跳转、传参

四、优缺点分析

和传统native路由跳转相比较：

• 简单易读。通过字符串实现跳转页面并传参

• 页面解耦。实现页面间完全解耦

• 灵活性强。可通过动态下发不同的字符串，动态控制跳转的逻辑

• 参数有限制。不支持复杂的数据格式

• 依赖客户端路由模块的实现

五、技术调研

动态路由方案

• android

https://juejin.cn/post/7169017197442891806

• iOS

https://juejin.cn/post/7087875341460439071

六、方案内容

6.1、Uri格式

整体参考uri的格式

基本格式 = protocol://hostname/path = 协议://主机地址/路径

image.png

• protocal: 协议头，对应吊起app的协议scheme,用于端外，吊起app

• hostname/path： 域名和路径，用来指定页面形态，native、hrn、h5

• query： 参数。注意：只支持字符串格式。不包含端口号

  • pName： 页面名称

  • 容器参数：设置容器的初始化参数

  • rcName: rn中指定页面的入口组件

  • 业务参数： 页面内部使用的参数

示例：

app外

protocol://protal/containerType?pName=pageA&query=1

• 端外打开native页面：

  • scheme://protal/native?pName=pageA&query

• 端外打开rn页面：

  • scheme://protal/hrn?pName=pageA&query=a&aaa=2&vvv=3

• 端外打开h5页面：

  • scheme://protal/h5?url=https://www.baidu.com&id=1

app内

• rn跳rn， h5跳rn

image.png

• rn跳native，h5跳native

image.png

• rn跳h5

image.png

6.2、参数

query信息分为三部分：

• pName：页面名称【必填】

• 给容器使用的参数：指定容器的一些行为. 所有字段使用rnc开头

• 业务参数： 业务内部使用

 protal/hrn?pName=pageA&rncDegradeUrl=www.baidu.com
protal/hrn?pName=pageA&rncDegradeUrl=www.baidu.com&rncDegradeVersion=1.0.0&rncTransparent=1&rcName=index&id=123&name=zhangsan  

6.2.1、容器参数

query参数预留字段，指容器使用的字段：

预留字段命名规范：尽量避免和业务参数重名，推荐添加rn前缀 rnc react-native-container 和 react-native-config的简写

native需要的参数（技术文档：

https://alidocs.dingtalk.com/i/nodes/XPwkYGxZV3RP27rAFjoLwyaGWAgozOKL?utm_scene=team_space&utm_source=dingdoc_doc&utm_medium=dingdoc_doc_plugin_card

https://alidocs.dingtalk.com/i/nodes/m9bN7RYPWdlGzr1OUl0o9YqAWZd1wyK0?utm_scene=team_space&utm_source=dingdoc_doc&utm_medium=dingdoc_doc_plugin_card）

<colgroup><col width="176"><col width="176"><col width="176"><col width="176"><col width="176"></colgroup>

6.2.2、参数的数据格式

下表为支持的数据格式，以及对应的简写，

只支持基本数据格式，不支持数组、字典等复杂的结构

示例：

比如需要往目标页面pageA传递三个参数：

• id：数字类型，1234535

• name：字符串类型,zhangsan

最终的跳转链接如下：

protal/native?pName=pageA&id=I_1234535&name=S_zhangsan

6.2.3、参数处理逻辑

除pName、rcName、rnc开头的参数，其它参数传递到rn页面内

6.2.4、当前app的现状

• 暂无通用路由模块，主要以硬编码实现跳转为主。

• 有全页面触达逻辑，

  • 需要提前配置好，只支持配置好的页面

6.2.5、rn中页面跳转逻辑

image.png

• Android现在的架构设计，对路由跳转有何影响

• Android实现页面跳转逻辑的实现是怎么样的，和通用路由协议是否有冲突的地方

  • 是否必须使用全页面触达，如果不通过全页面触达是否有影响

  • 除了全页面触达的逻辑，还有没有实现页面跳转的写法

• 全页面触达对通用路由协议的影响和相互之间的关系应该是怎么样的

七、风险

• 安全性

八、收益

• 页面解耦

• 跳转逻辑更灵活可控，可动态配置

• 能力拓展：开关系统开关系统设计方案

九、方案评估结论

十、人员、排期