라이선스란?

  • 넓은 의미에서의 라이선스

    • 면허, 면허증
    • 특정한 일을 할 수 있는 자격을 행정기관에서 허가 하는 일
  • 소프트웨어에서의 라이선스

    • 소프트웨어를 사용할 수 있는 권한 또는 사용을 허가한다는 내용을 담은 문서

Free Software License

  • 공짜가 아닌 자유(금전적인 측면이 아님)
  • 자유의 의미
    • 프로그램을 어떠한 목적을 위해서도 실행할 수 있는 자유
    • 프로그램의 작동 원리를 연구하고 이를 자신의 필요에 맞게 변경시킬 수 있는 자유
    • 이웃을 돕기 위해서 프로그램을 복제하고 배포할 수 있는 자유
    • 프로그램을 향상시키고 이를 공동체 전체의 이익을 위해서 다시 환원시킬 수 있는 자유

Free Software Foundation

  • 1985 10월 4일 리처드 스톨만이 세움
  • 소프트웨어의 자유로운 복사와 배포,개선을 촉진하기 위한 조직
  • 주요 활동
    • 자유소프트웨어 철학 및 유지관리
    • 저작권을 가진 자유 소프트웨어의 보호
  • http://www.fsf.org

라이선스 분류

  • GPL 호환 자유소프트웨어 라이선스
    • GPL, LGPL, Apache 2.0 등등...
  • GPL 비호환 자유소프트웨어 라이선스
    • Apache 1.0, BSD, MPL 등등…
  • NonFree 소프트웨어 라이선스
    • Code Project License, JSON 등등…

라이선스 종류

GPL (The GNU General Public License)

  • 자유소프트웨어재단에서 만든 라이선스로 GNU 프로젝트로 배포하는 소프트웨어에 적용하기 위하여 리처드스톨만이 만들었다.
  • 오픈 소스들 중에서 많이 알려져 있고 의무사항들도 다른 오픈 소스 라이선스에 비해 엄격한 편이다.
  • GPL프로그램은 어떤 목적으로, 어떤 형태로든 사용할 수 있지만 사용하거나 변경된 프로그램을 배포하는 경우 무조건 동일한 라이선스로 공개해야 하며. ”본 제품(SW)은 GPL 라이선스 하에 배포되는 SW인 ○○○ (사용한 GPL SW 이름)를 포함합니다”와 같은 문구를 매뉴얼 혹은 그에 준하는 매체에 포함시키고, GPL 전문을 첨부해야 한다.
  • 컴퓨터 프로그램을 어떠한 목적으로든지 사용할 수 있다. 다만 법으로 제한하는 행위는 할 수 없다.
  • 컴퓨터 프로그램의 실행 복사본은 언제나 프로그램의 소스 코드와 함께 판매하거나 소스코드를 무료로 배포해야 한다.
  • 변경된 소스프로그램의 소스코드를 용도에 따라 변경 할 수 있다.
  • 변경된 컴퓨터 프로그램 역시 프로그램의 소스코드를 반드시 공개 배포해야 한다.
  • 변경된 프로그램 역시 반드시 똑같은 라이선스를 취해야 한다. 즉, GPL 라이선스를 적용해야 한다.
항목여부
저작권 보호
상용 소프트웨어에서 사용 가능
버그 패치 및 기능 확장 제공의 의무
명시적 특허권 행사 가능 여부아니오
사유 프로그램 (소스 비공개 프로그램)에서 사용 가능 여부아니오
라이선스 전파 여부

AGPL (Affero General Public License)

  • GPL을 기반을 만든 라이선스로 버전 1, 2는 Affero, 버전 3은 자유소프트웨어재단에 의해 개발됐다.
  • 이 라이선스는 수정한 소스코드를 서버에서만 사용하는 개발자가 그 프로그램을 배포하지 않을 경우 사용자는 소스코드를 가질 수가 없는 문제를 해결하기 위해 마련됐다.
  • 서버에서 프로그램을 실행해 다른 사용자들과 통신하면, 실행되고 있는 프로그램의 소스코드를 사용자들이 다운로드할 수 있게 해야 한다는 조항을 담고 있다.

