2012-03-22 27 views
83

मैं आगे के अंत में विकास में हूं और हाल ही में मेरे ऐप में बैकबोन.जेएस की खोज शुरू कर दी है। मैं मॉडल डेटा को सर्वर पर जारी रखना चाहता हूं।Backbone.js मॉडल डेटा को सहेजने के तरीके?

क्या आप मॉडल मॉडल को सहेजने के लिए मुझे विभिन्न तरीकों की व्याख्या कर सकते हैं (जेसन प्रारूप का उपयोग करके)। मैं जावा पक्ष पर जावा का उपयोग कर रहा हूँ। इसके अलावा मैंने मुख्य रूप से डेटा बचाने के लिए आरईएसटी का उपयोग किया है। जैसा कि मैं आगे के अंत देव में अधिक हूं, मुझे आरईएसटी और अन्य समान सामानों से अवगत नहीं है।

यह अच्छा होगा अगर कोई मुझे कुछ सरल उदाहरण के साथ प्रक्रिया को समझा सके।

उत्तर

266

मूल रूप से मॉडल में गुणों नामक एक संपत्ति होती है जो एक निश्चित मॉडल के विभिन्न मूल्य हो सकती है। JSON ऑब्जेक्ट्स लेने वाले विभिन्न विधियों का उपयोग करके बैकबोन JSON ऑब्जेक्ट्स का उपयोग इन मानों को पॉप्युलेट करने के लिए एक आसान तरीका के रूप में करता है। उदाहरण:

Donuts = Backbone.Model.extend({ 
    defaults: { 
     flavor: 'Boston Cream', // Some string 
     price: '0.50' // Dollars 
    } 
}); 

मॉडल को पॉप्युलेट करने के लिए ऐसा करने के कुछ तरीके हैं। उदाहरण के लिए, आप JSON या पास() नामक विधि का उपयोग करके अपना मॉडल उदाहरण सेट अप कर सकते हैं जो विशेषताओं का JSON ऑब्जेक्ट लेता है।

myDonut = new Donut({'flavor':'lemon', 'price':'0.75'}); 
mySecondHelping = new Donut(); 
mySecondHelping.set({'flavor':'plain', 'price':'0.25'}); 

console.log(myDonut.toJSON()); 
// {'flavor':'lemon', 'price':'0.75'} 
console.log(mySecondHelping.toJSON()); 
// {'flavor':'plain', 'price':'0.25'} 

तो यह हमें मॉडल को बचाने और उन्हें सर्वर पर रखने के लिए लाता है। "आरईएसटी/रीस्टफुल क्या है?" के बारे में पूरी जानकारी है और यहां एक संक्षिप्त अस्पष्टता में यह सब समझाना मुश्किल है। विशेष रूप से आरईएसटी और बैकबोन सेविंग के संबंध में, आपके सिर को लपेटने की बात HTTP अनुरोधों का अर्थशास्त्र है और आप अपने डेटा के साथ क्या कर रहे हैं।

आप शायद दो प्रकार के HTTP अनुरोधों के लिए उपयोग किया जाता है। प्राप्त करें और पोस्ट करें। एक विश्वसनीय माहौल में, इन क्रियाओं का बैकबोन मानता है कि विशिष्ट उपयोगों के लिए विशेष अर्थ है। जब आप सर्वर से एक निश्चित संसाधन प्राप्त करना चाहते हैं, (उदाहरण के लिए मैंने पिछली बार सहेजा गया डोनट मॉडल, एक ब्लॉग एंट्री, एक कंप्यूटर विनिर्देश) और वह संसाधन मौजूद है, तो आप एक जीईटी अनुरोध करते हैं। इसके विपरीत, जब आप एक नया संसाधन बनाना चाहते हैं तो आप POST का उपयोग करते हैं।

