JavaScript는 window.name을 사용하여 도메인 간 문제를 해결합니다. 페이지 1/2_javascript 기술

window.name 전송 기술은 원래 Thomas Frank가 쿠키의 몇 가지 단점(도메인 이름당 4 x 20Kb로 제한, 데이터는 문자열만 가능)을 해결하기 위해 개발한 것입니다. 쿠키 구문 등을 설정하고 얻는 복잡성으로 인해) (자세한 내용은 원본 텍스트 참조: 《쿠키 없는 세션 변수》), 이후 Kris Zyp 이 방법을 기반으로 window.name 전송이 강화되어 Dojo(dojox.io.windowName에 도입됩니다. ), 도메인 간 데이터 전송 문제를 해결하는 데 사용됩니다.
window.name 전송 기술의 기본 원리와 단계는 다음과 같습니다.
name은 브라우저 환경에서 전역/window 객체의 속성이며, 프레임에 새 페이지가 로드될 때 name의 속성 값은 변함없이 유지됩니다. iframe 내에 리소스를 로드하면 대상 페이지가 프레임의 이름 속성을 설정합니다. 이 이름 속성 값은 웹 서비스에서 전송한 정보에 접근하기 위해 얻을 수 있습니다. 그러나 name 속성은 동일한 도메인 이름을 가진 프레임에만 액세스할 수 있습니다. 이는 이름 속성에 액세스하려면 원격 웹 서비스 페이지가 로드될 때 프레임을 원래 도메인으로 다시 탐색해야 함을 의미합니다. 동일 출처 정책은 여전히 ​​다른 프레임이 name 속성에 액세스하는 것을 방지합니다. name 속성을 얻으면 프레임을 삭제합니다.

최상위 수준에서 name 속성은 안전하지 않으며 name 속성에 설정된 모든 정보는 모든 후속 페이지에서 사용할 수 있습니다. 그러나 windowName 모듈은 항상 iframe에 리소스를 로드하고 데이터를 얻은 후 또는 최상위 수준에서 새 페이지를 탐색하면 iframe이 삭제되므로 다른 페이지는 window.name 속성에 액세스할 수 없습니다.

Ke Jun이 작성한 샘플에서 파생된 YUI 기반의 기본 구현 코드:

코드 복사 코드는 다음과 같습니다.

(function(){
var YUD = YAHOO.util.Dom, YUE = YAHOO.util.Event;

dataRequest = {
_doc: 문서,
cfg: {
proxyUrl: 'proxy.html'
}
}

dataRequest.send = function(sUrl, fnCallBack){
if(!sUrl || typeof sUrl !== 'string'){
return;
}

sUrl = (sUrl.indexOf('?') > 0 ? '&': '?') 'windowname=true';

var 프레임 = this._doc.createElement('iframe'), 상태 = 0, self = this._doc.body.appendChild(frame; );
frame.style.display = 'none';

varclear = function(){
try{
frame.contentWindow.document.write(''); >frame.contentWindow .close();
self._doc.body.removeChild(frame);
}catch(e){}
};

var getData() {
try{
var da =frame.contentWindow.name;
}catch(e){}
clear()
if(fnCallBack && typeof fnCallBack === 'function' ){
fnCallBack(da);
}
};

YUE.on(frame, 'load', function(){
if(state === 1) {
getData();
} else if(state === 0){
state = 1;
frame.contentWindow.location = self.cfg.proxyUrl; >});

frame.src =
}
})()