LGPL (The Lesser GNU General Public License)

  • LGPL은 자유소프트웨어재단이 일부 라이브러리(Library)에 대하여 GPL보다 소스코드의 공개 정도를 다소 완화된 형태로 사용할 수 있도록 만든 라이선스이다. (GPL의 제약을 완화시킨 라이선스)
  • 상용 라이브러리와 동일한 기능을 제공하는 오픈 소스 라이브러리에 GPL과 같은 엄격한 라이선스를 적용하면 소스코드를 공개해야 하기 때문에 개발자들이 사용을 꺼려할 것이기 때문에 이를 막고 오픈 소스의 사용을 장려하기 위해 만들어 졌다.
  • LGPL이 적용된 라이브러리는 원 프로그램의 소스코드를 공개하지 않고 이에 사용된 오픈 소스의 소스코드만 공개하면 된다.
  • 원래는 한정된 라이브러리에만 적용하려는 의도로 Library GPL이라는 이름을 붙였으나, 모든 라이브러리에 적용된다는 오해를 사 Lesser GPL로 2.1버전에서 변경되었다.
  • LGPL 라이선스를 가지고 있는 라이브러리를 동적 링크할 경우 소스공개의 의무가 사라짐
  • LGPL 라이선스 라이브러리를 수정시에는 수정된 라이브러리 소스는 공개해야 한다.
  • 현재 GNU 재단에서 밀고 있다.
항목여부
저작권 보호
상용 소프트웨어에서 사용 가능
버그 패치 및 기능 확장 제공의 의무
명시적 특허권 행사 가능 여부아니오
사유 프로그램 (소스 비공개 프로그램)에서 사용 가능 여부
라이선스 전파 여부

The BSD(Berkely Software Distribution) License

  • BSD는 버클리의 캘리포니아 대학에서 배포하는 공개 SW라이선스로 SW의 소스코드를 공개하지 않아도 되는 대표적인 오픈 소스 SW의 라이선스 중 하나이다.
  • 이렇게 BSD의 라이선스의 허영범위가 넓은 이유는 BSD라이선스로 배포되는 프로젝트가 미국 정부에서 제공한 재원으로 운영되었기 때문이다. (미국 공공기관에서 지원. 미국인의 세금으로 만들어진 소프트웨어)
  • 즉, SW에 대한 대가를 미국 국민의 세금으로 미리 지불했기 때문에 사람들에게 그들이 원하는 방식으로 SW를 사용하거나 만들도록 허가된 것이다. (공공성을 강조)
  • 따라서 BSD라이선스의 소스코드를 이용하여 새로운 프로그램을 개발하여도 새로운 프로그램의 소스코드를 공개하지 않고 BSD가 아닌 다른 라이선스를 적용하여 판매할 수 있다.(소스를 자유롭게 이용, 배포 가능)
항목여부
저작권 보호
상용 소프트웨어에서 사용 가능
버그 패치 및 기능 확장 제공의 의무아니오
명시적 특허권 행사 가능 여부아니오
사유 프로그램 (소스 비공개 프로그램)에서 사용 가능 여부
라이선스 전파 여부아니오

MPL(Mozilla Public License)

  • Mozilla 재단에서 MS Explorer 점유율 상승으로 Netscape 소스 공개 결정하고, GPL의 제약과 BSD의 불안감에 의해 새로운 라이선스의 개발했다.
  • 프로그램의 자유로운 사용, 복제, 배포, 수정을 허용한다.
  • MPL은 Netscape브라우저의 소스코드를 공개하기 위해 개발된 라이선스로 공개하여야 할 소스코드의 범위를 좀 더 명확하게 정의하고 있다.
  • 즉, GPL에서는 링크되는 SW의 소스코드를 포함하여 공개하여야 할 소스코드의 범위가 모호하게 정의되어 있지만, MPL에서는 링크 등의 여부에 상관없이 원래의 소스코드가 아닌 새로운 파일에 작성된 소스코드에 대해서는 공개의 의무가 발생하지 않는다.
  • 따라서 MPL SW 그 자체는 어떻게 하든 공개를 해야 하지만 원래 소스코드에 없던 새로운 파일들은 공개할 의무가 발생하지 않는다.

