2014年09月10日

【IE・・・】Ajaxのクロスドメイン対策

自分が何か成長し続けるために、
何でも良いので、毎日続ける事が大事とのことです。
そんな訳で・・・
 ・WiiFit で「からだ測定」
 ・ブログの記事を書く
 ・息子との交換日記を書く
 ・「白猫プロジェクト」にログインする
をやっている訳ですね。
・・・絶対何か間違っている気がする。ジャンボです。


Ajaxで通信をするプログラムをペソペソ作っていたのですが、
異なるドメイン間でのAjax通信には色々と制限が入ってしまいます。
いわゆる、「クロスドメイン」という奴です。

Cross-Origin Resource Sharing (CORS)」という奴で、
W3Cで規定された、ドメイン間の通信の制限に引っかかる訳です。

クロスドメイン間の通信を許可する場合、
サーバ側のHTTPヘッダーに「Access-Control-Allow-Origin」を追加し、
値を「*」とすれば、OK です。

・・・
・・・・・・
・・・・・・・・・Google Chrome ならな。

でもね、IEじゃだめなの。
「Type Error : アクセスが拒否されました。」なんて言われる。

許可するゆーとるやんけぇぇぇ!!!!!
と思わず叫びたくもなりますが、まあ、毎度おなじみのIE独自仕様です。

検索してみても、異様に小難しいものが多く、少し四苦八苦しましたが、
Cross-Domain AJAX for IE8
という便利なツールがあったので、以下に記します。

 1) jquery.xdomainrequest.min.js をダウンロード
  「Cross-Domain AJAX for IE8」のサイトからダウンロードします。

 2) ページ内HTMLのHEAD部にダウンロードしたJSを読み込む様に記載
  下記は、ページHTMLと同ディレクトリにダウンロードしたJSファイルを設置した場合です。
  <script type="text/javascript" src="./jquery.xdomainrequest.min.js"></script>

 3) ajax通信に "crossDomain: true" のパラメータを追加
  例えば、下記のような感じです。

        $.ajax({
type: 'GET',
url: 'http://xxx.xxx.xxx/xxx',
cache : false,
crossDomain: true,
dataType: 'json',
success: function(json) {
・・・
},
error: function(request, status, thrown) {
・・・
}
});


これでOK。とりあえず、IE8での動作確認はしましたが、IE9等でも問題ないらしいとのこと。


やれやれ。


posted by ジャンボ at 21:53| Comment(0) | TrackBack(0) | 雑記:PC | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

この記事へのトラックバックURL
http://blog.seesaa.jp/tb/405203239

この記事へのトラックバック