एजेक्स (प्रोग्रामिंग): Difference between revisions

From Vigyanwiki
No edit summary
Line 88: Line 88:


=== उदाहरण प्राप्त करें ===
=== उदाहरण प्राप्त करें ===
प्राप्त किया गया मूल JavaScript API है।<ref>{{cite web |title=फ़ेच एपीआई - वेब एपीआई|url=https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API#Browser_compatibility |website=MDN |access-date=30 May 2019 |archive-url=https://web.archive.org/web/20190529085752/https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API#Browser_compatibility |archive-date=29 May 2019 |url-status=live }}</ref> [https://developers.google.com/web/ilt/pwa/working-with-the-fetch-api Google Developers Documentation] के अनुसार, Fetch पुराने XMLHttpRequest की तुलना में वेब अनुरोध करना और प्रतिक्रियाओं को संभालना आसान बनाता है।
प्राप्त किया गया मूल जावास्क्रिप्ट एपीआई है।<ref>{{cite web |title=फ़ेच एपीआई - वेब एपीआई|url=https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API#Browser_compatibility |website=MDN |access-date=30 May 2019 |archive-url=https://web.archive.org/web/20190529085752/https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API#Browser_compatibility |archive-date=29 May 2019 |url-status=live }}</ref> [https://developers.google.com/web/ilt/pwa/working-with-the-fetch-api Google Developers Documentation] के अनुसार, Fetch पुराने XMLHttpRequest की तुलना में वेब अनुरोध करना और प्रतिक्रियाओं को संभालना आसान बनाता है।


<syntaxhighlight lang="javascript">
<syntaxhighlight lang="javascript">

Revision as of 22:55, 3 March 2023

"AJAX" redirects here. For other uses, see Ajax (disambiguation).

अतुल्यकालिक जावास्क्रिप्ट और एक्सएमएल
पहली प्रस्तुतिमार्च 1999
फ़ाइल नाम एक्सटेंशनएस.जेएस
फ़ाइल प्रारूपएसजावास्क्रिप्ट
Influenced by
जावास्क्रिप्ट and एक्सएमएल

अजाक्स (AJAX भी /ˈeɪdʒæks/; "एसिंक्रोनस जावास्क्रिप्ट और XML के लिए संक्षेपण)[1][2] वेब डेवलपमेंट तकनीकों का एक समुच्चय है जो अतुल्यकालिक वेब एप्लिकेशन सृजन करने के लिए क्लाइंट-साइड पर विभिन्न वेब तकनीकों का उपयोग करता है। अजाक्स के साथ वेब एप्लिकेशन उपस्थित पेज के प्रदर्शन और गतिविधि में हस्तक्षेप किए बिना वेब सर्वर से अतुल्यकालिक रूप से (पार्श्व में) डेटा प्रेषण और पुनर्प्राप्त कर सकते हैं। प्रेजेंटेशन लेयर से डेटा इंटरचेंज लेयर को पृथक करके, अजाक्स सम्पूर्ण पेज को पुनः भारण करने की आवश्यकता के बिना सामग्री को सक्रियता से परिवर्तित करने के लिए वेबपेज और एक्सटेंशन द्वारा वेब एप्लिकेशन की अनुमति देता है।[3] पद्धति में, आधुनिक कार्यान्वयन सामान्यतः एक्सएमएल के स्थान पर जावास्क्रिप्ट ऑब्जेक्ट नोटेशन का उपयोग करते हैं।

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

इतिहास

वर्ष 1990 के दशक के प्रारंभ से मध्य तक, अधिकांश वेबसाइट संपूर्ण एचटीएमएल पेज पर आधारित थीं। प्रत्येक उपयोगकर्ता कार्यकलाप के लिए सर्वर से भारण के लिए एक पूर्ण नए पृष्ठ की आवश्यकता होती है। यह प्रक्रिया अक्षम थी, जैसा कि उपयोगकर्ता अनुभव से परिलक्षित होता है: पृष्ठ की सभी विषय सूची अदृश्य हो जाती है तथा नई पृष्ठ निर्गत होती है। प्रत्येक समय आंशिक परिवर्तन के कारण ब्राउज़र द्वारा किसी पृष्ठ को पुनः भारण करने पर, सभी विषय सूची को पुनः प्रेषित करना पड़ता था, यद्यपि केवल कुछ सूचना परिवर्तित की गई थी। इसने सर्वर पर अतिरिक्त भारण डाला और बैंडविड्थ (कंप्यूटिंग) को प्रदर्शन में सीमित कारक बना दिया।

वर्ष 1996 में, आईफ्रेम टैग को इंटरनेट एक्सप्लोरर द्वारा प्रस्तावित किया गया था;[4] ऑब्जेक्ट तत्व के समान, यह विषय सूची को अतुल्यकालिक रूप से भारण या प्राप्त कर सकता है। वर्ष 1998 में, माइक्रोसॉफ्ट आउटलुक वेब एक्सेस दल ने XMLHttpRequest स्क्रिप्टिंग ऑब्जेक्ट के पीछे की अवधारणा विकसित की।[5] यह एमएसएक्सएमएल पुस्तकालय (लाइब्रेरी) के दूसरे संस्करण में एक्सएमएलएचटीटीपी के रूप में निर्गत हुआ,[5][6] जो मार्च 1999 में इंटरनेट एक्सप्लोरर 5.0 के साथ भेज दिया गया।[7]

आईई 5 में विंडोज़ XMLHTTP एक्टिवएक्स नियंत्रण की कार्यक्षमता को तत्पश्चात फ़ायरफ़ॉक्स, सफारी (वेब ​​ब्राउज़र), ओपेरा (वेब ​​ब्राउज़र), गूगल क्रोम और अन्य ब्राउज़रों द्वारा XMLHttpRequest जावास्क्रिप्ट ऑब्जेक्ट के रूप में परिपालित किया गया था।[8] माइक्रोसॉफ्ट ने इंटरनेट एक्सप्लोरर 7 के रूप में मूल XMLHttpRequest मॉडल को अपनाया। एक्टिव एक्स संस्करण अभी भी इंटरनेट एक्सप्लोरर में समर्थित है, लेकिन माइक्रोसॉफ्ट एज में नहीं। इन पार्श्व HTTP अनुरोधों और अतुल्यकालिक वेब तकनीकों की उपयोगिता तब तक अति अस्पष्ट रही जब तक कि यह आउटलुक वेब एक्सेस (2000) और ओडपोस्ट (2002)  में बृहत् परिमाण पर ऑनलाइन अनुप्रयोगों में प्रदर्शित होने लगी।[9]

गूगल ने जीमेल (2004) और गूगल मैप्स (2005) के साथ मानक-अनुपालन, क्रॉस ब्राउज़र अजाक्स का व्यापक परिनियोजन किया।[10] अक्टूबर 2004 में कायक.कॉम का सार्वजनिक बीटा रिलीज़ उन पहली बृहत् परिमाण की ई-कॉमर्स उपयोगों में से एक था जिसे उस समय उनके विकासकर्ताओं ने "एक्सएमएल एचटीटीपी थिंग" कहा था।[11] इसने वेब प्रोग्राम विकासकर्ताओं के बीच अजाक्स में रुचि बढ़ाई।

अजाक्स शब्द का सार्वजनिक रूप से उपयोग 18 फरवरी 2005 को जेसी जेम्स गैरेट द्वारा गूगल पेजों पर उपयोग की जाने वाली तकनीकों के आधार पर अजाक्स: ए न्यू एप्रोच टू वेब एप्लीकेशंस नामक लेख में किया गया था। [1]

5 अप्रैल 2006 को, वर्ल्ड वाइड वेब कंसोर्टियम (W3C) ने आधिकारिक वेब मानक बनाने के प्रयास में XMLHttpRequest ऑब्जेक्ट के लिए पहला प्रारुप विनिर्देश विमोचित किया।[12]XMLHttpRequest ऑब्जेक्ट का नवीनतम प्रारुप 6 अक्टूबर 2016 को प्रकाशित किया गया था,[13] और XMLHttpRequest विनिर्देश अब एक जीवन स्तर है।[14]



प्रौद्योगिकी

वेब एप्लिकेशन की तुलना मेंअजाक्स का उपयोग करने वाले एप्लिकेशन के लिए पारंपरिक मॉडल

अजाक्स शब्द वेब प्रौद्योगिकियों के एक व्यापक समूह का प्रतिनिधित्व करने के लिए आया है जिसका उपयोग वेब एप्लिकेशन को लागू करने के लिए किया जा सकता है जो पेज की वर्तमान स्थिति में हस्तक्षेप किए बिना पृष्ठभूमि में एक सर्वर के साथ संचार करता है। अजाक्स शब्द गढ़ने वाले लेख में, जेसी जेम्स गैरेट ने समझाया कि निम्नलिखित तकनीकों को सम्मिलित किया गया है:[1][3]

  • एचटीएमएल (या एक्सएचटीएमएल) और सीएसएस प्रस्तुति के लिए
  • डॉक्यूमेंटऑब्जेक्ट मॉडल (DOM) डेटा के गतिशील प्रदर्शन और सहभागिता के लिए
  • डेटा के आदान-प्रदान के लिए JSON या XML और XML परिचालन के लिए XSLT
  • अतुल्यकालिक संचार के लिए XMLHttpRequest उद्देश्य
  • इन तकनीकों को एक साथ लाने के लिए जावास्क्रिप्ट

हालांकि तब से, अजाक्स एप्लिकेशन में उपयोग की जाने वाली तकनीकों में और अजाक्स शब्द की परिभाषा में कई विकास हुए हैं। इसलिए अब डेटा इंटरचेंज के लिए XML और डेटा के परिचालन के लिए XSLT की आवश्यकता नहीं है। जावास्क्रिप्ट ऑब्जेक्ट नोटेशन (JSON) को प्रायः डेटा इंटरचेंज के लिए एक वैकल्पिक प्रारूप के रूप में उपयोग किया जाता है,[15] हालांकि अन्य प्रारूप जैसे पूर्वनिर्मित HTML या प्लेन टेक्स्ट का भी उपयोग किया जा सकता है।[16] JQuery सहित विभिन्न प्रकार की लोकप्रिय जावास्क्रिप्ट लाइब्रेरी में अजाक्स अनुरोधों को निष्पादित करने में सहायता के लिए संक्षेपण सम्मिलित हैं।

उदाहरण

जावास्क्रिप्ट उदाहरण

जावास्क्रिप्ट में लिखित GET (HTTP) पद्धति का उपयोग करते हुए एक साधारण अजाक्स अनुरोध का एक उदाहरण।

get-AJAX-data.js: 

// This is the client-side script.

// Initialize the HTTP request.
let xhr = new XMLHttpRequest();
// define the request
xhr.open('GET', 'send-ajax-data.php');

// Track the state changes of the request.
xhr.onreadystatechange = function () {
	const DONE = 4; // readyState 4 means the request is done.
	const OK = 200; // status 200 is a successful return.
	if (xhr.readyState === DONE) {
		if (xhr.status === OK) {
			console.log(xhr.responseText); // 'This is the output.'
		} else {
			console.log('Error: ' + xhr.status); // An error occurred during the request.
		}
	}
};

// Send the request to send-ajax-data.php
xhr.send(null);

भेजें-AJAX-data.php: 

<?php
// This is the server-side script.

// Set the content type.
header('Content-Type: text/plain');

// Send the data back.
echo "This is the output.";
?>


उदाहरण प्राप्त करें

प्राप्त किया गया मूल जावास्क्रिप्ट एपीआई है।[17] Google Developers Documentation के अनुसार, Fetch पुराने XMLHttpRequest की तुलना में वेब अनुरोध करना और प्रतिक्रियाओं को संभालना आसान बनाता है। 

fetch('send-ajax-data.php')
    .then(data => console.log(data))
    .catch (error => console.log('Error:' + error));


ES7 async/प्रतीक्षा उदाहरण

async function doAjax1() {
    try {
        const res = await fetch('send-ajax-data.php');
        const data = await res.text();
        console.log(data);
    } catch (error) {
        console.log('Error:' + error);
    }
}

doAjax1();

फ़ेच जावास्क्रिप्ट की प्रतिज्ञा पर निर्भर करता है। फ़ेच fetch के विनिर्देश Ajaxअजाक्स से निम्नलिखित महत्वपूर्ण तरीकों से भिन्न हैं:

  • वादा से लौट आया fetch() प्रतिक्रिया HTTP 404 या 500 होने पर भी HTTP त्रुटि स्थिति पर अस्वीकार नहीं होगी। इसके बजाय, जैसे ही सर्वर शीर्षलेखों के साथ प्रतिक्रिया करता है, वादा सामान्य रूप से हल हो जाएगा (के साथ) ok यदि प्रतिक्रिया 200–299 की सीमा में नहीं है, तो प्रतिक्रिया की संपत्ति गलत पर सेट हो जाती है), और यह केवल नेटवर्क विफलता पर या किसी भी चीज़ के अनुरोध को पूरा होने से रोके जाने पर अस्वीकार कर देगी।
  • fetch()जब तक आप क्रेडेंशियल init विकल्प सेट नहीं करते हैं, तब तक लाने () क्रॉस-मूल कुकीज़ नहीं भेजेगा। (अप्रैल 2018 से युक्ति ने डिफ़ॉल्ट क्रेडेंशियल नीति को समान-मूल में बदल दिया। फ़ायरफ़ॉक्स 61.0b13 से बदल गया।)

यह भी देखें

संदर्भ

  1. ↑ 1.0 1.1 1.2 Jesse James Garrett (18 February 2005). "Ajax: A New Approach to Web Applications". AdaptivePath.com. Archived from the original on 10 September 2015. Retrieved 19 June 2008.
  2. ↑ "अजाक्स - वेब डेवलपर गाइड". MDN Web Docs. Archived from the original on 28 February 2018. Retrieved 27 February 2018.
  3. ↑ 3.0 3.1 Ullman, Chris (March 2007). अजाक्स शुरू करना. wrox. ISBN 978-0-470-10675-4. Archived from the original on 5 July 2008. Retrieved 24 June 2008.
  4. ↑ Joita, Alin (1 January 2011). "DISADVANTAGES PRESENTED BY HTML INLINE FRAMES IN INTEGRATION OF 3rd PARTY CONTENT". {{cite journal}}: Cite journal requires |journal= (help)
  5. ↑ 5.0 5.1 "मूल डेवलपर द्वारा XMLHTTP के इतिहास पर लेख". Alexhopmann.com. 31 January 2007. Archived from the original on 23 June 2007. Retrieved 14 July 2009.
  6. ↑ "Microsoft डेवलपर नेटवर्क से IXMLHTTPRequest इंटरफ़ेस की विशिष्टता". Msdn.microsoft.com. Archived from the original on 26 May 2016. Retrieved 14 July 2009.
  7. ↑ Dutta, Sunava (23 January 2006). "नेटिव XMLHTTPRequest ऑब्जेक्ट". IEBlog. Microsoft. Archived from the original on 6 March 2010. Retrieved 30 November 2006.
  8. ↑ "Dynamic HTML and XML: The XMLHttpRequest Object". Apple Inc. Archived from the original on 9 May 2008. Retrieved 25 June 2008.
  9. ↑ Hopmann, Alex. "XMLHTTP की कहानी". Alex Hopmann’s Blog. Archived from the original on 30 March 2010. Retrieved 17 May 2010.
  10. ↑ "अजाक्स का एक संक्षिप्त इतिहास". Aaron Swartz. 22 December 2005. Archived from the original on 3 June 2010. Retrieved 4 August 2009.
  11. ↑ English, Paul (12 April 2006). "कयाक यूजर इंटरफेस". Official Kayak.com Technoblog. Archived from the original on 23 May 2014. Retrieved 22 May 2014.
  12. ↑ van Kesteren, Anne; Jackson, Dean (5 April 2006). "XMLHttpRequest ऑब्जेक्ट". W3.org. World Wide Web Consortium. Archived from the original on 16 May 2008. Retrieved 25 June 2008.
  13. ↑ Kesteren, Anne; Aubourg, Julian; Song, Jungkee; Steen, Hallvord R. M. "XMLHttpRequest स्तर 1". W3.org. W3C. Archived from the original on 13 July 2017. Retrieved 19 February 2019.
  14. ↑ "XMLHttpRequest मानक". xhr.spec.whatwg.org. Retrieved 21 April 2020.
  15. ↑ "जावास्क्रिप्ट ऑब्जेक्ट नोटेशन". Apache.org. Archived from the original on 16 June 2008. Retrieved 4 July 2008.
  16. ↑ "JSON के साथ अपने अजाक्स-आधारित ऐप्स को गति दें". DevX.com. Archived from the original on 4 July 2008. Retrieved 4 July 2008.
  17. ↑ "फ़ेच एपीआई - वेब एपीआई". MDN. Archived from the original on 29 May 2019. Retrieved 30 May 2019.


बाहरी संबंध

Retrieved from ‘https://www.vigyanwiki.in/index.php?title=एजेक्स_(प्रोग्रामिंग)&oldid=108440’