The Apache License, Version 2.0

  • 아파치 소프트웨어 재단(Apache Software Foundation)에서 만든 규정이다.
  • 아파치 웹 서버를 포함한 아파치 재단의 모든 SW에 적용되는 라이선스로 BSD라이선스와 비슷하여 소스코드 공개 등의 의무가 발생하지 않는다.
  • 다만 "Apache"라는 이름에 대한 상표권을 침해하지 않아야 한다라는 조항이 명시적으로 들어가 있고, 특허권에 대한 내용이 포함되어 있다.
  • 아파치 라이선스 소스코드를 수정해 배포하는 경우 아파치 라이선스 버전 2.0을 꼭 포함시켜야 하며 아파치 재단에서 만든 소프트웨어임을 밝혀야 한다.
  • 누구나 해당소프트웨어에서 파생된 프로그램 제작가능, 저작권 양도, 배포 가능이다.
  • 소스 공개 의무 없음
항목여부
저작권 보호
상용 소프트웨어에서 사용 가능
버그 패치 및 기능 확장 제공의 의무아니오
명시적 특허권 행사 가능 여부
사유 프로그램 (소스 비공개 프로그램)에서 사용 가능 여부
라이선스 전파 여부아니오

The MIT License

  • MIT는 미국 Massachusetts Institute of Technology에서 해당 대학 SW 공학도들을 돕기 위해 개발한 라이선스이다.
  • 라이선스와 저작권 관련 명시만 지켜주면 되는 라이선스로, BSD라이선스를 기초로 작성되었으며 소스코드를 수정하여 배포 시에도 반드시 오픈 소스로 배포해야 한다는 규정이 없어 GPL등의 엄격함을 피하려는 사용자들에게 인기가 많다.
항목여부
저작권 보호
상용 소프트웨어에서 사용 가능
버그 패치 및 기능 확장 제공의 의무아니오
명시적 특허권 행사 가능 여부아니오
사유 프로그램 (소스 비공개 프로그램)에서 사용 가능 여부
라이선스 전파 여부아니오

CPOL(The Code Project Open License)

항목여부
저작권 보호
상용 소프트웨어에서 사용 가능
버그 패치 및 기능 확장 제공의 의무아니오
명시적 특허권 행사 가능 여부
사유 프로그램 (소스 비공개 프로그램)에서 사용 가능 여부
라이선스 전파 여부아니오

CDDL (The Common Development and Distribution License)

항목여부
저작권 보호
상용 소프트웨어에서 사용 가능
버그 패치 및 기능 확장 제공의 의무
명시적 특허권 행사 가능 여부
사유 프로그램 (소스 비공개 프로그램)에서 사용 가능 여부
라이선스 전파 여부아니오

Ms-PL (The Microsoft Public License)

항목여부
저작권 보호
상용 소프트웨어에서 사용 가능
버그 패치 및 기능 확장 제공의 의무아니오
명시적 특허권 행사 가능 여부
사유 프로그램 (소스 비공개 프로그램)에서 사용 가능 여부
라이선스 전파 여부아니오

MPL 1.1 (The Mozilla Public License 1.1)

항목여부
저작권 보호
상용 소프트웨어에서 사용 가능
버그 패치 및 기능 확장 제공의 의무
명시적 특허권 행사 가능 여부
사유 프로그램 (소스 비공개 프로그램)에서 사용 가능 여부
라이선스 전파 여부아니오

CPL (The Common Public License Version 1.0)

항목여부
저작권 보호
상용 소프트웨어에서 사용 가능
버그 패치 및 기능 확장 제공의 의무
명시적 특허권 행사 가능 여부
사유 프로그램 (소스 비공개 프로그램)에서 사용 가능 여부
라이선스 전파 여부아니오

The Eclipse Public License 1.0

항목여부
저작권 보호
상용 소프트웨어에서 사용 가능
버그 패치 및 기능 확장 제공의 의무
명시적 특허권 행사 가능 여부
사유 프로그램 (소스 비공개 프로그램)에서 사용 가능 여부
라이선스 전파 여부아니오

The Creative Commons Attribution-ShareAlike 2.5 License

항목여부
저작권 보호
상용 소프트웨어에서 사용 가능
버그 패치 및 기능 확장 제공의 의무아니오
명시적 특허권 행사 가능 여부아니오
사유 프로그램 (소스 비공개 프로그램)에서 사용 가능 여부아니오
라이선스 전파 여부

The zlib/libpng License

항목여부
저작권 보호
상용 소프트웨어에서 사용 가능
버그 패치 및 기능 확장 제공의 의무아니오
명시적 특허권 행사 가능 여부아니오
사유 프로그램 (소스 비공개 프로그램)에서 사용 가능 여부
라이선스 전파 여부아니오

