에이잭스

에이잭스(Ajax)는 "Asynchronous JavaScript and XML"의 약자로서, "비동기식 자바스크립트와 XML"을 뜻한다. Ajax라고 소문자로 쓰기도 한다. 웹 페이지 전체를 리로드(reload)하지 않고 필요한 부분의 데이터만 서버로 보내고 받아와서 해당 부분만 갱신해 주는 기술이다. 검색어 자동완성 기능 등에 사용된다. '에이잭스'라고 읽지만, '아작스'라고 읽는 사람도 있다.

개요

에이잭스(Ajax)는 자체가 하나의 특정한 기술이 아니다. 여러 개의 기술을 묶어 지칭하는 용어이며, 대화식 웹 애플리케이션의 제작을 위해 사용된다. 에이잭스(AJAX) 애플리케이션을 지원하는 웹브라우저로는 인터넷 익스플로러, 오페라, 사파리, 파이어폭스 등이 있다.

특징

에이잭스(Ajax)는 기존에 사용되던 기술을 함께 사용하여, 웹 페이지의 일부분만 갱신할 수 있는 개발 방법이다.

• 웹 페이지의 표현을 위한 HTML과 CSS
• 화면 구성을 동적으로 조작하기 위한 DOM
• 서버와 비동기식으로 통신하기 위한 XMLHttpRequest
• 데이터 교환을 하기 위한 XML
• 사용자의 작업을 제어하는데 사용되는 JavaScript

동작원리

1. 웹 브라우저 인터페이스에서 JavaScript 함수를 호출한다.
2. XMLHttpRequest 객체의 인스턴스를 생성한다.
3. HTML의 상태를 가지고 있는 XML을 서버로 전송한다.
4. 서버에서 전송한 요청을 자체로 처리한 후 다시 웹 브라우저로 전송한다.
5. XML의 데이터를 받은 XMLHttpRequest 객체는 HTML의 상태를 포함해 인터페이스로 전송하여 업데이트한다.

기본 문법

에이잭스(Ajax) 기본 문법

• url : url 요청을 의미한다.
• type : 데이터 전송방식
• cache : 요청 페이지의 캐시 여부
• datatype : 서버에서 받아올 데이터를 어떤 형태로 해석할지 선택할 수 있다.
• data : 서버로 데이터를 전송할 때 사용한다.
• success : 에이잭스(Ajax) 통신에 성공 시 실행되는 이벤트
• error : 에이잭스(Ajax) 통신에 실패 시 실행되는 이벤트로 request, status, error로 정보를 확인할 수 있다.

장단점

장점

1. 웹 페이지의 전체를 로딩하지 않고, 일부분을 갱신할 수 있다.
2. 지속해서 백그라운드에서 서버와 통신할 수 있다.
3. 페이지의 이동 없이 빠른 화면 전환이 가능하다.

단점

1. 무제한 요청, 응답으로 인한 서버 부하로 사이트 마비 가능성이 있다.
2. 에이잭스(Ajax)를 사용할 수 없는 브라우저에 대한 문제가 있다.
3. HTTP 클라이언트의 기능이 한정돼 있다.
4. 오픈소스이므로 차별화를 두기 어렵다.

제한사항

다음 제한사항은 에이잭스(Ajax)를 개발하기 전에 보다 주목해야 할 일부 단점이다.

• 브라우저의 지원 : 모든 브라우저에서 JavaScript와 XMLHttpRequest를 지원하지 않는다. 브라우저 중에서도 해당 오브젝트가 서로 다르게 처리 될 수 있어 각 브라우저에서 에이잭스(Ajax) 구현을 고려해야 한다. 또한 모든 사용자가 웹 애플리케이션에 엑세스할 수 있는 방법을 제공해야 한다.

• 보안 및 개인정보 보호 : 에이잭스(Ajax)는 보안에 취약한 문제가 있어 개발 시 보안 및 사용자의 개인정보 보호에 대한 문제를 고려해야 한다.

• 검색 엔진 : 에이잭스(Ajax) 애플리케이션 자체에서 검색할 수 없지만, 검색 가능한 애플리케이션에서는 에이잭스(Ajax)의 기능 및 요소를 사용할 수 있다.

활용

에이잭스(Ajax)는 페이지의 일부분에 새로운 콘텐츠를 로드하는 기능은 사용자의 경험을 보다 더 향상 시켜줄 수 있다. 페이지의 일부를 수정하면 사용자가 전체 페이지의 로드를 기다릴 필요가 없기 때문이다. 활용 예시로는 라이브검색 및 자동완성, 검색어 추천 기능, 사용자 정보 표시 등 여러 가지가 있다.

참고자료

• Do Dat, 〈Ajax란?〉, 《티스토리》, 2017-10-12
• 시각화를 배우고 정리합니다, 〈Ajax 개념 및 활용방향〉, 《티스토리》, 2015-07-07

같이 보기

• 프로그래밍 언어
• 자바스크립트
• XML
• HTML
• CSS

이 에이잭스 문서는 프로그래밍에 관한 토막글입니다. 위키 문서는 누구든지 자유롭게 편집할 수 있습니다. [편집]을 눌러 이 문서의 내용을 채워주세요.