बैकबोन में आने से पहले, मैंने कभी भी निम्नलिखित दो HTTP अनुरोध विधियों को छुआ नहीं है। पॉट और हटा दें। इन दो क्रियाओं में बैकबोन के लिए विशिष्ट अर्थ भी है। जब आप संसाधन को अपडेट करना चाहते हैं, (उदाहरण के लिए लिमन डोनट के लिमन डोनट का स्वाद बदलें) आप एक पुट अनुरोध का उपयोग करते हैं। जब आप सर्वर से उस मॉडल को एक साथ हटाना चाहते हैं, तो आप एक डेली अनुरोध का उपयोग करते हैं।

ये मूल बातें बहुत महत्वपूर्ण हैं क्योंकि आपके रीस्टफुल ऐप के साथ, आपके पास शायद एक यूआरआई पदनाम होगा जो आपके द्वारा उपयोग किए जाने वाले अनुरोध क्रिया के आधार पर उपयुक्त कार्य करेगा। उदाहरण के लिए:

// The URI pattern 
http://localhost:8888/donut/:id 

// My URI call 
http://localhost:8888/donut/17 

तो मुझे लगता है कि URI का एक प्राप्त करते हैं, यह 17 के एक आईडी के साथ डोनट मॉडल मिलेगा: आईडी आप इसे कैसे सर्वर साइड बचत कर रहे हैं पर निर्भर करता है। यह आपकी डेटाबेस तालिका में आपके डोनट संसाधन की आईडी हो सकती है।

यदि मैं उस यूआरआई को नए डेटा के साथ पुट करता हूं, तो मैं इसे अपडेट कर रहा हूं, इसे सहेज रहा हूं। और अगर मैं उस यूआरआई को हटा देता हूं, तो यह इसे मेरे सिस्टम से शुद्ध कर देगा।

पोस्ट के साथ, चूंकि आपने संसाधन नहीं बनाया है, फिर भी इसकी एक स्थापित संसाधन आईडी नहीं होगी। हो सकता है कि यूआरआई लक्ष्य मैं संसाधन बनाना चाहता हूं, बस यह है:

http://localhost:8888/donut 

यूआरआई में कोई आईडी खंड नहीं है। इन सभी यूआरआई डिज़ाइन आपके ऊपर हैं और आप अपने संसाधनों के बारे में कैसा सोचते हैं।लेकिन रीस्टफुल डिज़ाइन के संबंध में, मेरी समझ यह है कि आप अपने कार्यों के क्रियाओं को अपने HTTP अनुरोध और संसाधनों के रूप में रखना चाहते हैं जो यूआरआई को पढ़ने और मानव अनुकूल बनाने में आसान बनाती हैं।

क्या आप अभी भी मेरे साथ हैं? :-)

तो चलिए बैकबोन के बारे में सोचने के लिए वापस आते हैं। बैकबोन अद्भुत है क्योंकि यह आपके लिए बहुत काम करता है। हमारे डोनट और सेकेंड हेल्पिंग को बचाने के लिए, हम बस यह करते हैं:

myDonut.save(); 
mySecondHelping.save(); 

बैकबोन स्मार्ट है। यदि आपने अभी एक डोनट संसाधन बनाया है, तो उसके पास सर्वर से कोई आईडी नहीं होगी। इसमें सीआईडी ​​कहा जाता है जो बैकबोन आंतरिक रूप से उपयोग करता है लेकिन चूंकि इसमें कोई आधिकारिक आईडी नहीं है, इसलिए यह जानता है कि इसे एक नया संसाधन बनाना चाहिए और यह एक POST अनुरोध भेजता है। अगर आपको सर्वर से अपना मॉडल मिल गया है, तो शायद यह सही होगा। इस मामले में, जब आप सहेजते हैं() बैकबोन मानता है कि आप सर्वर को अपडेट करना चाहते हैं और यह एक पुट भेज देगा। एक विशिष्ट संसाधन प्राप्त करने के लिए, आप बैकबोन विधि। Fetch() का उपयोग करेंगे और यह एक GET अनुरोध भेजता है। जब आप किसी मॉडल पर .destroy() को कॉल करते हैं तो यह DELETE भेज देगा।

