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. ajax提交数据服务端返回报错

    报错如下: if response.get('X-Frame-Options') is not None:AttributeError: 'str' object has no attribute ' ...

  2. Xode 8 的那些坑

    刚发布完Xcode的8.0果断更新了,发现用起来非常容易闪退,关键是我编辑项目时默认使用Xcode8打开,导致我用Xcode7打开Xib是报错: This version does not suppo ...

  3. 下拉菜单的option的value属性值问题

    下拉菜单的所有option都必须有value值,如果没有value会将标签中间的值传上去: 比如: <span class="el_spans">试卷级别:</s ...

  4. 解决npm 的 shasum check failed for错误

    使用npm安装一些包失败,类似如下报错情况:   C:\Program Files\nodejs>npm update npm npm ERR! Windows_NT 10.0.14393 np ...

  5. Android 防护扫盲篇

    一,已知防护策略 1.不可或缺的混淆 Java 是一种跨平台.解释型语言,Java 源代码编译成的class文件中有大量包含语义的变量名.方法名的信息,很容易被反编译为Java 源代码.为了防止这种现 ...

  6. 洛谷——P2296 寻找道路

    P2296 寻找道路 题目描述 在有向图G 中,每条边的长度均为1 ,现给定起点和终点,请你在图中找一条从起点到终点的路径,该路径满足以下条件: 1 ．路径上的所有点的出边所指向的点都直接或间接与终点 ...

  7. Ant -----ant标签和自定义任务

    随便记一下 Ant的用法吧.ant ,maven, gradle ,三个打包工具到齐了,Ant 常见标签解析,ant 自定义task . <?xml version="1.0" ...

  8. mac下 JMeter 4.0 进行多用户接口压力测试

    1.最近在做公司的内部系统,需要进行多用户压力测试,于是上网在官网下载了Jmeter 压缩包,并放在指定的目录解压,打开解压后文件夹到bin目录下: 执行sh jmeter  Jmeter就启动起来了 ...

  9. SQL-基础学习3--通配符:LIKE,%,(_); 拼接:+，||，concat;

    第六课 用通配符进行过滤 6.1  LIKE操作符 通配符本身实际上是SQL的WHERE子句中有特殊含义的字符,SQL支持几种通配符.为在搜索子句中使用通配符,必须使用LIKE操作符.LIKE指示DB ...

  10. UITableViewCell -- 动画

    -(void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath: ...