공개 커뮤니티에 대한 공헌 (라이선스 아님)

항목여부
저작권 보호아니오
상용 소프트웨어에서 사용 가능
버그 패치 및 기능 확장 제공의 의무아니오
명시적 특허권 행사 가능 여부아니오
사유 프로그램 (소스 비공개 프로그램)에서 사용 가능 여부
라이선스 전파 여부아니오

출처


'기타' 카테고리의 다른 글

소프트웨어 라이선스  (0) 2019.03.17
HTTP 응답 코드 및 메소드  (0) 2018.11.06
YouTube to MP3 - 유투브 MP3 다운받기  (0) 2018.10.27
C/C++와 JAVA 비교  (0) 2018.01.10
REST API란?  (0) 2017.12.10
JSON이란?  (0) 2017.12.10

기타 유틸리티 메소드

jQuery는 타입 검사 메소드뿐만 아니라 편리한 기능을 제공하는 다수의 유틸리티 메소드를 제공한다.

$.each() 메소드

$.each() 메소드는 객체나 배열에서 모두 사용할 수 있는 범용적인 반복 함수(iterator function)이다.

length 속성이 있는 배열이나 배열과 같은 객체를 전달받아, 그 길이만큼 반복해서 콜백함수를 실행한다. 객체의 경우에는 객체가 가지고 있는 프로퍼티의 개수만큼 반복해서 콜백함수를 실행한다.

다음 예제는 $.each() 메소드에 배열을 인수로 전달하여, 각 배열 요소를 출력하는 예제이다.

var arr = ["a", "b", "c"];
$.each(arr, function(index, value) {
  $("#text").append("index=" + index + ", value=" + value + "<br>");
});

코드 실행

다음 예제는 $.each() 메소드에 객체를 인수로 전달하여 객체의 각 프로퍼티를 출력하는 예제이다.

var site = {
  "name" : "devkuma",
  "url" : "www.devkuma.com"
};

$.each(site, function(key, value) {
       $("#text").append("key=" + key + ", value=" + value + "<br>");
});

코드 실행

$.extend() 메소드

$.extend() 메소드는 두 개 이상의 객체의 모든 프로퍼티를 하나의 객체로 병합한다.

이 메소드는 인수로 전달받은 첫 번째 객체에 두 번째 객체의 모든 프로퍼티를 추가한다.
그리고서 첫 번째 객체에 세 번째 객체의 모든 프로퍼티를 추가한다.
이와 같은 순서대로 인수로 전달받은 모든 객체의 프로퍼티를 첫 번째 객체에 모두 추가한다.

var obj1 = {
  "name" : "google",
};
    
var obj2 = {
  "url" : "www.google.com",
  "adc" : "def"
};
    
var obj3 = {
  "name" : "devkuma",
  "url" : "www.devkuma.com",
  "book" : "jQuery" 
};

$.extend(obj1, obj2, obj3);
$.each(obj1, function(key, value) {
  $("#text").append("key=" + key + ", value=" + value + "<br>");
});

코드 실행

위의 예제는 obj1 객체에 obj2 객체와 obj3 객체의 모든 프로퍼티를 순서대로 병합한다.
이때 중복되는 name 프로퍼티의 값은 가장 마지막으로 추가된 값이 설정된다.
따라서 name 프로퍼티의 값은 가장 마지막으로 병합한 obj3 객체의 devkuma 프로퍼티의 값으로 설정된다.

$.extend() 메소드에 인수로 전달되는 첫 번째 객체는 원본 객체 자체가 변형된다는 사실에 유의해야 한다.

$.trim() 메소드

$.trim() 메소드는 문자열의 시작과 끝에 위치한 공백 문자(whitespace)를 제거한다.

var text = "   안녕하세요. 데브쿠마입니다.   ";
$("#text").append("trim 전, '" + text + "'<br>");
$("#text").append("trim 후, '" + $.trim(text) + "'");

코드 실행

범용 유틸리티 메소드

