OData और jQuery का उपयोग करके SharePoint Foundation REST इंटरफ़ेस के साथ काम करें

वेब सेवाएं इन दिनों बहुत लोकप्रिय हो रही हैं। और यह समझ में आता है, वे सार्वभौमिक हैं। उनके आधार पर, आप एचटीएमएल 5 में एक क्रॉस-प्लेटफ़ॉर्म मोबाइल एप्लिकेशन लिख सकते हैं, विंडोज 7 डेस्कटॉप के लिए एक गैजेट बना सकते हैं या बस साइट पर नवीनतम समाचार प्रदर्शित कर सकते हैं।

मैं यह प्रदर्शित करना चाहूंगा कि, आधुनिक तकनीकों जैसे REST सेवा, OData और jQuery को मिलाकर, मैं SharePoint 2010 के साथ अपने मानक RESTful इंटरफ़ेस के माध्यम से कंपनी के कर्मचारियों के बारे में डेटा खोजने और देखने के लिए एक छोटा सा वेब पार्ट बनाकर काम कर सकता हूं। मेरे उदाहरण की मुख्य विशेषता सर्वर-साइड प्रोग्रामिंग की कमी है।

SharePoint Foundation REST इंटरफ़ेस

SharePoint Foundation REST इंटरफ़ेस Microsoft SharePoint 2010 में शुरू की गई एक नई सेवा है।

इस वेब सेवा की मूल अवधारणा यह है कि सभी SharePoint सूचियों और तत्वों को HTTP संसाधनों के रूप में दर्शाया जाता है और URL द्वारा दूरस्थ रूप से पहुँचा जा सकता है। यह एक पूर्ण Restful सेवा है। इसमें संचालन का एक मानक सेट है: पढ़ना, लिखना, संपादित करना और हटाना। आउटपुट फॉर्मेट XML और JSON दोनों में संभव है। वेब सेवा ओपन डेटा प्रोटोकॉल का समर्थन करती है, जिसके बारे में मैं नीचे बात करूंगा।
इन सभी विशेषताओं के कारण, वेब सेवाओं की उच्च लचीलापन और संगतता किसी भी एप्लिकेशन के साथ जो HTTP अनुरोध कर सकती है, हासिल की गई है।

SharePoint Foundation REST इंटरफ़ेस के साथ मेरा परिचित अपेक्षाकृत हाल ही में हुआ, लेकिन यह तुरंत स्पष्ट हो गया कि इसका उपयोग करना कितना सुविधाजनक है। मुझे पछतावा हुआ कि मुझे उसके बारे में पहले नहीं पता था। बेशक, यह सभी अवसरों के लिए एक उपकरण नहीं है, लेकिन कभी-कभी यह जीवन को बहुत सरल करता है।

SharePoint Foundation REST इंटरफ़ेस यहाँ उपलब्ध है:

http://{server_name}/_vti_bin/listdata.svc

Microsoft SharePoint नींव 2010 को स्थापित करने के तुरंत बाद आप इसका उपयोग कर सकते हैं। इसके लिए किसी अतिरिक्त सेटिंग्स की आवश्यकता नहीं है।

लिंक पर क्लिक करके, आप XML को SharePoint में सभी उपलब्ध सूचियों और पुस्तकालयों के साथ देखेंगे, दोनों मानक और व्यवस्थापक द्वारा बनाए गए। उदाहरण के लिए, उपयोगकर्ताओं की सूची URL पर उपलब्ध है:

http://{server_name}/_vti_bin/listdata.svc/UserInformationList

डेटा प्रोटोकॉल खोलें

ओपन डेटा प्रोटोकॉल डेटा को क्वेरी और अपडेट करने के लिए एक ओपन वेब प्रोटोकॉल है। प्रोटोकॉल आपको अनुरोधों के रूप में HTTP आदेशों का उपयोग करके संसाधनों के साथ संचालन करने की अनुमति देता है और JSON या XML स्वरूपों में प्रतिक्रियाएं प्राप्त करता है।

जब आप किसी वेब सेवा से उपयोगकर्ताओं की सूची प्राप्त करते हैं, तो आप देखेंगे कि यह न केवल उपयोगकर्ताओं को, बल्कि समूहों को भी लौटाता है। वे ContentType तत्व के मान में भिन्न हैं। उपयोगकर्ताओं के लिए, ContentType "व्यक्ति" पर सेट है। अब, केवल उपयोगकर्ताओं को फ़िल्टर करने के लिए, हम वेब सेवा की ओडटा के साथ काम करने की क्षमता का लाभ उठाएंगे। आपको URI में $ फ़िल्टर चर जोड़ने की आवश्यकता है:

http://{server_name}/_vti_bin/listdata.svc/UserInformationList?$filter=ContentType eq 'Person'

नतीजतन, हमें सभी उपयोगकर्ताओं की एक सूची मिलती है।

जैसे ही आप टाइप करते हैं वेब पार्ट गतिशील उपयोगकर्ता नाम विस्तार का उपयोग करता है। इसलिए, आपको उपयोगकर्ता नाम सहित खोज करने और उसके द्वारा क्रमबद्ध करने की आवश्यकता है। हम फ़िल्टरिंग स्थिति को जटिल करते हैं:

http://{server_name}/_vti_bin/listdata.svc/UserInformationList?$filter=((ContentType eq 'Person') and (substringof(Name,'{query}')))&$orderby=Name

अब चयन के परिणामों में केवल ऐसे उपयोगकर्ता होते हैं जिनके नाम में विकल्प {क्वेरी} होता है।

जैसा कि आप देखेंगे, वेब सेवा बहुत सारी जानकारी लौटाती है जिसकी हमेशा जरूरत नहीं होती है। इसलिए, परिणामी फ़ाइल का आकार निर्दिष्ट करके कम किया जा सकता है कि हम किन क्षेत्रों को प्राप्त करना चाहते हैं। ऐसा करने के लिए, $ चुनिंदा चर जोड़ें:

http://{server_name}/_vti_bin/listdata.svc/UserInformationList?$filter=((ContentType eq 'Person') and (substringof(Name,'{query}')))&$orderby=Name&$select=Id,Name,ContentType

अब परिणामी फ़ाइल में केवल तीन फ़ील्ड हैं जिन्हें हमने निर्दिष्ट किया है।

ठीक है, लचीलेपन के लिए, मैंने व्यर्थ नहीं बात की; ओडटा मापदंडों के साथ एक प्रश्न किसी भी जटिल हो सकता है। तो, किसी भी कीमत पर, आप किसी भी वर्कशीट या SharePoint लाइब्रेरी से डेटा प्राप्त कर सकते हैं, चाहे वह समाचार हो, दस्तावेजों की सूची हो, या कुछ और।

जैसा कि मैंने शुरुआत में कहा था, SharePoint Foundation REST इंटरफ़ेस न केवल आपको डेटा प्राप्त करने देता है, बल्कि उन्हें जोड़, संपादित और हटा भी सकता है। आप इसे कैसे करें और ओपन डेटा प्रोटोकॉल की अन्य विशेषताओं के बारे में अधिक पढ़ सकते हैं:

http://www.odata.org/developers/protocols/operations

कोई C # नहीं, jQuery का उपयोग करें

वेब सेवा के निजी उपयोग के लिए आगे बढ़ते हैं। आइए इसके आधार पर एक छोटा सा वेब पार्ट बनाएं।

योजनाबद्ध रूप से, वेब भाग इस तरह दिखेगा:

प्रारंभिक अवस्था

उपयोगकर्ता नाम लिखना प्रारंभ करें

उपयोगकर्ता का चयन किया गया

जैसा कि पहले उल्लेख किया गया है, हम सर्वर पर कुछ भी प्रोग्राम नहीं करेंगे। सब कुछ क्लाइंट की तरफ जाता है और jQuery और $ .ajax () का उपयोग करके निष्पादित किया जाएगा। बेशक, आप स्टूडियो और परिनियोजन में कोई प्रोजेक्ट बनाए बिना नहीं कर सकते, लेकिन आपको किसी विशेष प्रोग्रामर को नियुक्त करने की आवश्यकता नहीं है और आप किसी भी वेब डेवलपर के प्रयासों का सामना कर सकते हैं।

एक वेब पार्ट प्रोजेक्ट बनाएं और उसमें सभी आवश्यक फाइलें जोड़ें:

एक वेब पार्ट बनाएँ

यह सभी फ़ाइलों के साथ प्रोजेक्ट की संरचना है

अब आपको cc और JavaScript फ़ाइलों को ascx नियंत्रण से कनेक्ट करने की आवश्यकता है। EmployeesWebPartUserControl.ascx खोलें और कोड पेस्ट करें:

 //  css  jQuery Autocomplete <SharePoint:CssRegistration ID="jquery_autocomplete" Name="/_layouts/EmployeesWebPart/css/jquery.autocomplete.css" After="corev4.css" runat="server" /> //  css ,        - <SharePoint:CssRegistration ID="webpart_base" Name="/_layouts/EmployeesWebPart/css/webpart.css" After="corev4.css" runat="server" /> //  javascripts <script src="/_layouts/EmployeesWebPart/js/webpart.include.js" type="text/javascript"></script> 

