Ajax(프로그래밍)

Ajax (programming)
「AJAX」는 여기서 리다이렉트 됩니다.다른 용도는 Ajax(동음이의)를 참조하십시오.
비동기 JavaScript 및 XML
처음 등장한1999년 3월
파일 이름 확장자.disclosed(비활성화)
파일 형식자바스크립트
영향을 받다
JavaScript 및 XML

Ajax(AJAX /eeddʒʒksks;;;;;;;[1][2] short short shortasyasyasyasyasyasyasyasyasyasyasyasyasyasyasyasyasyasyasy)는 클라이언트 측에서 다양한 웹 기술을 사용하여 비동기 웹 응용 프로그램을 만드는 웹 개발 기술 세트입니다.Ajax를 사용하면 웹 애플리케이션은 기존 페이지의 표시와 동작을 방해하지 않고 (백그라운드에서) 비동기적으로 서버에서 데이터를 보내고 가져올 수 있습니다.Ajax는 데이터 교환 계층을 프레젠테이션 계층에서 분리함으로써 웹 페이지, 나아가 웹 애플리케이션을 전체 [3]페이지를 새로고침할 필요 없이 동적으로 콘텐츠를 변경할 수 있습니다.실제로 최신 구현에서는 일반적으로 XML 대신 JSON을 사용합니다.

Ajax는 기술이 아니라 프로그래밍 개념입니다.HTML 및 CSS를 조합하여 마크업 및 스타일 정보를 사용할 수 있습니다.웹 페이지는 JavaScript에 의해 동적으로 표시되도록 수정될 수 있으며 사용자가 새로운 정보와 상호 작용할 수 있습니다.내장된 XMLHttpRequest 객체는 웹 페이지에서 Ajax를 실행하기 위해 사용되며 웹 사이트가 페이지를 새로 고치지 않고 화면에 콘텐츠를 로드할 수 있습니다.Ajax는 새로운 기술도 아니고 새로운 언어도 아닙니다.대신에, 그것은 새로운 방식으로 사용되는 기존 기술이다.

역사

1990년대 초중반 대부분의 웹사이트는 완전한 HTML 페이지를 기반으로 했습니다.각 사용자 작업을 수행하려면 서버에서 완전히 새로운 페이지를 로드해야 합니다.사용자 경험에서 알 수 있듯이 이 프로세스는 비효율적이었습니다. 즉, 모든 페이지 내용이 사라지고 새 페이지가 나타납니다.일부 변경으로 인해 브라우저가 페이지를 새로고침할 때마다 일부 정보만 변경되었음에도 불구하고 모든 콘텐츠를 다시 전송해야 했습니다.이로 인해 서버에 부하가 가중되어 대역폭이 퍼포먼스의 제한 요인이 되었습니다.

1996년에 iframe 태그는 Internet Explorer에 의해 도입되었습니다.객체 요소와 마찬가지로 콘텐츠를 비동기적으로 로드하거나 가져올 수 있습니다.1998년 Microsoft Outlook Web Access 팀은 XMLHttpRequest 스크립트 오브젝트의 [4]배후에 있는 개념을 개발했습니다.1999년 [6]3월에 Internet Explorer 5.0과 함께 출하된 MSXML [4][5]라이브러리의 두 번째 버전에서는 XMLHTTP로 표시되었습니다.

IE 5의 Windows XMLHTTP ActiveX 컨트롤 기능은 나중에 Mozilla Firefox, Safari, Opera, Google Chrome 및 기타 브라우저에서 XMLHtpRequest JavaScript [7]개체로 구현되었습니다.Microsoft는 Internet Explorer 7에서 네이티브 XMLHttpRequest 모델을 채택했습니다.ActiveX 버전은 Internet Explorer에서 계속 지원되지만 Microsoft Edge에서는 지원되지 않습니다.이러한 백그라운드 HTTP 요청과 비동기 웹 테크놀로지의 유틸리티는 Outlook Web Access(2000)[8]나 Oddpost(2002)와 같은 대규모 온라인 애플리케이션에 등장하기 전까지는 상당히 불명확한 상태로 남아 있었습니다.