메소드설명
$.contains()DOM 요소가 다른 DOM 요소의 자손(descendant) 요소인지 아닌지를 검사함.
$.unique()DOM 요소 배열을 정렬하고, 중복된 요소를 제거함.
$.each()객체나 배열에서 모두 사용할 수 있는 범용적인 반복 함수(iterator function)임.
$.data()선택한 요소와 관련된 데이터를 저장하거나, 저장된 데이터값을 읽어옴.
$.removeData()저장된 데이터를 제거함.
$.queue()선택한 요소의 실행될 함수 큐(queue)를 참조하거나 조작함.
$.dequeue()선택한 요소의 함수 큐에서 다음 함수를 실행함.
$.extend()두 개 이상의 객체의 콘텐츠를 하나의 객체로 병합함.
$.noop()빈 함수를 의미함.
$.proxy()함수를 전달받은 후, 특정 콘텍스트(context)를 가지는 새로운 함수를 반환함.
$.now()현재 시각을 나타내는 숫자를 반환함.
$.trim()문자열의 시작과 끝에 위치한 공백 문자(whitespace)를 제거함.

$.inArray() 메소드

$.inArray() 메소드는 전달받은 값을 배열에서 검색한 후, 값이 일치하는 요소의 인덱스를 반환한다. 만약 배열에 전달받은 값과 일치하는 요소가 없으면 -1을 반환한다.

예제

var arr = ["devkuma", 123, "abc"];
    
$("#text").append("devkuma : " + $.inArray("devkuma", arr) + "<br>");
$("#text").append("123 : " + $.inArray(123, arr) + "<br>");
$("#text").append("abc : " + $.inArray("abc", arr) + "<br>");
$("#text").append("def : " + $.inArray("def", arr));

코드 실행

배열에 관련된 메소드

메소드설명
$.makeArray()배열과 같은 객체(array-like object)를 자바스크립트 Array 객체로 변환함.
$.inArray()전달받은 값을 배열에서 검색한 후, 값이 일치하는 요소의 인덱스를 반환함. 만약 일치하는 요소가 없으면 -1을 반환함.
$.map()배열이나 객체의 모든 요소를 새로운 배열로 변환함.
$.merge()두 개의 배열의 콘텐츠를 하나의 배열로 병합함.
$.grep()배열에서 필터 함수를 만족하는 요소를 검색함. 원본 배열은 변경되지 않음.

파싱에 관련된 메소드

메소드설명
$.parseHTML()DOM 노드 배열을 문자열로 파싱함.
$.parseJSON()잘 구성된(well-formed) JSON 문자열을 전달받은 후, 자바스크립트 객체로 반환함.
$.parseXML()XML 문서를 문자열로 파싱함.

참조


유틸리티 메소드

jQuery는 프로그래밍을 하는 데 도움이 되는 다수의 유틸리티 메소드를 제공한다.

타입 검사 메소드

jQuery는 인수로 전달받은 값의 타입을 손쉽게 확인해 주는 다음과 같은 메소드를 제공한다.

메소드설명
$.type()전달받은 값을 자바스크립트의 내부 클래스와 비교하여, 더욱 정확한 타입 검사를 제공함.
$.isArray()전달받은 값이 배열인지 아닌지를 검사함.
$.isFunction()전달받은 값이 자바스크립트 함수 객체인지 아닌지를 검사함.
$.isNumeric()전달받은 값이 자바스크립트 Number 객체인지 아닌지를 검사함.
$.isEmptyObject()전달받은 값이 비어있는 객체(열거할 수 있는 프로퍼티를 가지고 있지 않은 객체)인지 아닌지를 검사함.
$.isPlainObject()전달받은 값이 기본 객체(plain object)인지 아닌지를 검사함.
$.isWindow()전달받은 값이 자바스크립트 Window 객체인지 아닌지를 검사함.
$.isXMLDoc()전달받은 DOM 노드가 XML 문서에 포함되어 있거나, XML 문서인지 아닌지를 검사함.

$.type() 메소드

자바스크립트의 typeof 연산자는 값에 따라 부정확하거나 모순된 타입 검사 결과를 반환한다.
하지만 jQuery는 전달받은 값을 자바스크립트의 내부 클래스와 비교하여, 더욱 정확한 타입 검사를 제공하는 $.type() 메소드를 제공한다.

예제

