Hybrid框架下的app，使用的Ajax。须要注意的是UIWebViewDelegate不会监測到Ajax的request。也就是再运行Ajax代码时。shouldStartLoadWithReuqest等方法并不会被调用。

其解决方法须要Javascript和navtive code一起来做，其基本原理可參考这片文章，其流程是在

Javascript handler中每创建Ajax的请求时。须要将这段js存在ajax_handler.js放在app中

var s_ajaxListener = new Object();

s_ajaxListener.tempOpen = XMLHttpRequest.prototype.open;

s_ajaxListener.tempSend = XMLHttpRequest.prototype.send;

s_ajaxListener.callback = function () {

    window.location='mpAjaxHandler://' + this.url;

};

XMLHttpRequest.prototype.open = function(a,b) {

  if (!a) var a='';

  if (!b) var b='';

  s_ajaxListener.tempOpen.apply(this, arguments);

  s_ajaxListener.method = a;

  s_ajaxListener.url = b;

  if (a.toLowerCase() == 'get') {

    s_ajaxListener.data = b.split('?');

    s_ajaxListener.data = s_ajaxListener.data[1];

  }

}

XMLHttpRequest.prototype.send = function(a,b) {

  if (!a) var a='';

  if (!b) var b='';

  s_ajaxListener.tempSend.apply(this, arguments);

  if(s_ajaxListener.method.toLowerCase() == 'post')s_ajaxListener.data = a;

  s_ajaxListener.callback();

}

当中的"mpAjaxHandler"为自己定义的Scheme，用于差别request是否是由Ajax发出的。

在App端

获得js

static NSString *JSHandler;

+ (void)initialize {

    JSHandler = [[NSString stringWithContentsOfURL:[[NSBundle mainBundle] URLForResource:@"ajax_handler" withExtension:@"js"] encoding:NSUTF8StringEncoding error:nil] retain];

}

加载页面后，运行这段js

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

    [webView stringByEvaluatingJavaScriptFromString:JSHandler];

}

拦截住Request，不让webview的URL做出改变

#define CocoaJSHandler          @"mpAjaxHandler"

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {

    if ([[[request URL] scheme] isEqual:CocoaJSHandler]) {

        NSString *requestedURLString = [[[request URL] absoluteString] substringFromIndex:[CocoaJSHandler length] + 3];

        NSLog(@"ajax request: %@", requestedURLString);

        return NO;

    }

    return YES;

}

Ajax相关知识

Ajax作为异步Javascript广泛应用在web站点上。

以下是一个来自于w3school的简单使用Ajax的样例：

<html>

<head>

<script type="text/javascript">

function loadXMLDoc()

{

var xmlhttp;

var txt,x,i;

if (window.XMLHttpRequest)

  {// code for IE7+, Firefox, Chrome, Opera, Safari

  xmlhttp=new XMLHttpRequest();

  }

else

  {// code for IE6, IE5

  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

  }

xmlhttp.onreadystatechange=function()

  {

  if (xmlhttp.readyState==4 && xmlhttp.status==200)

    {

    xmlDoc=xmlhttp.responseXML;

    txt="";

    x=xmlDoc.getElementsByTagName("title");

    for (i=0;i<x.length;i++)

      {

      txt=txt + x[i].childNodes[0].nodeValue + "<br />";

      }

    document.getElementById("myDiv").innerHTML=txt;

    }

  }

xmlhttp.open("GET","http://www.w3school.com.cn/example/xmle/books.xml",true);

xmlhttp.send();

}

</script>

</head>

<body>

<h2>My Book Collection:</h2>

<div id="myDiv"></div>

<button type="button" onclick="loadXMLDoc()">GET Book List</button>

</body>

</html>

点击button。通过Ajax的方式获得书单。部分内容參考于stackoverflow

