iOS H5免登陆，同步APP登陆状态，OC和JS交互-白红宇

需求分析

APP某个页面嵌入H5页面，当前H5页面拥有登陆状态。在此之前，用户进入本页面，即使用户在登陆状态，依然显示未登陆，所以需要把APP的登陆状态传给H5，达到免登陆目的。

下面的截图是我们APP的活动页面

目前JS与OC相互调用的方式

目前主要的JS与OC相互调用方式主要有如下6种：

在JS 中做一次URL跳转，然后在OC中拦截跳转。（这里分为UIWebView 和 WKWebView两种，UIWebView兼容iOS 6）

利用WKWebView 的MessageHandler。

利用系统库JavaScriptCore，来做相互调用。（iOS 7推出）

利用第三方库WebViewJavascriptBridge。

利用第三方cordova库，以前叫PhoneGap。（这是一个库平台的库）

当下盛行的React Native。

初步考虑，App兼容iOS7选择JavaScriptCore方式，App只兼容iOS8以上，可以采用WKWebView，并使用MessageHandler方式。

因为我们前端H5采用的是把登陆状态token存放在session Storage里面，采用第二种方式是最简洁方便的。可能有些前端是从URL传登陆状态值的，那这种方式就更简单了，只要把请求URL拼接上APP登陆token（以上两种情况需要后端把APP和H5端登陆信息做统一接口才能最终达到目的。）

好了废话不多说，上代码

先创建webview然后进行偏好设置configuration

- (void)viewDidLoad {    [super viewDidLoad];    self.view.backgroundColor = UIColorFromRGB(0xf3f6f6);    //添加登陆通知，防止APP端未登陆状态，在后面的代理对h5登陆做拦截处理，回调原生APP的登陆方式，    //然后通过通知方式来重载本页面    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(uerislogin) name:@"userIsLogin" object:nil];    JMUserInfoModel *userInfo = [JMLoginManager getInfo];//这是我的本地登陆信息        //进行偏好设置，把token传到session里面去。    WKWebViewConfiguration * configuration = [[WKWebViewConfiguration alloc] init];    _userContent = [[WKUserContentController alloc] init];        //关键的地方来了，这一步是对session添加token信息，就算目前APP未登陆状态，传入空字符串也是没关系，    //后面通知重载页面会重新注入信息。    NSString * js = [NSString stringWithFormat:@"window.sessionStorage.setItem('token','%@')",userInfo.user_token];    WKUserScript * userScript = [[WKUserScript alloc]initWithSource:js injectionTime:WKUserScriptInjectionTimeAtDocumentStart forMainFrameOnly:NO];    [_userContent addUserScript:userScript];    configuration.userContentController = _userContent;            //注意要在创建webview的时候就要把偏好设置给初始化configuration    _webView = [[WKWebView alloc]initWithFrame:CGRectMake(0, 0, DEVICE_WIDTH, DEVICE_HEIGHT- JMHeightGap) configuration:configuration];    _webView.backgroundColor = [UIColor whiteColor];    _webView.UIDelegate = self;    _webView.navigationDelegate = self;    [_webView addObserver:self forKeyPath:@"title" options:NSKeyValueObservingOptionNew context:NULL]; //添加观察者模式 更换标题        NSString *url = [NSString stringWithFormat:@"https://www.jumifinance.com/h5/views/wheel/wheel.html"];    NSURL *weburl =[[NSURL alloc] initWithString:url];    NSURLRequest *request =  [[NSURLRequest alloc] initWithURL:weburl];    [self.webView loadRequest:request];        [self.view addSubview:self.webView];}复制代码

在代理里面对H5页面的登陆按钮进行拦截

#pragma mark - UIWebViewDelegate-(void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler{    NSString *url = [navigationAction.request.URL.absoluteString stringByReplacingPercentEscapesUsingEncoding:NSUTF8StringEncoding];        NSLog(@"请求拦截===== %@",url);    //对请求url进行字符串匹配，如果请求链接里有登陆请求，进行拦截    if ([url rangeOfString:@"common/login.html"].location != NSNotFound) {//UIAlertView *alertView = [[UIAlertView alloc] initWithTitle:@"方式一" message:@"这是OC原生的弹出窗" delegate:self cancelButtonTitle:@"收到" otherButtonTitles:nil];//[alertView show];        //调用原生登陆接口        [[JMLoginManager shareLogin] loginAction];        decisionHandler(WKNavigationActionPolicyCancel);    }else    {        decisionHandler(WKNavigationActionPolicyAllow);    }    }复制代码

下面代码是修改title的kvo，不需要的可以忽略

/** 获取H5页面 当前页面的标题  @param keyPath key @param object  对象 @param change 。。 @param context 内容 */- (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context {    if ([keyPath isEqualToString:@"title"])    {        if (object == self.webView) {            self.title = self.webView.title;        }        else        {            [super observeValueForKeyPath:keyPath ofObject:object change:change context:context];        }    }    else {                [super observeValueForKeyPath:keyPath ofObject:object change:change context:context];    }}复制代码

然后是通知的回调

-(void)uerislogin{    JMUserInfoModel *userInfo = [JMLoginManager getInfo];    NSString * js = [NSString stringWithFormat:@"window.sessionStorage.setItem('token','%@')",userInfo.user_token];    WKUserScript * userScript = [[WKUserScript alloc]initWithSource:js injectionTime:WKUserScriptInjectionTimeAtDocumentStart forMainFrameOnly:NO];    [_userContent addUserScript:userScript];        [self.webView reload];}复制代码

最后记得在dealloc里面进行销毁通知和KVO

-(void)dealloc{    [_webView removeObserver:self forKeyPath:@"title"];    [[NSNotificationCenter defaultCenter] removeObserver:self];}复制代码

到这里已经实现了完美的APP H5同步登陆需求啦！