SoShin_
소신
SoShin_
전체 방문자
오늘
어제
  • 분류 전체보기
    • Study
      • HTML | CSS
      • JavaScript
      • Django
      • Python
      • Flask
      • Git
      • Project
      • 이것저것
      • 코딩테스트
      • NestJS
    • Review
      • Book
      • Movie & Drama

블로그 메뉴

  • 홈
  • 태그
  • 방명록

공지사항

인기 글

태그

  • SQLite
  • openpyxl
  • 장고
  • MongoDB
  • 위도경도
  • flask orm
  • 파이썬
  • 영화추천
  • orm
  • node.js
  • FLASK
  • Django
  • Django 유효성 검증
  • 장고 제네릭뷰
  • 자바스크립트
  • js
  • allauth
  • 문제풀이
  • Django allauth
  • 장고 allauth
  • KakaoAPI
  • db
  • 장고 유저기능
  • SQLAlchemy
  • 영화리뷰
  • 플라스크
  • 유저기능
  • Python
  • 코딩테스트
  • JavaScript

최근 댓글

최근 글

티스토리

hELLO · Designed By 정상우.
SoShin_

소신

Study/JavaScript

[JavaScript] Ajax에 대하여

2021. 12. 24. 10:16
반응형

현재 프로젝트를 진행하며 데이터를 받아올 때 새로고침이 되는 부분을 새로고침이 안되게 바꾸고 싶어 찾아보니 Ajax라는 것을 사용하면 된다고 하여 학습한 후 정리해보겠습니다.


Ajax란?

Ajax란 Asynchronous JavaScript and XML의 약자로 빠르게 동작하는 동적인 웹 페이지를 만들기 위한 개발 기법의 하나입니다.

 

Ajax는 웹 페이지 전체를 다시 로딩하지 않고도, 웹 페이지의 일부분만을 갱신할 수 있습니다.

즉 Ajax를 이용하면 백그라운드 영역에서 서버와 통신하여, 그 결과를 웹 페이지의 일부분에만 표시할 수 있습니다.

 

이때 서버와는 다음과 같은 형태의 데이터를 주고받을 수 있습니다.

 

 - JSON

 - XML

 - HTML

 - 텍스트 파일 등


Ajax의 장점

 

1. 웹 페이지 전체를 다시 로딩하지 않고도, 웹 페이지의 일부분만을 갱신할 수 있습니다.✨

2. 웹 페이지가 로드된 후에 서버로 데이터 요청을 보낼 수 있습니다.

3. 웹 페이지가 로드된 후에 서버로부터 데이터를 받을 수 있습니다.

4. 백그라운드 영역에서 서버로 데이터를 보낼 수 있습니다.


Ajax의 한계

1. Ajax는 클라이언트가 서버에 데이터를 요청하는 클라이언트 풀링 방식을 사용하므로, 서버 푸시 방식의 실시간 서비스는 만들 수 없습니다.

2. Ajax로는 바이너리 데이터를 보내거나 받을 수 없습니다.

3. Ajax 스크립트가 포함된 서버가 아닌 다른 서버로 Ajax 요청을 보낼 수는 없습니다.

4. 클라이언트의 PC로 Ajax 요청을 보낼 수는 없습니다.


Ajax 프레임워크

Ajax를 이용하여 개발을 손쉽게 할 수 있도록 미리 여러 가지 기능을 포함해 놓은 개발 환경

 - Prototype

 - script.aculo.us

 - dojo

 - jQuery

반응형

'Study > JavaScript' 카테고리의 다른 글

[JS] value, textContent, innerHTML, innerText 는 어떻게 다를까?  (0) 2022.02.08
[JavaScript] JS와 jQuery를 사용하여 Flask에서 데이터를 json으로 받아 사용하기  (0) 2021.12.25
JavaScript Date / 자바스크립트 날짜, 시간 / Date 객체  (0) 2021.12.06
자바스크립트 switch문 / JavaScript switch / 조건문  (0) 2021.12.06
자바스크립트 if문 / JavaScript if statement / 조건문  (0) 2021.12.06
    'Study/JavaScript' 카테고리의 다른 글
    • [JS] value, textContent, innerHTML, innerText 는 어떻게 다를까?
    • [JavaScript] JS와 jQuery를 사용하여 Flask에서 데이터를 json으로 받아 사용하기
    • JavaScript Date / 자바스크립트 날짜, 시간 / Date 객체
    • 자바스크립트 switch문 / JavaScript switch / 조건문
    SoShin_
    SoShin_
    직접 쓰는 개발 블로그

    티스토리툴바