QRN 3.0 scheme

注: QRN 3.0 版本兼容了 2.x 版本已有的 scheme 处理方式,但我们还是建议你修改成新版 scheme 的处理方式。

此处介绍 RN 相关的 Scheme。结构如下:

<应用名>://<一级路径>/<二级路径>?<参数>

1. 应用名

独立客户端自己定义,大客户端统一为qunarphone

2. 一级路径

必须是 react

3. 二级路径

必须是 openbiz。后面会详讲。

4. 参数

约定如下:

  • hybridId:必写,字符串
  • pageName: 可选,字符串,初始页面或者初始模块
  • initProps:可选,对象编码后的字符串,初始化参数 (请一定记得对其内容进行 encode)

关于 initProps 补充几点:

  1. 编码方法:encodeURIComponent(JSON.stringify(obj))
  2. 实际上,pageNameinitProps 的一个属性
  3. 通过 scheme 方式打开的页面默认都不共享上级页面的 store,如需要共享,则可在 initProps 中添加 isQRCTShareStore: true,这样就可以共享啦~
  4. 如果要给打开的页面传参并且要在 actived 回调中获取到,须在 initProps.param 下添加数据
  5. 如果你想通过 scheme 打开一个透明容器,则在 initProps 中添加 bgNeedClear: true 就可以了

例如发送以下 Scheme:打开一个不透明容器

qunariphone://react/open?hybridId=xx&pageName=pageA&initProps=%7B%22param%22%3A%7B%22age%22%3A18%7D%7D

再例如发送以下 Scheme: 打开一个透明容器

qunariphone://react/open?hybridId=xx&pageName=pageA&initProps%3D%7B%22param%22%3A%7B%22age%22%3A18%7D%2C%22bgNeedClear%22%3Ature%7D

会打开 xx 业务的 pageA 页面,pageA 可以在 ready() 回调中通过 this.props.param 或在 actived(param) 回调中通过参数 param 获取 Scheme 中的参数 {age: 18}

下面详细介绍二级路径的两种写法,openbiz

open 型

举例:

qunariphone://react/open?hybridId=xx&pageName=pageA&initProps=%7B%22usr%22%3A%22wyy%22%7D

这种 Scheme 会发送给 Native 处理,强制新开页面。一般新开页面都通过这种方式。

biz 型

举例:

qunariphone://react/biz?hybridId=xx&pageName=pageA&initProps=%7B%22usr%22%3A%22wyy%22%7D

这种 Scheme 会发送给前端(js 环境)处理,前端通过监听 receiveScheme 来接收。

如果使用了 Ext,那么 biz 型 Scheme 的参数除了上面介绍的 3 个之外,还额外接受两个可选参数,如下:

  • ext:可选,布尔值,是否让 ext 接受 Scheme 并处理,默认为 true
  • forceOpen:可选,布尔值,是否强制新开页面,默认为 false

发送 Scheme

Ext.Router.Bridge 写法

sendScheme(
    {
        // 地址
        url: '',
        // 安卓透明层标识(只有安卓才有)
        adrToken: '',
        // 数据
        data: {}
    },
    (res) => {
        // 发送后的回调
        res = {
            // 是否成功
            ret: true,
            // 数据
            data: {}
        };
    }
);

// API 兼容性:iOS:80011295 Android:60001538 QRN:v5.7.4(qrn升级前项目) v6.1.2(qrn升级后项目)
sendDeepLinkOrScheme(
    {
        deepLink: '',
        // 地址
        url: '',
        // 安卓透明层标识(只有安卓才有)
        adrToken: '',
        // 数据
        data: {}
    },
    (res) => {
        // 发送后的回调
        res = {
            // 是否成功
            ret: true,
            // 数据
            data: {},
            errMessage: '' //仅回调失败的时候有
        };
    }
);
发送 Scheme data 可选参数

以下参数不可以同时设置,生效优先级:hasAdrPopThenPush>needTrans>disableAnim

Prop Type Default Note
needTrans Boolean true 是否需要转场动画,默认值是水平动画
disableAnim Boolean false (Android 特有)是否去掉转场动画 api 调用,适用于打开透明 Acitivity 处理逻辑又直接关闭回到当前页面的场景
adrPopThenPush Boolean false (Android 特有)支持 popThenPush 功能,意即打开新 Activity 的时候关闭当前 Activity,由于 RN 渲染的时延,需要 View 被推入的时候再关闭当前 Activity(sendDeepLinkOrScheme 不支持该参数)

介绍下其他环境下发送 Scheme 的方式:

HY

通过链接或修改 url 跳转

Native

@interface JumpHandle : NSObject
/**
 *  通过URL和urlData来调用界面
 *
 *  @param url          跳转到的URL,通常为 qunariphone://hotel/xxx 的形式
 *  @param urldata      处理URL所需使用的数据
 *  @param responseDelg 回调对象
 *  @param userInfo     自定义对象
 *
 *  @return 返回是否有模块接受该URL并进行处理,处理URL可能是异步的,不能保证线程安全
 */
+ (BOOL)jumpHandleOpenURL:(NSURL *)url
              withUrlData:(NSDictionary *)urldata
             responseDelg:(id<JumpHandleResponsePrt>)responseDelg
                 userInfo:(id)userInfo;
@end

接收 Scheme

只有 biz 型的 Scheme 才能被前端接收到(对应的 JS context 当然必须存在)。

// 添加监听
let listener = DeviceEventEmitter.addListener('receiveScheme', (res) = {
    res = {
        // 地址
        url: '',
        // 数据
        data: {},
        // 安卓透明层标识(只有安卓才有)
        adrToken: '',
        // 回调标识
        callbackId: '',
    }
});
// 移除监听
listener.remove();

如果发送 Scheme 时没有 data,那么 Native 会将 url 后的参数变为 data

Ext 会默认接收 Scheme 并进行处理,逻辑如下:

  1. 解析 url 后的参数添加进 data(已有则覆盖);
  2. 如果 data.extfalse,那么退出处理;
  3. 如果 data.forceOpentrue,则强制新开,否则同 Router.goto() 的逻辑。

原文链接