JavaScript は window.name を使用してクロスドメインの問題を解決します ページ 1/2_javascript スキル

window.name 送信テクノロジーは、Cookie のいくつかの欠点 (ドメイン名ごとに 4 x 20 Kb の制限、データは文字列のみ、発明Cookie 構文の設定と取得の複雑さなどのため) (詳細については原文を参照: 《Cookie を使用しないセッション変数》)、以降は Kris Zyp このメソッドに基づいて、window.name の送信が強化され、Dojo (dojox.io.windowName) に導入されます。 )、クロスドメインのデータ送信の問題を解決するために使用されます。 window.name 送信テクノロジーの基本原理と手順は次のとおりです。 name はブラウザ環境のグローバル/ウィンドウ オブジェクトの属性であり、新しいページがフレームにロードされると、name の属性値が使用されます。変化はありません。 iframe 内にリソースをロードすると、ターゲット ページでフレームの name 属性が設定されます。この name 属性値は、Web サービスによって送信される情報にアクセスするために取得できます。ただし、name 属性は、同じドメイン名を持つフレームにのみアクセスできます。これは、name 属性にアクセスするには、リモート Web サービス ページが読み込まれるときに、フレームを元のドメインに戻す必要があることを意味します。同一生成元ポリシーにより、他のフレームが 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 ? '&' : '?') 'windowame=true';

var Frame = this._doc.createElement('iframe')、state = 0、self = this; );
frame.style.display = 'none';

var clear = function(){
try{
frame.contentWindow.document.write(''); >frame.contentWindow .close();
self._doc.body.removeChild(frame);

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

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

フレーム.src =
}
});