Hybrid--WebView中使用Ajax的更多相关文章

  1. 重新想象 Windows 8.1 Store Apps (81) - 控件增强: WebView 之加载本地 html, 智能替换 html 中的 url 引用, 通过 Share Contract 分享 WebView 中的内容, 为 WebView 截图

    [源码下载] 重新想象 Windows 8.1 Store Apps (81) - 控件增强: WebView 之加载本地 html, 智能替换 html 中的 url 引用, 通过 Share Co ...

  2. 在WebView中如何让JS与Java安全地互相调用

    在现在安卓应用原生开发中,为了追求开发的效率以及移植的便利性,使用WebView作为业务内容展示与交互的主要载体是个不错的折中方案.那么在这种Hybrid(混合式) App中,难免就会遇到页面JS需要 ...

  3. 重新想象 Windows 8.1 Store Apps (81) - 控件增强: 加载本地 html, 智能替换 html 中的 url 引用, 通过 Share Contract 分享 WebView 中的内容, 为 WebView 截图

    原文:重新想象 Windows 8.1 Store Apps (81) - 控件增强: 加载本地 html, 智能替换 html 中的 url 引用, 通过 Share Contract 分享 Web ...

  4. Hybrid App中原生页面 VS H5页面（分享）

    本文部分转自  http://www.jianshu.com/p/00ff5664e000 现有3类主流APP,分别为:Web App.Hybrid App(混合模式移动应用,Hybrid有“混合的” ...

  5. WebView中JS调用Android Method 遇到的坑整理

    WebView是android中常用的一个组件,其作用是展示网页,并让网页和android app进行一些业务逻辑上的交互. 其坑无数,相信用过的都知道,一个一个来解决吧. 1.怎么互调: <! ...

  6. Hybrid App中原生页面 VS H5页面

    Hybrid App中原生页面 VS H5页面   现有3类主流APP,分别为:Web App.Hybrid App(混合模式移动应用,Hybrid有"混合的"意思). Nativ ...

  7. Jquery中的Ajax

    AJAX: * jQuery中的Ajax * 封装第一层 - 类似于原生Ajax的用法 * $.ajax() - 最复杂 * 选项 * url - 请求地址 * type - 请求类型,默认为GET ...

  8. jQuery入门（4）jQuery中的Ajax应用

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

  9. 混合开发 webview 中file 控件 点击后无反应解决方法

    最近在做个项目 ,需要 使用 file 控件上传 图片到服务器 ,在手机浏览器中 可以正常选择照片,但是放到 android 应用中的webview中,file 控件点击后就没有反应. 百度了一番后, ...

  10. 【Java EE 学习 33 上】【JQuery样式操作】【JQuery中的Ajax操作】【JQuery中的XML操作】

    一.JQuery中样式的操作 1.给id=mover的div采用属性增加样式.one $("#b1").click(function(){ $("#mover" ...

随机推荐

  1. JQuery Option 排序

    <script type="text/javascript"> $(document).ready(function () { $("select" ...

  2. 【CF679B】Theseus and labyrinth（数学，贪心）

    题意: 给一个m<=10^15,每次都减最接近当前值的立方数 让你找一个不大于m的最大的数并且这个数是减法次数最多的数 思路:见http://blog.csdn.net/miracle_ma/a ...

  3. 标准C程序设计七---44

    Linux应用             编程深入            语言编程 标准C程序设计七---经典C11程序设计    以下内容为阅读:    <标准C程序设计>(第7版) 作者 ...

  4. 16深入理解C指针之---迷途指针

    一.若程序中存在迷途指针,轻则导致程序退出,重则使程序出现重大逻辑错误 1.定义:内存已释放,指针依旧指向原始内存,这种指针就是迷途指针 2.迷途指针和指针别名: 1).指针依旧指向已释放的内存,无法 ...

  5. docker mysql 导入导出数据

    导出数据 1.导出mysql单张表结构和数据: docker exec -it my-mysql mysqldump dbname -uroot -p123456 --tables tname > ...

  6. 笔记-迎难而上之Java基础进阶6

    import java.io.*; public class InputStreamDemo{ public static void main(String[] args) throws IOExce ...

  7. iOS -- 开源项目和库

    TimLiu-iOS 目录 UI 下拉刷新 模糊效果 AutoLayout 富文本 图表 表相关与Tabbar 隐藏与显示 HUD与Toast 对话框 其他UI 动画 侧滑与右滑返回手势 gif动画 ...

  8. phonegap工程中修改app的名字

    针对phonegap比较高的版本,我的是6.4.0. 在phonegap工程中,当添加了iOS和android平台或多个平台后,工程进行了开发,然后觉得app的名字想修改一下(比如在手机上显示的app ...

  9. linux中ERROR: The partition with /var/lib/mysql is too full!解决的方法

    今天在ubuntu上遇见这个问题.应该是我的第一分区太小了. 解决的方法: bey0nd@wzw:/var$ cd /var bey0nd@wzw:/var$ rm -rf log 我们删除日志文件 ...

  10. 微信小程序日期定位弹出框遮挡问题

    只需要用bindtap绑定一个点击后的操作(隐藏键盘): wx.hideKeyboard()