पिछले उदाहरणों में, मैंने कभी स्पष्ट रूप से बैकबोन को नहीं बताया जहां यूआरआई है। आइए अगले उदाहरण में ऐसा करते हैं।

thirdHelping = Backbone.Model.extend({ 
    url: 'donut' 
}); 
thirdHelping.set({id:15}); // Set the id attribute of model to 15 
thirdHelping.fetch(); // Backbone assumes this model exists on server as ID 15 

बैकबोन अपनी साइट रूट में http://localhost:8888/donut/15 पर thirdHelping यह बस जोड़ देगा/डोनट स्टेम मिल जाएगा।

यदि आप मेरे साथ अभी भी अच्छे हैं, तो अच्छा। मुझे लगता है। जब तक आप उलझन में नहीं हैं। लेकिन हम वैसे भी परेशान करेंगे। इसका दूसरा भाग सर्वर पक्ष है। हमने HTTP के विभिन्न क्रियाओं और उन क्रियाओं के पीछे अर्थपूर्ण अर्थों के बारे में बात की है। मतलब है कि आप, बैकबोन, और आपके सर्वर को साझा करना होगा।

आपके सर्वर को एक GET, POST, PUT, और DELETE अनुरोध के बीच अंतर को समझने की आवश्यकता है। जैसा कि आपने ऊपर दिए गए उदाहरणों में देखा है, GET, PUT, और DELETE सभी एक ही यूआरआई http://localhost:8888/donut/07 पर इंगित कर सकते हैं जब तक कि आपका सर्वर इन HTTP अनुरोधों के बीच अंतर नहीं कर सकता, यह उस संसाधन के साथ क्या करना है, इस बारे में बहुत उलझन में होगा।

यह तब होता है जब आप अपने रीस्टफुल सर्वर एंड कोड के बारे में सोचना शुरू करते हैं। रुबी जैसे कुछ लोग, कुछ लोग जैसे नेट, मुझे PHP पसंद है। विशेष रूप से मुझे एसएलआईएम PHP माइक्रो-फ्रेमवर्क पसंद है। एसएलआईएम PHP एक माइक्रो-फ्रेमवर्क है जिसमें रीस्टफुल गतिविधियों के साथ निपटने के लिए एक बहुत ही सुरुचिपूर्ण और सरल टूल सेट है। आप ऊपर दिए गए उदाहरणों में मार्गों (यूआरआई) को परिभाषित कर सकते हैं और इस पर निर्भर करते हैं कि कॉल प्राप्त हो गया है, पोस्ट करें, पुट करें या हटाएं, यह सही कोड निष्पादित करेगा। स्लीम, टॉनिक जैसे एसएलआईएम के समान अन्य समाधान हैं। मेरा मानना ​​है कि केक और कोडइग्निटर जैसे बड़े ढांचे भी इसी तरह की चीजें करते हैं हालांकि मुझे न्यूनतम पसंद है। क्या मैंने कहा कि मुझे स्लिम पसंद है? ;-)

यह वही सर्वर पर अंश कोड लग सकता है

$app->get('/donut/:id', function($id) use ($app) { 
    // get donut model with id of $id from database. 
    $donut = ... 

    // Looks something like this maybe: 
    // $donut = array('id'=>7, 'flavor'=>'chocolate', 'price'=>'1.00') 

    $response = $app->response(); 
    $response['Content-Type'] = 'application/json'; 
    $response->body(json_encode($donut)); 
}); 