$("#text")
    .append($.type(undefined) +"<br>")          // undefined
    .append($.type() +"<br>")                   // undefined
    .append($.type(window.notDefined) +"<br>")  // undefined
    .append($.type(null) +"<br>")               // null       
    .append($.type(true) +"<br>")               // boolean
    .append($.type(new Boolean()) +"<br>")      // boolean
    .append($.type(3) +"<br>")                  // number
    .append($.type(new Number(3)) +"<br>")      // number
    .append($.type("test") +"<br>")             // string
    .append($.type(new String("test")) +"<br>") // string
    .append($.type(function(){}) +"<br>")       // function
    .append($.type([]) +"<br>")                 // array
    .append($.type(new Array()) +"<br>")        // array
    .append($.type(new Date()) +"<br>")         // date
    .append($.type(new Error()) +"<br>")        // error - as of jQuery 1.9
    .append($.type(Symbol()) +"<br>")           // symbol - as of jQuery 1.9
    .append($.type(Object(Symbol())) +"<br>")   // symbol - as of jQuery 1.12
    .append($.type(/test/) +"<br>");            // regexp

코드 실행

특정 타입 검사 메소드

jQuery는 $.type() 메소드뿐만 아니라 전달된 값이 특정 타입의 값인지 아닌지를 검사해 주는 다양한 메소드를 제공한다.

예제

$("#text")
    .append($.isArray([]) + "<br>")                      // true
    .append($.isArray(10) + "<br>")                      // false
    .append($.isFunction(new Function()) + "<br>")       // true
    .append($.isFunction("문자열") + "<br>")               // false
    .append($.isNumeric(10) + "<br>")                     // true
    .append($.isNumeric([10]) + "<br>")                   // false
    .append($.isEmptyObject({}) + "<br>")                 // true
    .append($.isEmptyObject({name: "text"}) + "<br>")     // false
    .append($.isPlainObject(new Object()) + "<br>")       // true
    .append($.isPlainObject(new Object("text")) + "<br>") // false
    .append($.isWindow(window) + "<br>")                  // true
    .append($.isXMLDoc(document) + "<br>");               // false

코드 실행

참조


Ajax와 Form 요소

Ajax에서는 서버와의 비동기식 통신을 위해 form 요소를 통해 입력받은 데이터를 직렬화(serialization)하여 전송한다.

이때 직렬화(serialization)란 입력받은 여러 데이터를 하나의 쿼리 문자열로 만드는 것을 의미한다.
이렇게 함으로써 form 요소를 통해 입력받은 데이터를 한 번에 서버로 보낼 수 있게 된다.

직렬화(serialization)

jQuery에서는 HTML form 요소를 통해 입력된 데이터의 직렬화 작업을 매우 간단하게 수행할 수 있다.
.serialize() 메소드와 .serializeArray() 메소드를 이용하여 손쉽게 데이터를 직렬화할 수 있다. .serialize() 메소드는 HTML form 요소를 통해 입력된 데이터를 쿼리 문자열로 변환한다.
.serializeArray() 메소드는 serialize() 메소드와는 달리 입력된 데이터를 문자열이 아닌 배열 객체로 변환한다.

다음 예제는 <form>요소에 .serialize()를 한 값을 표시한다.

function showValues() {
    $("#text").text($("form").serialize());
}
$("input[type='text']").on("keydown", showValues);
$("input[type='checkbox'], input[type='radio']").on("click", showValues);
$("select").on("change", showValues);

코드 실행

한글이 포함된 입력 데이터가 쿼리 문자열로 변환될 때는 퍼센트 인코딩(percent-encoding)을 통해 변환된다.
이때 모든 한글 문자는 퍼센트 기호(%)를 포함한 16진수 값으로 변환된다.

참조


Ajax 메소드

메소드설명
$.ajax()비동기식 Ajax를 이용하여 HTTP 요청을 전송함.
$.get()전달받은 주소로 GET 방식의 HTTP 요청을 전송함.
$.post()전달받은 주소로 POST 방식의 HTTP 요청을 전송함.
$.getScript()웹 페이지에 스크립트를 추가함.
$.getJSON()전달받은 주소로 GET 방식의 HTTP 요청을 전송하여, 응답으로 JSON 파일을 전송받음.
.load()서버에서 데이터를 읽은 후, 읽어 들인 HTML 코드를 선택한 요소에 배치함.

$.ajax() 메소드

jQuery는 Ajax와 관련된 다양하고 편리한 많은 메소드를 제공한다.

그중에서도 $.ajax() 메소드는 모든 jQuery Ajax 메소드의 핵심이 되는 통합적인 메소드이다 .
$.ajax() 메소드는 HTTP 요청을 만드는 강력하고도 직관적인 방법을 제공한다.