개발 : 프로그래밍 □■⊕, 소프트웨어, 데이터, 솔루션, 보안, 하드웨어, 컴퓨터, 사무자동화, 인터넷, 모바일, 사물인터넷, 게임, 메타버스, 디자인 프로그래밍 언어 ASP • C 언어 • C++ • C# • CSS • D 언어 • HTML • HTML5 • JSP • PHP • R • XHTML • XML • XSLT • 고(Go) • 고급언어 • 기계어 • 델파이 • 러스트 • 루비 • 루아 • 리액트 • 리퀴디티 • 무브 • 미켈슨 • 베이직 • 브이비스크립트 • 비주얼 C++ • 비주얼베이직(VB) • 비주얼베이직닷넷(VB.NET) • 솔리디티 • 스몰토크 • 스위프트 언어 • 스칼라 • 스크립트 언어 • 알골 • 어셈블리 • 언리얼스크립트 • 얼랭 • 에이잭스(Ajax) • 엠에프씨(MFC) • 오브젝티브-C • 오브젝트 파스칼 • 오카멜 • 웹어셈블리(WASM) • 이와즘(eWASM) • 자바 • 자바스크립트 • 저급언어 • 제이슨(JSON) • 제이쿼리(jQuery) • 카멜 • 코볼 • 코틀린 • 콜드퓨전 • 타입스크립트 • 파스칼 • 파워스크립트 • 파이썬 • 펄(Perl) • 포트란 • 프로씨(Pro-C) • 피엘에스큐엘(PL/SQL) • 피엘원(PL/I) • 하스켈 개발방법론 CBD 개발방법론 • EA • 구조적 개발방법론 • 객체지향 개발방법론 • 라이브러리 • 람다 아키텍처 • 모듈 • 모듈화 • 벤치마킹 • 소프트웨어 개발방법론 • 스크럼 • 스프린트 • 아키텍처 • 아키텍트 • 애자일 • 웹개발방법론 • 정보공학 개발방법론 • 컴포넌트 • 테일러링 • 템플릿 • 폭포수 모델 • 프로젝트 • 프로토타입 • 피드백 코딩 EUC-KR • UTF-8 • 값 • 글루웨어 • 노팔로우 링크 • 두팔로우 링크 • 디버깅 • 디코딩 • 마크업 • 버그 • 부트스트랩 • 세이브포인트 • 소스코드 • 시큐어코딩 • 아스키 • 액티브엑스 • 오픈소스 • 유니코드 • 인코딩 • 재컴파일 • 주석 • 컴파일 • 컴퓨터 프로그램 • 코드 • 코딩 • 태그 • 테스트 • 테이블 • 텍스트 • 파싱 • 퍼블리싱 • 퓨니코드 • 하드코딩 • 하이퍼링크 • 하이퍼텍스트 프로그래밍 C 명령어 • 객체 • 객체지향 • 객체지향 프로그래밍 • 거짓 • 관계연산자 • 기본형 변수 • 널 • 논리 • 논리연산 • 논리연산자 • 다중상속 • 다형성 • 대입 • 대입문 • 대입연산자 • 더블 • 도스 명령어 • 디폴트 • 레지스터변수 • 루프 • 리눅스 명령어 • 리턴 • 메모리 주소 • 메소드 • 멤버 • 명령문 • 명령어 • 무한루프 • 문자 • 문자열 • 바이트 • 반복문 • 배열 • 변수 • 분기 • 분기문 • 불린 • 브레이크 • 비교연산자 • 비트연산자 • 산술연산자 • 상속 • 상수 • 생성자 • 선언 • 선언문 • 설정자 • 속성 • 스위치 • 스태틱 • 시프트연산자 • 실행 • 실행문 • 어노테이션 • 에코 • 역참조 • 연산 • 연산문 • 연산자 • 오버로딩 • 오버라이딩 • 외부변수 • 윈도우 명령어 • 유닉스 명령어 • 인스턴스 • 인스트럭션 • 인클루드 • 인터페이스 • 임포트 • 입력 • 입력문 • 입출력 • 입출력문 • 자료형(데이터 타입) • 자바 명령어 • 자바 예약어 • 자바 컬렉션 • 전역변수 • 접근자 • 접근제어자 • 정보은닉 • 정수형 • 정적변수 • 제어 • 제어문 • 제어자 • 조건 • 조건문 • 조건연산자 • 주소 • 증감연산자 • 지역변수 • 참 • 참조 • 참조변수 • 초기화 • 추상메소드 • 추상클래스 • 추상화 • 출력 • 출력문 • 캡슐화 • 케이스 • 클래스 • 파라미터(매개변수) • 파이널 • 패키지 • 퍼블릭 • 포인터 • 프라이빗 • 프로텍티드 • 필드(멤버변수) • 함수 • 환경변수 명령어 abstract • array • boolean • break • byte • case • char • continue • default • double • do while • echo • elif • else • else if • false • final • float • for • gosub • goto • if • if else • import • include • int • join • long • long long • null • print • printf • println • private • protected • public • return • scanf • short • stdio.h • static • string • switch • temp • then • true • unsigned • void • while 디자인패턴 구조패턴 • 동시성패턴 • 동시실행패턴 • 모델-뷰-컨트롤러 패턴 • 상태패턴 • 생성패턴 • 싱글톤패턴 • 아키텍처패턴 • 전략패턴 • 커맨드패턴 • 행동패턴 프로그래밍 인물 귀도 반 로썸 • 그레이스 머레이 호퍼 • 니클라우스 비르트 • 댄 브릭클린 • 더그 커팅 • 데니스 리치 • 리누스 토르발스 • 리처드 그린블라트 • 마거릿 해밀턴 • 마크 앤드리슨 • 빈트 서프 • 빌 게이츠 • 빌 조이 • 스티브 잡스 • 에이다 러브레이스 • 제임스 고슬링 • 척 벤턴 • 켄 톰슨 • 팀 패터슨 위키 : 자동차, 교통, 지역, 지도, 산업, 기업, 단체, 업무, 생활, 쇼핑, 블록체인, 암호화폐, 인공지능, 개발, 인물, 행사, 일반