यहाँ यह ध्यान रखें कि रीढ़ एक JSON ऑब्जेक्ट उम्मीद महत्वपूर्ण है (अर्थात विशेष रूप से मार्गों के बारे में।)। हमेशा अपना सर्वर सामग्री-प्रकार को 'एप्लिकेशन/जेसन' के रूप में नामित करें और यदि आप कर सकते हैं तो इसे जेसन प्रारूप में एन्कोड करें। फिर जब बैकबोन JSON ऑब्जेक्ट प्राप्त करता है तो यह जानता है कि मॉडल का अनुरोध कैसे किया जाए।

एसएलआईएम PHP के साथ, मार्ग ऊपर के समान ही काम करते हैं।

$app->post('/donut', function() use ($app) { 
    // Code to create new donut 
    // Returns a full donut resource with ID 
}); 
$app->put('/donut/:id', function($id) use ($app) { 
    // Code to update donut with id, $id 
    $response = $app->response(); 
    $response->status(200); // OK! 
    // But you can send back other status like 400 which can trigger an error callback. 
}); 
$app->delete('/donut/:id', function($id) use ($app) { 
    // Code to delete donut with id, $id 
    // Bye bye resource 
}); 

तो आपने लगभग पूर्ण दौर यात्रा की है! जाओ सोडा जाओ। मुझे डाइट माउंटेन ड्यू पसंद है। मेरे लिए भी एक प्राप्त करें।

एक बार आपका सर्वर अनुरोध संसाधित करता है, डेटाबेस और संसाधन के साथ कुछ करता है, एक प्रतिक्रिया तैयार करता है (चाहे वह एक साधारण http स्थिति संख्या या पूर्ण JSON संसाधन हो), तो डेटा अंतिम प्रक्रिया के लिए बैकबोन पर वापस आ जाता है।

अपनी बचत(), fetch(), आदि विधियों के साथ - आप सफलता और त्रुटि पर वैकल्पिक कॉलबैक जोड़ सकते हैं। यहां एक उदाहरण दिया गया है कि मैंने इस विशेष केक को कैसे स्थापित किया:

Cake = Backbone.Model.extend({ 
    defaults: { 
     type: 'plain', 
     nuts: false 
    }, 
    url: 'cake' 
}); 

myCake = new Cake(); 
myCake.toJSON() // Shows us that it is a plain cake without nuts 

myCake.save({type:'coconut', nuts:true}, { 
    wait:true, 
    success:function(model, response) { 
     console.log('Successfully saved!'); 
    }, 
    error: function(model, error) { 
     console.log(model.toJSON()); 
     console.log('error.responseText'); 
    } 
}); 

// ASSUME my server is set up to respond with a status(403) 
// ASSUME my server responds with string payload saying 'we don't like nuts' 

इस उदाहरण के बारे में कुछ अलग-अलग चीजें हैं। आप देखेंगे कि मेरे केक के लिए, सहेजने से पहले गुणों को सेट() सेट करने के बजाय, मैं बस अपने सेव कॉल में नए विशेषताओं में पास हो गया। बैकबोन पूरी जगह पर जेएसओएन डेटा लेने और इसे एक चैंप की तरह संभालने में सुंदर निंजा है। तो मैं अपने केक को नारियल और नट्स से बचाने के लिए चाहता हूं। (क्या वह 2 पागल है?) वैसे भी, मैं अपनी बचत के लिए दो वस्तुओं में पारित किया। गुण JSON ऑब्जेक्ट और कुछ विकल्प। पहला, {प्रतीक्षा: सत्य} का मतलब है कि मेरे क्लाइंट साइड मॉडल को अपडेट न करें जब तक कि सर्वर साइड ट्रिप सफल न हो जाए। सफलता कॉल वापस तब होगा जब सर्वर सफलतापूर्वक प्रतिक्रिया देता है। हालांकि, चूंकि इस उदाहरण के परिणामस्वरूप त्रुटि होती है (200 से अधिक की स्थिति त्रुटि कॉलबैक का उपयोग करने के लिए बैकबोन को इंगित करेगी) हमें परिवर्तन के बिना मॉडल का प्रतिनिधित्व मिलता है। यह अभी भी सादा और बिना पागल होना चाहिए। हमारे पास सर्वर द्वारा वापस भेजे गए त्रुटि ऑब्जेक्ट तक पहुंच भी है। हमने एक स्ट्रिंग वापस भेज दी लेकिन यह अधिक गुणों के साथ JSON त्रुटि ऑब्जेक्ट हो सकता है। यह error.responseText विशेषता में स्थित है। हाँ, 'हमें पागल पसंद नहीं है।'