구글은 Gmail(2004)과 Google Maps(2005)[9]를 표준 준거의 크로스 브라우저 Ajax를 광범위하게 배포했다.2004년 10월 Kayak.com의 공개 베타 릴리스는 당시 개발자들이 "xml http thing"[10]이라고 부르는 최초의 대규모 전자 상거래 사용 중 하나였습니다.이로 인해 웹 프로그램 개발자들 사이에서 Ajax에 대한 관심이 높아졌습니다.

AJAX라는 용어는 Jesse James Garrett에 의해 2005년 2월 18일 구글 [1]페이지에서 사용되는 기술에 기초한 AJAX라는 기사에서 공개적으로 사용되었습니다.

2006년 4월 5일, World Wide Web Consortium(W3C)은 공식 [11]웹 표준을 작성하기 위해 XMLHttpRequest 객체의 첫 번째 규격 초안을 발표했습니다.XMLHttpRequest 객체의 최신 초안은 2016년 [12]10월 6일에 공개되었으며 XMLHttpRequest 사양은 현재 살아있는 [13]표준입니다.

테크놀로지

Ajax를 사용하는 응용 프로그램과 웹 응용 프로그램의 기존 모델

Ajax라는 용어는 페이지의 현재 상태를 방해하지 않고 백그라운드에서 서버와 통신하는 웹 애플리케이션을 구현하는 데 사용할 수 있는 광범위한 웹 기술 그룹을 나타냅니다.Ajax라는 용어를 만든 기사에서 Jesse [1][3]James Garrett은 다음과 같은 기술이 통합되어 있다고 설명했습니다.

그러나 그 이후 Ajax 어플리케이션에서 사용되는 테크놀로지와 Ajax라는 용어 자체의 정의에 많은 발전이 있었습니다.XML은 데이터 교환에 필요하지 않으므로 데이터 조작에 XSLT가 필요하지 않습니다.JSON(JavaScript Object Notation)은 데이터 [14]교환을 위한 대체 포맷으로 자주 사용되지만,[15] 미리 포맷된 HTML이나 일반 텍스트와 같은 다른 포맷도 사용할 수 있습니다.JQuery를 비롯한 다양한 인기 JavaScript 라이브러리는 Ajax 요청 실행을 지원하는 추상화를 포함합니다.

예

JavaScript 예시

JavaScript로 작성된 GET 메서드를 사용한 간단한 Ajax 요청의 예입니다.

get-module-data.module:

// 이것은 클라이언트 측 스크립트입니다.  // HTTP 요청을 초기화합니다. 허락하다 xhr = 신규 XMLHttpRequest(); // 요청 정의 xhr.열다.(「취득」, '데이터 전송'php');  // 요청 상태 변경을 추적합니다. xhr.준비 상태 변경 = 기능. () {  컨스턴트 다 했어요. = 4; // readyState 4는 요청이 완료되었음을 의미합니다.  컨스턴트 네 알겠습니다 = 200; // 상태 200은 정상 복귀입니다.  한다면 (xhr.준비 상태 === 다 했어요.) {   한다면 (xhr.상황 === 네 알겠습니다) {    콘솔.로그.(xhr.대답본문); // '이것이 출력입니다.'   } 또 다른 {    콘솔.로그.('오류: ' + xhr.상황); // 요청 중 오류가 발생했습니다.   }  } };  // 요청을 send-ajax-data로 보냅니다.php xhr.보내세요(무효);

send-module-data를 지정합니다.php:

<?개요 // 이것은 서버측 스크립트입니다.  // 콘텐츠 유형을 설정합니다. 머리글자('Content-Type: 텍스트/일반');  // 데이터를 다시 보냅니다. 메아리치다 "이것이 결과입니다."; ?>

가져오기 예

Fetch는 새로운 네이티브 JavaScript [16]API입니다.Google Developers Documentation에 따르면, "Fetch는 이전 XMLHttpRequest보다 웹 요청을 만들고 응답을 처리하는 것을 더 쉽게 합니다."

