• 원문 : http://docs.sencha.com/touch/2.3.1/#!/guide/proxies
  • 번역문 :http://sencha.or.kr/wp-admin/post.php?post=1302&action=edit
  • 번역자 :  좌찬익(컴퓨터교육과 2011104145)

프록시는 모델 데이터의 로딩 및 저장을 처리하는 스토어에 의해 사용된다.  프록시는 클라이언트와 서버 두가지 유형이 있다.  클라이언트 프록시의 예는 브라우저의 메모리와 사용할 수 있는 HTML5의 로컬 저장 기능을 사용하여 로컬 저장소에 데이터를 저장하기 위한 메모리를 포함한다. 서버 프록시는 원격 서버에 데이터의 마샬링을 처리하는데 예로 아약스 , JsonP, 나머지등이 있다.

Proxies are used by stores to handle the loading and saving of model data. There are two types of proxy: client and server. Examples of client proxies include Memory for storing data in the browser’s memory and Local Storage which uses the HTML 5 local storage feature when available. Server proxies handle the marshaling of data to a remote server, and examples include Ajax, JsonP, and Rest.

아래의 그림, 코드에 따라서 프록시는 직접적으로 정의 할 수 있습니다.

Proxies can be defined directly on a model, as illustrated by the following code sample

EXT . 정의 ( '사용자' ,  { 
    확장 :  ' Ext.data.Model을 ' ,

    config :  { 
        fields :  [ 'id' ,  'name' ,  'age' ,  'gender' ], 
        proxy :  { 
            type :  'rest' , 
            url :  '/data/users.json' , 
            reader :  { 
                type :  'json' , 
                rootProperty :  'users' 
            } 
        } 
    } 
});

/ / 사용자 모델의 프록시 사용 
내선 . 생성 ( ' Ext.data.Store ' ,  { 
    모델 :  '사용자를' 
});

정의 모델 방법에는 두 가지 방법이 있습니다. 첫번째로는 사용자 모델을 사용하는 모든 스토어가 동일한 방식으로 우리는 각각 스토어에 프록시의 정의를 복제하는 것을 피하기 위해 그 데이터를 같은 방법으로 사용 할 수 있습니다. 둘째로는 우리는 모델 데이터를 저장 할 수 있습니다.

This way of defining models helps in two ways. First, since it is likely that every store that uses the User model needs to load its data in the same way, we avoid having to duplicate the proxy definition for each store. Second, we can load and save model data without a store


// Gives us a reference to the User class
var User = Ext.ModelMgr.getModel('User');

var ed = Ext.create('User', {
    name: 'Ed Spencer',
    age : 25
});

// We can save Ed directly without having to add him to a Store first because we
// configured a RestProxy this will automatically send a POST request to the url /users
ed.save({
    success: function(ed) {
        console.log("Saved Ed! His ID is "+ ed.getId());
    }
});

// Load User 1 and do something with it (performs a GET request to /users/1)
User.load(1, {
    success: function(user) {
        console.log("Loaded user 1: " + user.get('name'));
    }
});

HTML5의 새로운 기능을 활용한 프록시도 있습니다.(LocalStorage와 SessionStorage) 이전 버전의 브라우저가 새로운 HTML5 API를 지원하지는 않지만 이것들은 많은 응용 프로그램들이 사용하기에 엄청난 이익들이 있어 유용합니다.

There are also proxies that take advantage of the new capabilities of HTML5 -LocalStorage and SessionStorage. Although older browsers do not support the new HTML5 APIs, they are so useful that a lot of applications will benefit enormously by using them.

Example of a Model that uses a Proxy directly