まず、クロスドメインを理解します
1.クロスドメインとは何ですか?
クロスドメインが別のドメイン内のリソースを要求しようと、ドメイン内の文書またはスクリプトを指し、広義のクロスドメインがあります。
広範なクロスドメイン:
- リソースジャンプ:リンクがリダイレクトされるように、フォームが送信されます。
- 埋め込まれたリソース:<リンク>、<SCRIPT>、<IMG>、<フレーム>等、並びにスタイルの背景タグDOM:URL()、@フォントフェース()とチェーン外部の他の文書。
- スクリプトの要求は:AJAX要求を開始JS、クロスドメインの操作は、ように、DOMとJSオブジェクトと。
実際には、我々は通常、ブラウザによって狭く制限されているクロスドメインを参照するには、クラス生成元ポリシーシーンを要求します。
2.元ポリシーとは何ですか?
同一生成元ポリシー/ SOP(同一生成元ポリシー)が大会で、1995年にNetscapeがブラウザを導入し、それがブラウザの中核である同一生成元ポリシーの欠如、ブラウザはXSSに対して脆弱である場合、また、最も基本的なセキュリティ機能です、CSFR攻撃。相同な「とは、いわゆるを指しプロトコル+ドメイン名+ポート、」同じ3つを、でも二つの異なるドメイン名が同じIPアドレス、また同族体を指します。
行動を以下のいくつかの同一生成元ポリシーの制限:
- クッキー、のlocalStorageとIndexDBを読み取ることができません
- DOMオブジェクトを取得し、Jsとすることはできません
- AJAXリクエストが送信できません
図3に示すように、共通のクロスドメインのシナリオ
URL |
説明 |
通信を許可するかどうか |
http://www.domain.com/a.js http://www.domain.com/b.js http://www.domain.com/lab/c.js |
同じドメイン名、または別のファイルパス |
許します |
http://www.domain.com:8000/a.js http://www.domain.com/b.js |
同じドメイン名、別のポート |
許可されていません |
http://www.domain.com/a.js https://www.domain.com/b.js |
同じドメイン名、異なるプロトコル |
許可されていません |
http://www.domain.com/a.js http://192.168.4.12/b.js |
そして、ドメイン名が同じIPに対応します |
許可されていません |
http://www.domain.com/a.js http://x.domain.com/b.js http://domain.com/c.js |
同じプライマリドメイン、サブドメインの |
許可されていません |
http://www.domain1.com/a.js http://www.domain2.com/b.js |
異なるドメイン |
許可されていません |
図4に示すように、クロスドメインソリューション
- インラインフレームを使用してください。
- クロスオリジンリソース共有(CORS)
第二に、クロスドメインの実装
シナリオ:私の現在のサーバーのIPアドレスがある場合は192.168.18.1、ポート番号80は、サーバーにパラメータを渡す必要が192.168.6.239、ポート番号8080サーバー上の、このサービスに192.168.18.239:8080リターンを得ます値。
1、IFRAMEを使用して。
VaRの push_url = 'http://192.168.6.239:8080/organize/user/add?user_id=1' ; VaRの IFRAME =のdocument.createElement( 'IFRAME' ); iframe.setAttribute( "スタイル"、 "表示:なし;" ); iframe.setAttribute( "SRC" 、push_url)。 document.body.appendChild(IFRAME)。
2.クロスオリジンリソース共有(CORS)
通常のクロスドメインリクエストのみ:サーバ設定のアクセス制御-許可-起源は、クッキーに依頼して、フロントエンドを設定する必要になることはできません:フロントとリアの両端が設定する必要があります。
なお:同一生成元ポリシーの制限により、クロスドメインのクッキークッキーではなく、現在のページのドメインインターフェイスを要求読みください。
現在、すべてのブラウザがこの機能をサポートしています)(IE8 + IE8 / 9 XDomainRequestはCORSをサポートするためのオブジェクトを使用する必要がある)、CORSは、クロスドメインソリューションの主流となっています。
フロントエンドのコード:
VAR push_url = "http://192.168.6.239:8080/organize/user/add?user_id=1" ; $アヤックス({ URL:push_url、 種類: "GET" 、 xhrFields:{ withCredentials:trueに // フロントエンドクッキー持つかどうか 、} クロスドメイン:trueに、 // ヘッダに含まれる付加情報は、クッキーを含むことなく、クロスドメイン要求を行います 成功:機能(データ){ にconsole.log(データ); } })。
PHPコードの背後にあります:
公共 機能actionAdd() { // クロスドメインアクセスドメインを許可:ポートがフル(に書き込む必要がある場合は、プロトコル+ドメイン名+ポート)、ポートの終わりは「/」を追加しないではない場合は、完全なドメイン名は「*」で、クロスドメインを許可するかどうかこれは、メインヘッダヘッドです。 ヘッダ(「アクセス制御-許可-起源:http://192.168.2.119」);
// 認証クッキーとフロントエンドを許可する:上記のドメイン名が「*」にすることはできません、オンになったとき、あなたは、特定のドメイン名を指定する必要があります。ブラウザが要求されます ヘッダー(「アクセス制御-許可-資格情報を:trueに」); // 許可要求モード ヘッダ(「許可するアクセス・コントロール・メソッド:POST、GE」); // 許可要求フィールド、クライアントを意思決定の ヘッダ(「アクセス制御-ヘッダを許可:カスタム- X-ヘッダー」); // 他のコード... エコーjson_encode([ 'ステータス' => 1、 'MSG' => '成功' ])。 }
ボー・リファレンスここのブログの友人からの概念の一部、Xieboあなたの感覚を共有:https://segmentfault.com/a/1190000011145364
この記事では、カンガルーカンガルーの作品をまとめたものである、再現した場合、ソースを明記してください。https://www.cnblogs.com/chrdai/p/11280895.html