가지고 오다('데이터 전송'php')     .그리고나서(데이터. => 콘솔.로그.(데이터.))     .또 만나 (에러 => 콘솔.로그.('오류:' + 에러));

ES7 비동기/대기 예시

비동기 기능. doAjax1() {     해라 {         컨스턴트 인식하다 = 기다리다 가지고 오다('데이터 전송'php');         컨스턴트 데이터. = 기다리다 인식하다.본문();         콘솔.로그.(데이터.);     } 또 만나 (에러) {         콘솔.로그.('오류:' + 에러);     } }  doAjax1();

가져오기 기능은 JavaScript 약속에 의존합니다.

그fetch사양이 다르다Ajax다음과 같은 중요한 방법으로요.

  • 에서 돌아온 약속fetch() 는 응답이 HTTP 404 또는 500인 경우에도 HTTP 오류 상태에서 거부하지 않습니다.대신 서버가 헤더로 응답하면 Promise는 정상적으로 해결됩니다.ok응답의 속성이 false로 설정되어 있는 것은 응답이 200 ~1200 의 범위에 있지 않은 경우입니다.또, 네트워크 장해가 발생했을 경우나, 요구가 완료되지 않게 된 경우에 한정해 거부됩니다.
  • fetch() credentials init 옵션을 설정하지 않으면 크로스 컨버전스쿠키는 송신되지 않습니다.(2018년 4월부터).규격에서 기본 자격 증명 정책을 다음과 같이 변경했습니다.same-origin. Firefox는 61.0b13 이후 변경되었습니다.)

「 」를 참조해 주세요.

레퍼런스

  1. ^ a b c 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. ^ "Ajax - Web developer guides". MDN Web Docs. Archived from the original on 28 February 2018. Retrieved 27 February 2018.
  3. ^ a b Ullman, Chris (March 2007). Beginning Ajax. wrox. ISBN 978-0-470-10675-4. Archived from the original on 5 July 2008. Retrieved 24 June 2008.
  4. ^ a b "Article on the history of XMLHTTP by an original developer". Alexhopmann.com. 31 January 2007. Archived from the original on 23 June 2007. Retrieved 14 July 2009.
  5. ^ "Specification of the IXMLHTTPRequest interface from the Microsoft Developer Network". Msdn.microsoft.com. Archived from the original on 26 May 2016. Retrieved 14 July 2009.
  6. ^ Dutta, Sunava (23 January 2006). "Native XMLHTTPRequest object". IEBlog. Microsoft. Archived from the original on 6 March 2010. Retrieved 30 November 2006.
  7. ^ "Dynamic HTML and XML: The XMLHttpRequest Object". Apple Inc. Archived from the original on 9 May 2008. Retrieved 25 June 2008.
  8. ^ Hopmann, Alex. "Story of XMLHTTP". Alex Hopmann’s Blog. Archived from the original on 30 March 2010. Retrieved 17 May 2010.
  9. ^ "A Brief History of Ajax". Aaron Swartz. 22 December 2005. Archived from the original on 3 June 2010. Retrieved 4 August 2009.
  10. ^ English, Paul (12 April 2006). "Kayak User Interface". Official Kayak.com Technoblog. Archived from the original on 23 May 2014. Retrieved 22 May 2014.
  11. ^ van Kesteren, Anne; Jackson, Dean (5 April 2006). "The XMLHttpRequest Object". W3.org. World Wide Web Consortium. Archived from the original on 16 May 2008. Retrieved 25 June 2008.
  12. ^ Kesteren, Anne; Aubourg, Julian; Song, Jungkee; Steen, Hallvord R. M. "XMLHttpRequest Level 1". W3.org. W3C. Archived from the original on 13 July 2017. Retrieved 19 February 2019.
  13. ^ "XMLHttpRequest Standard". xhr.spec.whatwg.org. Retrieved 21 April 2020.
  14. ^ "JavaScript Object Notation". Apache.org. Archived from the original on 16 June 2008. Retrieved 4 July 2008.
  15. ^ "Speed Up Your Ajax-based Apps with JSON". DevX.com. Archived from the original on 4 July 2008. Retrieved 4 July 2008.
  16. ^ "Fetch API - Web APIs". MDN. Archived from the original on 29 May 2019. Retrieved 30 May 2019.

외부 링크

Wikimedia Commons에는 AJAX(프로그래밍) 관련 미디어가 있습니다.
Wikibooks는 다음 주제에 관한 책을 가지고 있습니다.에이잭스
  • [1] Ajax: 웹 애플리케이션에 대한 새로운 접근법 - Ajax 용어 및 Q&A를 만든 기사
  • 컬리의 에이잭스(프로그래밍)
  • GET, POST, 텍스트 및 XML 예제를 포함한 Ajax 튜토리얼.