extjs4.0的数据代理proxy

数据代理proxy

数据代理proxy是进行数据读写的一个主要途径，通过代理操作进行CURD

每一步操作全会得到唯一的Ext.data.Operation实例化包含了所有的请求参数

1. 数据代理proxy目录结构

Ext.data.proxy.Proxy代理类的根类划分为客户端（Client）代理和服务器(Server)代理

Ext.data.proxy.Client 客户端代理

Ext.data.proxy.Memory 普通的内存代理

Ext.data.proxy.WebStorage 浏览器客户端存储代理

Ext.data.proxy.SessionStorage 浏览器级别代理

Ext.data.proxy.LocalStorage 本地化的级别代理（不能跨浏览器的）

Ext.data.proxy.Server 服务器端代理

Ext.data.proxy.Ajax 异步加载的方式

Ext.data.proxy.Rest 一种特定的Ajax

Ext.data.proxy.JsonP 跨域交互的代理

跨域的缺点：跨域是有严重性安全隐患的extjs的，跨域也是需要服务器端做相应的配合

Ext.data.proxy.Direct命令

客户端的代理

1．Ext.data.proxy.Memory 普通的内存代理的使用

(function(){

Ext.onReady(function(){

//内存代理的创建

Ext.regModel("user",{

fields:[

{name:'name',type:'string'},

{name:'age',type:'int'}

]

});

//使用内存代理来为类赋值和实例化

var memory = [

{name:'laowang',age:23},

{name:'laoyao',age:22}

]

//利用Ext.data.proxy.Memory 即使内存代理来把类和值连接起来

var memoryProxy = Ext.create("Ext.data.proxy.Memory",{

data:memory,//注意数组不带''

model:'user'

});

//通过使用proxy实现CURD

//其次是更新,用update,把更新放到查找之前可以在更新之后直接读取出来

memory.push({name:'new laowang',age:26})

memoryProxy.update(new Ext.data.Operation({

action:'update',

data:memory

}),function(result){},this)

//首先实现的是查找，通过断点来知道result可以得到一个数组

memoryProxy.read(new Ext.data.Operation(),function(result){

var pdata = result.resultSet.records;

//注意数组不带''，数组的遍历用each方法

Ext.Array.each(pdata,function(model){

alert(model.get('name'));

});

},this);

});

})();

2. Ext.data.proxy.LocalStorage 本地化的级别代理（不能跨浏览器的）

1.(function(){

2. Ext.onReady(function(){

3. //学习Ext.data.proxy.LocalStorage，即是本地化的级别代理，是不夸浏览器的，相当于是cookie

4. Ext.regModel("user",{

5. fields:[

6. {name:'name',type:'string'}

7. ],

8. //指定代理的类型为本地的代理级别，id是唯一的标识

9. proxy:{

10. type:'localstorage',

11. id:'twitter-Searches' //id不可以省去，因为每访问一次就有一个cookie在本地，是通过uuid来标识的

12. }

13. });

14. // 我们用store来初始化数据

15. var store = new Ext.data.Store({

16. model:user

17. });

18. //利用store中的方法来添加数据，store是数据集

19. store.add({name:'laowang'});

20. store.sync();//用来保存添加的数据

21. store.load();//读取存在store中的数据

22.

23. //把数据集通过数组的形式读取出来

24. var msg = [];

25. store.each(function(rec){

26. msg.push(rec.get('name'));

27. //alert(rec.get('name'));这样写看不出来有多少个，还要数

28. });

29. alert(msg.join('\n'));//因为是一个数据集，所以在每次访问之后都会想store中加入一个name，所以each会再多一次循环

30. });

31. })();

3. Ext.data.proxy.SessionStorage 浏览器级别代理

和本地级别的代理不同的是porxy代理不同，其他的都相同

(function(){

Ext.onReady(function(){

//学习Ext.data.proxy.SessionStorage,即是浏览器级别的代理，只限于一次会话

Ext.regModel("user",{

fields:[

{name:'name',type:'string'}

],

//指定代理的类型为本地的代理级别，id是唯一的标识

proxy:{

type:'sessionstorage',

id:'myProxyKey'

}

});

// 我们用store来初始化数据

var store = new Ext.data.Store({

model:user

});

//利用store中的方法来添加数据，store是数据集

store.add({name:'laowang'});

store.sync();//用来保存添加的数据

store.load();//读取存在store中的数据

//把数据集通过数组的形式读取出来

var msg = [];

store.each(function(rec){

msg.push(rec.get('name'));

//alert(rec.get('name'));这样写看不出来有多少个，还要数

});

alert(msg.join('\n')+"一次访问为："+msg.length+"次");

});

})();

以上的本地代理和浏览器代理的用处:

本地代理可以用于永久的存储，如果只是一次会话就用session代理，比如打开用电脑的时候用的是家庭式的还是网吧式的，如果是网吧式的，在后台编写的时候就可以用的是session代理，只记录当时的情况。

乱码问题没有解决啊！

服务端的代理

1．Ext.data.proxy.Ajax 异步加载的方式

(function(){

Ext.onReady(function(){

Ext.regModel("person",{

fileds:[

{name:'name',type:'string'}

],

});

//利用ajax代理来和jsp页面连接,不用上次我们用到的在proxy中嵌套，把ajax和类的模型提取出来来创建

//里面为ajax的属性

var ajaxProxy = new Ext.data.proxy.Ajax({

model:'person',

url:'extLession/proxy04/person.jsp',

reader:'json'

});

//读取jsp页面的数据

ajaxProxy.doRequest(new Ext.data.Operation(),function(o){

var text = o.response.responseText;//得到的是name的值，但是我们要的是一个类的model，所以再通过属性转化一下。

alert(Ext.JSON.decode(text)['name']);

});

});

})();

2．Ext.data.proxy.JsonP 跨域交互的代理

从本地可以跨域到其他的网站上去

(function(){

Ext.onReady(function(){

//Ext.data.proxy.JsonP 跨域交互的代理

Ext.regModel("person",{

fileds:[

{name:'name',type:'string'}

],

//跨域的代理

proxy:{

type:'jsonp',

url:'http://www.baidu/extjs.com'

}

});

//初始化类

var person = Ext.ModelManager.getModel("person");

person.load(1,{

scope:this,

success:function(model){

alert(model.get('name'));

}

});

});

})();

评论

1 楼 wanghf617 2013-04-23  

1．Ext.data.proxy.Memory 普通的内存代理的使用

memory.push({name:'new laowang',age:26})
memoryProxy.update(new Ext.data.Operation({
action:'update',
data:memory
}),function(result){},this)

这里不需要update，也可以直接read出来。
另外，在ExtJS4.2下面，memoryProxy.update的这种写法会报错，无法执行。