美文网首页
集成WEEX到已有iOS应用

集成WEEX到已有iOS应用

作者: 小觉皇free | 来源:发表于2018-04-27 11:45 被阅读0次

    通常集成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.

    解决方式:

    看到这个错误提示,就很明白了,这是需要配置HTTPS协议.打开项目中的info.plist文件,在其中添加一个字典类型的项目App Transport Security Settings,然后在其中添加一个key:Allow Arbitrary Loads,其值为YES

    3.页面部分内容(图片比较明显)没加载出来,造成这种现象的原因就是我们还没有注册完整的module,component和protocol,也就是之前在AppDelegate里注释的内容.

    相关文章

      网友评论

          本文标题:集成WEEX到已有iOS应用

          本文链接:https://www.haomeiwen.com/subject/mprblftx.html