集成WEEX到已有iOS应用

通常集成SDK,建议大家先去对应官网教程学习.其他平台上看到的教程可能已经过时了,对应的是旧版的SDK,官网上一定是最新的.这里我主要分享下按官方文档集成之后遇到的其他问题.

官方链接:集成 Weex 到已有应用 | Weex

官方提供了两种集成方式,cocoapod和手动导入.我这里选用了手动导入的方式.

首先按照官方文档,你已经成功build了WeexSDK.framework,导入了需要的依赖库,并添加了-Objc在Other Linker Flags里.然后的步骤

添加 js-framework 到自己的 main bundle

1.我们选择项目的BuildPhases,在Copy Bundle Resources里点+添加.

2.选择Add Other...,假如你已经把WeexSDK.framework拖入了你的项目.进入项目目录的WeexSDK.framework,选择native-bundle-main.js和weex-main-jsfm.js添加.

image

编写必要的代码

官方demo里的代码很多,这里我们先写必要的,写完之后能加载出测试js即可.

首先是AppDelegate里的代码

在 didFinishLaunchingWithOptions 方法中如下添加

[WXAppConfiguration setAppGroup:@"AliApp"]; 
[WXAppConfiguration setAppName:@"WeexDemo"];
[WXAppConfiguration setAppVersion:@"1.0.0"];    
//init sdk environment                            
[WXSDKEngine initSDKEnvironment];            
//register custom module and component，optional
//    [WXSDKEngine registerComponent:@"MyView" withClass:[MyViewComponent class]]; 
//    [WXSDKEngine registerModule:@"event" withClass:[WXEventModule class]];
//register the implementation of protocol, optional 
//    [WXSDKEngine registerHandler:[WXImgLoaderDefaultImpl new] withProtocol:@protocol(WXNavigationProtocol)];    
//set the log level
[WXLog setLogLevel: WXLogLevelError];

中间被注释掉的内容也很重要,但都是可选项.注意logLevel设置成WXLogLevelError,官方文档上的是WXLogLevelAll,那样的话会log各种内容,不利于我们集成初期排查问题.

然后新建一个ViewController

放入代码

self.instance = [[WXSDKInstance alloc] init];
self.instance.viewController = self;                       
self.instance.frame = self.view.frame;                         
[self.instance renderWithURL:self.url options:@{@"bundleUrl":[self.url absoluteString]} data:nil];                                           
__weak typeof(self) weakSelf = self;               
self.instance.onCreate = ^(UIView *view) {        
    [weakSelf.weexView removeFromSuperview];
    weakSelf.weexView = view;
    weakSelf.weexView.backgroundColor = [UIColor whiteColor];
    [weakSelf.view addSubview:weakSelf.weexView];                           };                                                                         
self.instance.onFailed = ^( NSError *error) {                      
    NSLog(@"处理失败%@", error);                                                  
};                                                                  
self.instance.renderFinish = ^(UIView *view) {                  
    NSLog(@"渲染完成");                                                                   
};

- (void)dealloc{                                                                   
      [_instance destroyInstance];                                                    
}

这里的url就是你要加载的js路径,比如说本地路径

_url = [NSURL URLWithString:[NSString stringWithFormat:@"file://%@/hehe.js",[NSBundle mainBundle].bundlePath]];

至此就可以运行啦

可能出现的问题

1.运行后控制台log错误日志:[error]WXMonitor.m:250, [WX_KEY_EXCEPTION_SDK_INIT_JSFM_INIT_FAILED] script don't exist:(null)

解决方式:

在项目BuildPhases的Copy Bundle Resources添加weex-main-jsfm.js,weex-main-jsfm.js的位置在WeexSDK.framework中.

2.加载出的js页面只显示标题,并有错误提示:App Transport Security has blocked a cleartext HTTP (http://) resource load since it is insecure. Temporary exceptions can be configured via your app’s Info.plist file.