Weex在iOS端的加载流程与一些问题

开篇

年后换工作开始接手Weex,开贴记录下Weex相关的知识。本篇文章主要介绍一下WeexSDK在原生项目中大致的加载顺序,从项目的启动到界面渲染结束所走的主要流程。后续会放上项目中遇到的更多问题。
项目的启动顺序

AppDelegate 在
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions

中设置入口页
比如:ActiveViewController
在ActiveViewController中 根据APP是否初次安装,判断安装引导页、启动页

启动页结束后 启动WeexSDK
[WeexSDKManager setup];

之后根据是否有手势密码和登陆状态判断是否显示密码验证页面。
WeexSDKManager 启动页面的设置

初始化WeexSDK handler、module、componet组件的注册。(在这里暴露自己封装的相关的=module、componet组件名称供Weex调用)

项目入口WXRootViewController

根据自己的调试需要设置.js文件的加载路径,然后传入加载需要的url进入设置的Controller,在这里进行页面的适配,url的渲染进行加载拿到的url,以此为真正的入口进入到WeexSDK源码中。

    [[UIApplication sharedApplication] delegate].window.rootViewController = [[WXRootViewController alloc] initWithRootViewController:demo];

设置WXRootViewController 在WXRootViewController加载url时设置

- (id)initWithSourceURL:(NSURL *)sourceURL
{
    WXBaseViewController *baseViewController = [[WXBaseViewController alloc]initWithSourceURL:sourceURL];
    
    return [super initWithRootViewController:baseViewController];
}
WXBaseViewController

作为BaseViewController 每次页面渲染都会进入到当前页面,我们在页面中设置iPhone X的适配等,并且根据不同的需要手动对特定的页面进行刷新渲染(举例:以通知的形式刷新页面,或者根据某个.js文件的名称对刷新操作做处理)。
并由此对 进行 _instance = [[WXSDKInstance alloc] init];进入具体的网址渲染操作。

WXSDKInstance 加载与源码修改设置

WXSDKInstance的加载与设置主要通过下列三个方法进行,拿到的url进行加载然后对url根据我们不同的需要进行设置,渲染成功之后,根据需要添加我们需要的操作

- (void)renderWithURL:(NSURL *)url options:(NSDictionary *)options data:(id)data;
- (void)_renderWithRequest:(WXResourceRequest *)request options:(NSDictionary *)options data:(id)data{
/*******  这里进行加载方式的路径切换  ******/
//    //如果加载的是本地包
//    NSURL *url;
//    if ([request.URL.absoluteString containsString:[NSBundle mainBundle].bundlePath]) {
//        url = request.URL;
//    }else{
//        url = [NSURL URLWithString:[self fileWithString:request.URL.absoluteString]];
//    }
//    request.URL = url;
    
    //如果加载的是线上的
        NSURL *url = request.URL;

...

}

- (void)_renderWithMainBundleString:(NSString *)mainBundleString{

...

   [WXSDKEngine registerDefaults];
   [[NSNotificationCenter defaultCenter] postNotificationName:WX_SDKINSTANCE_WILL_RENDER object:self];//渲染即将完成的标识
....
//需要在加载完成之后进行个人操作
....


}

至于 自定义 module与Component 扩展 官方给了详细的介绍

项目中的问题:

1.APP杀死软件收到url形式的通知,点击无法打开对应的网址

收到推送消息之后以通知的形式发送给Weex前端,来用来控制页面的跳转。

    省略代码...
   if (userInfo[@"url"]) {
        NSDictionary * item = @{
                                @"param":userInfo
                                };
        [[NSNotificationCenter defaultCenter] postNotificationName:@"push_moudle" object:self userInfo:item];
    }

当软件是启动状态是,收到推送发送通知,页面正常跳转,APP杀死的情况下,由于打开APP直接走AppDelegate中的

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions

进行发送通知,此时WeexSDK尚未启动成功,所以Weex尚未注册通知成功,无法进行对应的跳转。
解决方案:在WXSDKInstance渲染加载结束之后,做2-3秒的延迟,拿到收到的远程推送发送推送消息,此时WeexSDK已启动成功收到推送消息

2.由Weex页面进入到H5页面或原生界面,返回之后Weex页面不刷新

在WXBaseViewController中进行设置根据不同的需求设置方式大致分为两种

  • 在生命周期将要出现的时候判断如果包含某个特定的.js文件对当前页面进行刷新
-(void)viewWillAppear:(BOOL)animated{
    [super viewWillAppear:animated];
    if ([self.navigationController isKindOfClass:[WXRootViewController class]]) {
        [self.navigationController setNavigationBarHidden:YES animated:YES];
    }
    if ([_sourceURL.absoluteString containsString:@"myWeb.js"]) {
        [self _renderWithURL:_sourceURL];
    }
}
  • 通知方式刷新界面,收到通知重新渲染界面调用如下方法
[self _renderWithURL:_sourceURL];

3.线上打包与本地打包

线上打包:包括测试环境下的本地起服务加载与正式的线上加载,主要特点是不依赖本地的Views文件,实现热更新,加载的内容由线上网址返回的.js文件决定。主要入口是本地bundlejs文件下的index.js文件。页面的显示的前提是必须有线上服务或者有本地服务在运行。
在WXSDKInstance中

- (void)_renderWithRequest:(WXResourceRequest *)request options:(NSDictionary *)options data:(id)data;
  //直接渲染网络url
    request.URL = url;
    .....
}

本地打包:不依赖于线上的网址,将项目中用到的.js文件所在的Views文件夹放到项目中,对文件的加载路径进行处理,直接由index.js作为入口访问,本地Views文件夹下的.js文件实现页面的加载。不需要起本地服务于线上服务的运行。
在WXSDKInstance中

- (void)_renderWithRequest:(WXResourceRequest *)request options:(NSDictionary *)options data:(id)data;
方法中 

  //如果加载的是本地包
    NSURL *url;
    if ([request.URL.absoluteString containsString:[NSBundle mainBundle].bundlePath]) {
        url = request.URL;
    }else{
        url = [NSURL URLWithString:[self fileWithString:request.URL.absoluteString]];
    }
    request.URL = url;
    .....
}
//路径处理
-(NSString*)fileWithString:(NSString*)str{
    str = [str componentsSeparatedByString:@"?"].firstObject;
    NSString* string = [NSString stringWithFormat:@"file://%@%@",[NSBundle mainBundle].bundlePath,str];
    if ([string containsString:@"dist/"]) {
        string = [string stringByReplacingOccurrencesOfString:@"dist" withString:@"bundlejs"];
    }
    return string;
}

后记

Weex一定程度上减少了原生的开发工作量,但是也有许多需要与原生交互的东西,作为第一篇记录一下,以后有时间持续更新,希望分享更多Weex相关的内容。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 206,013评论 6 481
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 88,205评论 2 382
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 152,370评论 0 342
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 55,168评论 1 278
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 64,153评论 5 371
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,954评论 1 283
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,271评论 3 399
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,916评论 0 259
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 43,382评论 1 300
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,877评论 2 323
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,989评论 1 333
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,624评论 4 322
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,209评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,199评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,418评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,401评论 2 352
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,700评论 2 345