बधाई। आपने अपनी पहली सुंदर पूर्ण राउंड ट्रिप को मॉडल सेट अप करने, इसे सर्वर की तरफ से सहेजने और वापस करने से पहले बनाया है। मुझे उम्मीद है कि यह उत्तर महाकाव्य आपको एक आईडीईए देता है कि यह सब कैसे एक साथ आता है। बेशक, बहुत सारे विवरण हैं कि मैं अतीत में क्रूज़ कर रहा हूं लेकिन बैकबोन सेव के मूल विचार, रीस्टफुल क्रियाएं, सर्वर-साइड एक्शन, प्रतिक्रिया यहां हैं। बैकबोन प्रलेखन के माध्यम से चलते रहें (जो अन्य दस्तावेज़ों की तुलना में पढ़ने के लिए बहुत आसान है) लेकिन केवल ध्यान रखें कि आपके सिर को लपेटने में समय लगता है। जितना अधिक आप इसे उतना अधिक धाराप्रवाह रखते हैं जितना आप करेंगे। मैं हर दिन बैकबोन के साथ कुछ नया सीखता हूं और यह वास्तव में मजेदार हो जाता है क्योंकि आप छलांग लगाना शुरू करते हैं और इस ढांचे में बढ़ती अपनी प्रवाह देखते हैं। :-)

हैप्पी कोडिंग!

संपादित करें: संसाधन है कि उपयोगी हो सकता है:

इतने पर अन्य समान उत्तर: How to generate model IDs with Backbone

बाकी पर: http://rest.elkstein.org/ http://www.infoq.com/articles/rest-introduction http://www.recessframework.org/page/towards-restful-php-5-basic-tips

+8

मैं इस पर एक छोटे से पागल जा रहा समाप्त हो गया। मुझे याद है जब मैंने पहली बार बैकबोन शुरू किया था और पूछताछ की तरह सवाल थे और मुझे प्रतिक्रिया लिखने में बहुत मज़ा आया था। मुझे यकीन है कि मेरे जल्दबाजी में मैंने कुछ त्रुटियां की हैं या कुछ महत्वपूर्ण आलोचनाओं को याद किया है "आह-हा!" पहलुओं तो अगर मैंने किया, मुझे बताओ। :-P – jmk2142

+5

दिमाग कम से कम कहने का उत्तर उड़ा रहा है ... मैं आपके द्वारा उल्लिखित सभी चीजों को समझने की कोशिश कर रहा हूं .. असली चीज थोड़ी मुश्किल लगती है, हालांकि आप सही हैं, आप निश्चित रूप से मुझे इस प्रश्न के भीतर आरईएसटी समझा नहीं सकते। ..मैं फिर से चीजों से गुज़र जाऊंगा और इसे कुछ समय में स्वीकार करूँगा ... विस्तृत उत्तर के लिए फिर से Thx ... – testndtv

+2

जब मुझे समय मिलता है, तो मैं अपने उत्तर को अच्छे संदर्भों की सूची के साथ अपडेट कर दूंगा जो मदद कर सकते हैं आप खोज पर। मैं आपको खतरनाक दुनिया का सामना करने के लिए एक लकड़ी की तलवार नहीं दे सकता, लेकिन मैं आपको उन साइटों के संसाधन लिंक दे सकता हूं जिन्होंने मेरी मदद की है। :-) – jmk2142

संबंधित मुद्दे