형식

jQuery.ajax( url [, settings] ) >> 1.5 이상버젼
jQuery.ajax( settings )  >> 1.0 이상버젼
  • url : 요청 URL (클라이언트가 HTTP 요청을 보낼 서버의 주소)
  • settings : key/value 쌍으로 된 Ajax 요청 Set ( optional )
    • url : 요청 URL (클라이언트가 HTTP 요청을 보낼 서버의 주소)
    • data : 요청과 함께 서버에 보내는 string 또는 json
    • success(data, textStatus, jqXHR) : 요청이 성공일때 실행되는 callback 함수
    • dataType : 서버에서 내려온 data 형식. ( default : xml, json, script, text, html )

메소드 체이닝(method chaining)

메소드명설명
doneHTTP 요청이 성공하면 요청한 데이터가 done() 메소드로 전달된다.
failHTTP 요청이 실패하면 오류와 상태에 관한 정보가 fail() 메소드로 전달된다.
alwaysHTTP 요청이 성공하거나 실패하는 것에 상관없이 언제나 always() 메소드가 실행된다.

예제

다음 예제는 $.ajax() 메소드에서 사용할 수 있는 대표적인 옵션을 설명한다.

$.ajax({
    url: "/rest/1/pages/245", // 클라이언트가 HTTP 요청을 보낼 서버의 URL 주소
    data: { name: "홍길동" },  // HTTP 요청과 함께 서버로 보낼 데이터
    method: "GET",   // HTTP 요청 메소드(GET, POST 등)
    dataType: "json" // 서버에서 보내줄 데이터의 타입
})
// HTTP 요청이 성공하면 요청한 데이터가 done() 메소드로 전달됨.
.done(function(json) {
    $("<h1>").text(json.title).appendTo("body");
    $("<div class=\"content\">").html(json.html).appendTo("body");
})
// HTTP 요청이 실패하면 오류와 상태에 관한 정보가 fail() 메소드로 전달됨.
.fail(function(xhr, status, errorThrown) {
    $("#text").html("오류가 발생했다.<br>")
    .append("오류명: " + errorThrown + "<br>")
    .append("상태: " + status);
})
// 
.always(function(xhr, status) {
    $("#text").html("요청이 완료되었습니다!");
});

다음 예제는 $.ajax() 메소드의 동작을 보여주는 간단한 예제이다.

var jqxhr = $.ajax("/rest/1/pages/245")
.done(function() {
  alert("성공");
})
.fail(function() {
  alert("실패");
 })
.always(function() {
  alert("완료");
});
      
jqxhr.always(function() {
  alert("두번째 성공");
});

코드 실행

$.ajaxSetup() 메소드

공통적인 기본 ajax 요청을 미리 설정하는데 사용한다.

형식

jQuery.ajaxSetup( options )
  • optional : default Ajax 요청의 설정값 ( key/value )

예제

아래 예제는 미리 $.ajaxSetup()에 기본사항들을 설정한 후 ajax 로 각각 호출한다.

$.ajaxSetup({  
  url: '/api/users',  
  global: false,   
  type: "POST"     
});  

$.ajax({  
  // url not set here; uses '/api/users'  
  data: {'name': 'Dan'}  
});

$.ajax({  
  // url not set here; uses '/api/users'  
  data: {'name': 'John'}  
}); 

$.get() 메소드

jQuery에서는 Ajax를 이용하여 GET 방식의 HTTP 요청을 구현한 $.get() 메소드를 제공한다.
이 메소드를 사용하면 서버에 GET 방식의 HTTP 요청을 보낼 수 있다.

형식

jQuery.get(  url [, data] [, success(data, textStatus, jqXHR)] [, dataType] )
  • url : 요청 URL (클라이언트가 HTTP 요청을 보낼 서버의 주소)
  • data : 요청과 함께 서버에 보내는 string 또는 map
  • success(data,textStatus,jqXHR) : 요청이 성공일때 실행되는 callback 함수
  • dataType : 서버에서 내려온 data 형식. ( default : xml,json,script,text,html )

$.ajax으로 표현

$.ajax({
  type: "GET",
  url: url,  
  data: data,  
  success: success,  
  dataType: dataType  
});  

다음 예제는 $.get() 메소드의 동작을 보여주는 간단한 예제이다.

