1、MemoryProxy MemoryProxy只能从JavaScript对象获得数据,可以直接把数组,或JSON和XML格式的数据交给它处理,如下面的代码所示。 var proxy = new Ext.data.MemoryProxy([ ['id1','name1','descn1'], ['id2','name2','descn2'] ]); 2、HttpProxy HttpProxy使用HTTP协议,通过Ajax去后台取数据,构造它时需要设置url:'xxx.jsp'参数。这里的url可以替换成任何一个合法的网址,这样HttpProxy才知道去哪里获取数据,如下面的代码所示。 var proxy = new Ext.data.HttpProxy({url:'xxx.jsp'}); 后台需要返回EXT所需要的JSON格式的数据,下面的内容就是后台使用JSP的一个范例,如下面的代码所示。 response.setContentType("application/x-json"); Writer out = response.getWriter(); out.print("[" + "['id1','name1','descn1']" + "['id2','name2','descn2']" + "]"); 请注意,这里的HttpProxy不支持跨域,它只能从同一域中获得数据。如果想跨域,请参考下面的ScriptTagProxy。 3、ScriptTagProxy ScriptTagProxy的用法几乎和HttpProxy一样,如下面的代码所示。 var proxy = new Ext.data.ScriptTagProxy({url:'xxx.jsp'}); 从这里也看不出来它是如何支持跨域的,我们还需要在后台进行相应的处理,如下面的代码所示。 String cb = request.getParameter("callback"); response.setContentType("text/javascript"); Writer out = response.getWriter(); out.write(cb + "("); out.print("[" + "['id1','name1','descn1']" + "['id2','name2','descn2']" + "]"); out.write(");"); 其中的关键就在于从请求中获得的callback参数,这个参数叫做回调函数。ScriptTag- Proxy会在当前的HTML页面里添加一个 标签,然后把后台返回的内容添加到这个标签中,这样就可以解决跨域访问数据的问题。为了让后台返回的内容可以在动态生成的标签中运行,EXT会生成一个名为 callback的回调函数,并把回调函数的名称传递给后台,由后台生成callback(data)形式的响应内容,然后返回给前台自动运行。 虽然上述处理过程比较难理解,但是我们只需要了解ScriptTagProxy的用法就足够了。如果还想进一步了解 ScriptTagProxy的运行过程,可以使用Firebug查看动态生成的HTML以及响应的JSON内容。 最后我们来分析一下EXT的API文档中提供的示例,这段后台代码会自动判断请求的类型,返回支持ScriptTagProxy或 HttpProxy的数据,如代码清单所示。 代码清单 在后台同时支持HttpProxy和ScriptTagProxy boolean scriptTag = false; String cb = request.getParameter("callback"); if (cb != null) { scriptTag = true; response.setContentType("text/javascript"); } else { response.setContentType("application/x-json"); } Writer out = response.getWriter(); if (scriptTag) { out.write(cb + "("); } out.print(dataBlock.toJsonString()); if (scriptTag) { out.write(");"); } 代码中通过判断请求中是否包含callback参数来决定返回何种数据类型。如果包含,就返回ScriptTagProxy需要的数据;否则,就当作HttpProxy处理。
|
|