JSのクロスドメイン問題に対処する5つの方法まとめ_JavaScriptスキル-jsチュートリアル-php.cn

JSのクロスドメイン問題に対処する5つの方法まとめ_JavaScriptスキル

WBOY

リリース： 2016-05-16 16:29:16

オリジナル

1487 人が閲覧しました

2 日前、クロスドメインの問題に遭遇しましたが、これは jsonp を使用して解決できます。 (http://www.jb51.net/article/57889.htm)

最近整理した内容:

1.jsonp。

Ajax リクエスト、dataType は jsonp です。このフォームでは、callback([json-object]) を返すようにサーバー側でリクエストを調整する必要があります。サーバーが通常の json オブジェクトを返した場合。デバッグ時に、Chrome ブラウザのコンソールでは「Uncaught SyntaxError: Unexpected token」エラーが報告され、Firefox ブラウザのコンソールでは「SyntaxError: missing; before state」エラーが報告されます。

2.iframe クロスドメイン。

get リクエストを呼び出す必要がある場合は、iframe 要素を get リクエストの URL に設定して、get リクエストの呼び出しを開始します。

コードをコピーしますコードは次のとおりです:

var url = "http://xxx.xxx.xxx?p1=1&p2=2";
$("#iframe").attr("src", url);//クロスドメイン、iframe を使用

iframe メソッドは、http リクエストの処理に加えて、ドメイン間での js 呼び出しも実装できます。

3. スクリプト要素の src 属性の処理

iframe、img、style、script およびその他の要素の src 属性は、異なるドメインからリソースを直接リクエストできます。jsonp は、スクリプトタグを使用してドメイン間でリソースをリクエストする単純な実装であるため、これは本質的に jsonp と同じです。サーバー側のリクエストリターンコールバック...フォームが必要です。

コードをコピーしますコードは次のとおりです:

var url="http://xxx.xxx.xxx?p1=1";
var script = document.createElement('script');
script.setAttribute('src', url);
document.getElementsByTagName('head')[0].appendChild(script);

4. サーバー上で get 処理を使用します。

フロントエンド処理に対する厳密な要件がないビジネスの場合は、フロントエンド処理をサーバー側でカプセル化し、サーバー側で呼び出しを開始することで、クロスドメインの問題を解決できます。次に、リクエストが送信されるかどうか、または戻り値を取得する必要があるかどうかに応じて、コードは同期モードまたは非同期モードを使用します。

コードをコピーコードは次のとおりです:

        private static void CreateGetHttpResponse(string url, int? timeout, string userAgent, CookieCollection cookies)

        {

            if (string.IsNullOrEmpty(url))

            {

                throw new ArgumentNullException("url");

            }

            var request = WebRequest.Create(url) as HttpWebRequest;

            request.Method = "GET";

            if (!string.IsNullOrEmpty(userAgent))

            {

                request.UserAgent = userAgent;

            }

            if (timeout.HasValue)

            {

                request.Timeout = timeout.Value;

            }

            if (Cookie != null)

            {

                request.CookieContainer = new CookieContainer();

                request.CookieContainer.Add(cookie);

            }

            request.BeginGetResponse(null,null);//异步

            // request.GetResponse() を HttpWebResponse として返します;

        }