IOS中WebViewJavascriptBridge桥接获取不到数据的问题

1.场景

公司的APP需要native+h5混合开发，所以APP提供了一些js与原生桥接的方法。

今天产品反馈由h5制作的 关于我们 页面获取不到当前APP的版本号了。（大部分情况下第一次能获取到第二次则获取不到，且未登录的情况下大部分时间无法获取到）

2.猜测

因为这个问题之前也遇到过，当时研究之后的结论是IOS的框架导致进入一个已经进入过的页面之后，无法二次调用对应的桥接方法。当时已经改变了桥接代码，如下：

1. JS调用APP中的 getXXX 桥接方法
2. APP回调JS的 setXXX 方法，把数据返回给h5

这个代码沿用了几个版本都没出现问题，但说不定APP在改页面逻辑时候修改过了。于是让APP端先查看了代码确认没有修改过。

可我的js自从上次测试通过之后也未曾改过，这就见了鬼了。。。

3.测试

首先还是照例，调用方法时打印参数。测试每次进入都能获取到参数。

一时气氛尴尬。。。突然发现打印是在页面加载完一段时间后才出现的。。

也就是说不知道什么原因，这个异步回调大约在页面加载完成后的300-500ms后才触发。

流程大概是这样：

1. 页面加载完成
2. js 调用 getXXX 桥接方法
3. 页面渲染中，输出版本号（因为回调还未完成，数据未获取到。所以版本号为underfined）
4. app端回调 setXXX 方法（但是页面已经加载完成了，所以版本号没有显示）

4.解决

也就是说在页面加载完成之后参数才会通过回调方法传过来，但这个时候页面已经加载完成了。因为回调函数的封装问题没办法直接在回调时执行加载版本号的动作。于是采用了一个曲线救国的方式。

es5中有个defineProperty方法可以监听对象的赋值和读取操作，这就给我们一个能够监听参数对象变化而动态赋值的机会。

Demo代码：

1
2
3
4
5
6

//通过监听global.version属性的变化来显示版本号
Object.defineProperty(global,'version',{
    set: function(value) {//赋值时的回调
        $('#version').html(value);
    }
});

至此，问题解决。