// GET 방식으로 서버에 HTTP Request를 보냄.
$.get("/examples/media/request_ajax.php",
  { species: "고양이", name: "나비", age: 3, }, // 서버가 필요한 정보를 같이 보냄.
    function(data, status) {
      $("#text").html(data + "<br>" + status); // 전송받은 데이터와 전송 성공 여부를 보여줌.
    }
   );
});

$.post() 메소드

jQuery에서는 Ajax를 이용하여 POST 방식의 HTTP 요청을 구현한 $.post() 메소드를 제공한다.
이 메소드를 사용하면 서버에 POST 방식의 HTTP 요청을 보낼 수 있다.

형식

$.post() 메소드의 원형은 다음과 같다.

$.post(URL주소[,데이터][,콜백함수]);
  • URL 주소 : 클라이언트가 HTTP 요청을 보낼 서버의 주소이다.
  • 데이터 : HTTP 요청과 함께 서버로 보낼 데이터를 전달한다.
  • 콜백 함수 : HTTP 요청이 성공했을 때 실행할 함수를 정의한다.

$.ajax으로 표현

$.ajax({
  type: "POST",
  url: url,  
  data: data,  
  success: success,  
  dataType: dataType  
});  

예제

다음 예제는 $.post() 메소드의 동작을 보여주는 간단한 예제이다.

// POST 방식으로 서버에 HTTP Request를 보냄.
$.post("/examples/media/request_ajax.php",
  { name: "홍길동", grade: "A" },              // 서버가 필요한 정보를 같이 보냄.
  function(data, status) {
    $("#text").html(data + "<br>" + status); // 전송받은 데이터와 전송 성공 여부를 보여줌.
  }
);

$.getJSON() 메소드

서버에 데이터를 HTTP GET 방식으로 전송한 후 서버측 응답을 JSON 형식으로 받을때 사용한다.

형식

jQuery.getJSON( url [, data] [, success(data, textStatus, jqXHR)] )
  • url : 요청 Url
  • data : 요청과 함께 서버에 보내는 string 또는 map
  • success(data,textStatus,jqXHR) : 요청이 성공일때 실행되는 callback 함수

$.ajax 로 표현

$.ajax({  
  url: url,  
  dataType: 'json',  
  data: data,  
  success: callback  
});  

예제

$.getJSON("example?foo=1",   
    {   
        tags: "mount rainier",   
        tagmode: "any",   
        format: "json"   
    },   
    function(data) {   
        $.each(data.items, function(i,item) {   
          $("<img/>").attr("src", item.media.m).appendTo("#images");   
          if ( i == 3 )
              return false;   
        });   
    }); 

.load() 메소드

load() 메소드는 선택한 요소에서 호출하는 유일한 jQuery Ajax 메소드이다.

load() 메소드는 서버에서 데이터를 읽은 후, 읽어 들인 HTML 코드를 선택한 요소에 표시한다.
또한, 선택자를 URL 주소와 함께 전송하면, 읽어 들인 HTML 코드 중에서 선택자와 일치하는 요소만을 배치한다.

형식

.load( url [, data] [, complete(responseText, textStatus, XMLHttpRequest)] )
  • url : 요청 URL
  • data : 요청과 함께 서버에 보내는 string 또는 map
  • complete(responseText, textStatus, XMLHttpRequest) : 요청이 완료될때 실행되는 callback 함수

예제

다음 예제들 .load() 메소드의 다양한 형태를 보여주는 간단한 예제이다.

//  Html Content 로딩  
$('#result').load('ajax/test.html');  
  
//  Html Content 로딩 후 메시지  
$('#result').load('ajax/test.html', function() {  
  alert('Load was performed.');  
});  
  
//  Html Content #container Target 로딩  
$('#result').load('ajax/test.html #container');  
  
//  array parameter 전달 후 Html Content 로딩  
$("#objectID").load("test.asp", { 'choices[]': ["Jon", "Susan"] } );  

다음 예제는 .load() 메소드의 동작을 보여주는 간단한 예제이다.

$(function() {
    $("#btnRequest").on("click", function() {
        // URL 주소에 존재하는 HTML 코드에서 <li>요소를 읽은 후에 id가 "list"인 요소에 배치한다.
        $("#list").load("/examples.html li");
    });
});

참조


+ Recent posts