iOS 基于JavaScriptCore 不等webView加载完毕就交互,网页获取原生内容。 webView的高级用法之JS交互,js与oc的相互调用

    xiaoxiao2021-03-25  98

    一:本文解决的问题:

       1.不等webView加载完毕,就能获取原生的内容

       2.举个例子: 加载一个城市生活网页,不等加载完成,h5端获取原生定位所在城市,然后根据城市名不同加载不同的城市生活内容。。(例子不恰当,网页时可以自己定位的,忽略,意思懂就行)

    二:本文默认您已经了解JS交互的一些内容了,若您不明白,请看这篇文章,里面介绍了JS交互的详细内容,demo地址等 http://blog.csdn.net/horisea/article/details/52191573

    三.进入正文

      1.项目中JS交互的地方是,一般的交互方式是这样的,网页加载完毕,传递上下文,就能交互了。

     - (void)webViewDidFinishLoad:(UIWebView *)webView{

      ——context=[webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];

    _context[@"testobject"]=testJO;

      一直以来自己的认知是必须在webView加载完之后,,拿到context,将定义好的对象赋值过去;

       缺点::必须在加载完之后才能调用,那么h5端获取城市名时,此时网页还没加载好,肯定是取不到的。。

      现在开始思考解决办法:

     四 .解决办法:

     1.H5端考虑解决

    H5知道iOS已经加载好之后,再去取城市名,window.onload方法取获取城市名,看起来很有用的样子。

    当然这些肯定不是我们iOS端做的,直接让h5开发人员设置就行了,事实证明,这样是不可以的,取不到

    是不是太急了,我们不妨睡一会再去,1秒后取取试试,

    setTimeout(function(){

    }, 1000); (这里的1000是1000ms = 1s

    window.onload = function(){

    我擦,可以了

    再尝试一下,把1000ms改成1ms(毫秒) 马丹,还是可以的 。。。

    问题解决。

    思考:可能是上下文的桥接就需要这1ms的时间吧,,再低的没试过  当然这些都是H5开发人员的活,而且我觉得这个不靠谱

    2.从客户端的角度出发去解决问题

      1.webView加载的时候,就拿到上下文,然后传值,想着很完美

      2.如何提前给呢  说实话我不知道,也不知道有,但既然有这样的需要,看看前辈们有造好的轮子吧

     http://www.jianshu.com/p/939db6215436附加上博客链接将demo下载下来

    直接将UIWebView+TS_JavaScriptContext,拖进工程,这是基于运行时,给webView增加的protocol,在JavaScriptCore创建好上下文时,就进行桥接传递值了。

    然后将

     - (void)webViewDidFinishLoad:(UIWebView *)webView{

     _context=[webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];

    _context[@"testobject"]=testJO;

    ; }

    替换成下面这段

    #pragma mark - Black Technology

        - (void)webView:(UIWebView *)webView didCreateJavaScriptContext:(JSContext*) ctx{

           _context[@"testobject"]=testJO;

        }

    然后就可以为所欲为了。。 至于UIWebView+TS_JavaScriptContext具体实现,自己研究吧,

    五:写在最后的:  转载注明出处

          1.JS交互必看博客:http://blog.csdn.net/horisea/article/details/52191573 里面有demo,直接替换demo里的方法就能在加载完成之前交互了额。

          2.webView离线缓存:http://blog.csdn.net/horisea/article/details/53815596

          3.RN和原生的交互:http://blog.csdn.net/horisea/article/details/54176417

          4.动态返回行高:http://blog.csdn.net/horisea/article/details/52025886

         5.带有文本框的cell数据处理:http://blog.csdn.net/horisea/article/details/51872619

    如果你喜欢这篇文章,或者有任何疑问,可以扫描第一个二维码,加楼主好友哦

    也可以扫第二个二维码,关注楼主个人微信公众号。这里有很多生活,职业,技术相关的文章哦。欢迎您的到来。

    微信号:                                             公众号

    转载请注明原文地址: https://ju.6miu.com/read-9476.html

    最新回复(0)