वेब पार्ट के HTML कोड को एक ही फाइल में पेस्ट करें:

 <div><input type="search" name="wpuser_search" id="wpuser_search" placeholder="Search users as you type..." /></div> <div> <div> <div id="wpuser_image"><img src="" /></div> <div> <div id="wpuser_name"></div> <div id="wpuser_position"></div> <div id="wpuser_departament"></div> <div id="wpuser_status"></div> </div> </div> <div> <div>Ask me about:</div> <div id="wpuser_asklist"></div> <ul> <li id="wpuser_phone"><span>Mobile:</span> <a href=""></a></li> <li id="wpuser_email"><span>Email:</span> <a href=""></a></li> </ul> </div> </div> 

इसे हमारे वेब पार्ट के लिए एक टेम्प्लेट के रूप में कहा जा सकता है। JQuery का उपयोग करते हुए खाली divs में हम $ .ajax () के माध्यम से प्राप्त मूल्यों को दर्ज करेंगे;

दरअसल, की गई तैयारियों के साथ, अब हम कोड लिखने के लिए आगे बढ़ सकते हैं।

उपयोगकर्ताओं की सूची प्राप्त करने का तरीका सरल और सीधा है:

 // URL -    var serviceUrl = "/_vti_bin/listdata.svc/UserInformationList?$filter=ContentType eq 'Person'&$orderby=Name"; //   $.ajax({ 'type': 'GET', 'url': serviceUrl, 'dataType': 'json', 'success': function(data){ userSearch(data['d']['results']); } }); 

पैरामीटर जोड़ने के लिए मत भूलना:

 'dataType': 'json' 

इसके बिना, वेब सेवा JSON के बजाय XML को वापस कर देगी।

वास्तव में, मैंने एक छोटा धोखा दिया और jQuery के स्वतः पूर्ण प्लगइन का उपयोग किया

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

 function userSearch(data){ $field = $("#wpuser_search"); //    $field.autocomplete(data, { formatItem: function (item) { return item.Name }, matchContains: true }); $field.result(function (event, data, formatted) { userShowInfo(data); }); } 

स्वतः पूर्ण उपयोगकर्ता नाम फ़ील्ड तैयार है। यह शेष उपयोगकर्ता की जानकारी दिखाने के लिए बना हुआ है:

 function showUserInfo(data) { // name $("#wpuser_name").text(data.Name); // email $("#wpuser_email a").text(data.WorkEMail).attr('href', 'mailto:' + data.WorkEMail); // phone $("#wpuser_phone a").text(data.MobilePhone).attr('href', 'callto:' + data.MobilePhone); // departament $("#wpuser_departament").text(data.Department); // picture $("#wpuser_image img").attr('src', data.Picture.split(", ")[0]); // position $("#wpuser_position").text(data.Title); // ask me abolut list $("#wpuser_asklist").text(data.AskMeAbout); } 

फ़ंक्शन वेब सेवा से डेटा के साथ हमारे टेम्पलेट को भर देगा।

वह सब है। जैसा कि वादा किया गया था, विकास प्रक्रिया के दौरान किसी भी सर्वर-साइड प्रोग्रामिंग का उपयोग नहीं किया गया था। मैंने इसे सरल और स्पष्ट बनाने के लिए कोड को सरल बनाया। तुरंत मैं कहूंगा कि आपको अभी भी साइट के संग्रह के पथ और उप-साइट के पथ पर विचार करने की आवश्यकता है जहां वेब भाग वाला पृष्ठ निहित है। एक ही संग्रह और एक ही उप-साइट से वेब सेवा के लिए पथ बनाने के लिए यह आवश्यक है।

मुझे उम्मीद है कि SharePoint Foundation REST इंटरफ़ेस का परिचय सुखद था और आप इसे अपनी परियोजनाओं में सही ढंग से उपयोग कर सकते हैं। अ छा!

पूरी परियोजना यहां डाउनलोड की जा सकती है:

SVN http://users-list-webpart.googlecode.com/svn/trunk/

अतिरिक्त लिंक:

• Microsoft SharePoint 2010: sharepoint.microsoft.com
• SharePoint Foundation REST इंटरफ़ेस: msdn.microsoft.com/en-us/library/ff521587.aspx
• डेटा प्रोटोकॉल खोलें: odata.org
• एक प्रतिष्ठित सेवा क्या है: en.wikipedia.org/wiki/REST
• jQuery अतुल्यकालिक HTTP (Ajax) अनुरोध: api.jquery.com/jQuery.ajax