[javascript] 동일 출처 정책을 우회하는 방법

document.domain방법

• 방법의 유형 : iframe이 .

이것은 document.domain의 값을 현재 도메인의 접미사로 설정하는 iframe 방법입니다. 그렇게하면 더 짧은 도메인이 후속 원점 확인에 사용됩니다. 예를 들어, 문서의 스크립트 http://store.company.com/dir/other.html가 다음 명령문 을 실행 한다고 가정하십시오 .

document.domain = "company.com";

해당 명령문이 실행 된 후 페이지는로 원본 검사를 통과합니다 http://company.com/dir/page.html. 그러나 동일한 논리에 의해, company.com는 설정할 수 없습니다 document.domain 에 othercompany.com.

이 방법을 사용하면 기본 도메인에서 소싱 된 페이지의 하위 도메인에서 소싱 된 iframe에서 자바 스크립트를 예상 할 수 있습니다. Firefox와 같은 브라우저 document.domain에서는 완전히 외계인 도메인 으로 변경할 수 없으므로이 방법은 도메인 간 리소스에 적합하지 않습니다 .

출처 : https://developer.mozilla.org/en/Same_origin_policy_for_JavaScript

Cross-Origin 리소스 공유 방법

• 방법의 유형 : AJAX .

CORS ( Cross-Origin Resource Sharing )는 여러 출처에서 소스에 액세스 할 때 브라우저와 서버가 통신해야하는 방법을 정의하는 W3C 실무 초안입니다. CORS의 기본 개념은 사용자 정의 HTTP 헤더를 사용하여 브라우저와 서버가 서로에 대해 충분히 알도록하여 요청 또는 응답의 성공 또는 실패 여부를 판별하는 것입니다.

사용자 지정 헤더 를 사용 GET하거나 POST사용하지 않고 본문이 인 간단한 요청의 경우 text/plain라는 추가 헤더와 함께 요청이 전송됩니다 Origin. Origin 헤더에는 요청 페이지의 출처 (프로토콜, 도메인 이름 및 포트)가 포함되어 있으므로 서버가 응답을 제공해야하는지 여부를 쉽게 결정할 수 있습니다. 예제 Origin헤더는 다음과 같습니다.

Origin: http://www.stackoverflow.com

서버는 요청이 허용되어야한다고 결정하면 전송 된 Access-Control-Allow-Origin것과 동일한 출처 또는 *공용 자원인지 를 에코 하는 헤더를 보냅니다 . 예를 들면 다음과 같습니다.

Access-Control-Allow-Origin: http://www.stackoverflow.com

이 헤더가 없거나 출처가 일치하지 않으면 브라우저가 요청을 허용하지 않습니다. 모두 정상이면 브라우저가 요청을 처리합니다. 요청이나 응답에는 쿠키 정보가 포함되지 않습니다.

Mozilla 팀은 CORS 관련 게시물withCredentials 에서 브라우저가 XHR을 통해 CORS를 지원하는지 여부를 확인하기 위해 속성이 있는지 확인해야한다고 제안 합니다. 그런 다음 XDomainRequest객체 의 존재와 결합하여 모든 브라우저를 커버 할 수 있습니다 .

function createCORSRequest(method, url){
    var xhr = new XMLHttpRequest();
    if ("withCredentials" in xhr){
        xhr.open(method, url, true);
    } else if (typeof XDomainRequest != "undefined"){
        xhr = new XDomainRequest();
        xhr.open(method, url);
    } else {
        xhr = null;
    }
    return xhr;
}

var request = createCORSRequest("get", "http://www.stackoverflow.com/");
if (request){
    request.onload = function() {
        // ...
    };
    request.onreadystatechange = handler;
    request.send();
}

CORS 방법이 작동하려면 모든 유형의 서버 헤더 메커니즘에 액세스해야하며 타사 리소스에만 액세스 할 수 없습니다.

출처 : http://www.nczonline.net/blog/2010/05/25/cross-domain-ajax-with-cross-origin-resource-sharing/

window.postMessage방법

• 방법의 유형 : iframe이 .

window.postMessage을 호출하면 MessageEvent실행해야하는 보류중인 스크립트가 완료 될 때 대상 창에서 a 가 전달됩니다 (예 : 이벤트 처리기 window.postMessage에서 호출 된 경우 나머지 이벤트 처리기, 이전에 설정된 보류 시간 초과 등). 는 MessageEvent타입 메시지, 보유 data에 설치된 제 1 인수의 스트링 값으로 설정된 속성 window.postMessageAN, origin호출 윈도우 기본 문서의 원점에 대응하는 속성 window.postMessage시는 window.postMessage호출이고, source윈도우 내지 속성 이는 window.postMessage라고합니다.

를 사용하려면 window.postMessage이벤트 리스너를 연결해야합니다.

    // Internet Explorer
    window.attachEvent('onmessage',receiveMessage);

    // Opera/Mozilla/Webkit
    window.addEventListener("message", receiveMessage, false);

그리고 receiveMessage함수를 선언해야합니다 :

function receiveMessage(event)
{
    // do something with event.data;
}

오프 사이트 iframe은 다음을 통해 이벤트를 올바르게 보내야합니다 postMessage.

<script>window.parent.postMessage('foo','*')</script>

모든 윈도우는 윈도우에서 문서의 위치에 관계없이 언제든지 다른 윈도우에서이 메소드에 액세스하여 메시지를 보낼 수 있습니다. 결과적으로, 메시지 수신에 사용 된 모든 이벤트 리스너는 먼저 출처 및 가능하면 소스 특성을 사용하여 메시지 송신자의 신원을 확인해야합니다. 과소 평가할 수는 없습니다 . origin및 source속성 을 확인하지 못하면 사이트 간 스크립팅 공격이 가능합니다.

출처 : https://developer.mozilla.org/en/DOM/window.postMessage

답변

ProxyPass     /ajax/     http://other-domain.com/ajax/

<script src="http://..../someData.js?callback=some_func"/>

$.getJSON('http://anyorigin.com/get?url=google.com&callback=?', function(data){
    $('#output').html(data.contents);
});