5410


<http://example.com> から、以下のコードを実行すると、

[code]

    var url = 'http://www.yahoo.co.jp';
    
    $.ajax(url, {
      crossDomain: true,
      success: function(res) {
        console.log(res);
      }
    });
    
[/code]

以下のようなエラー表示されます。

[code]

    XMLHttpRequest cannot load http://www.yahoo.co.jp. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://**.**.**.**' is therefore not allowed access.
    
[/code]

crossDomainオプションを有効にしているのになぜでしょうか？


CC BY-SA 3.0
2015-01-27T06:48:57.167
5406
2015-01-27T08:15:35.753
2015-01-27T07:31:36.297
440
question
javascript jquery
jQueryのcrossDomainオプションが効かない


以下で試して貰えますか。

[code]

    var url = 'http://www.yahoo.co.jp';
    
    $.ajax({
      url,
      crossDomain: true,
      success: function(res) {
        console.log(res);
      }
    });
    
[/code]


CC BY-SA 3.0
2015-01-27T07:33:38.857
5409
2015-01-27T07:33:38.857
440
5406
answer


クロスドメインでアクセスする場合はアクセス先のサーバーがレスポンスのヘッダに `Access-Control-Allow-Origin`
を追加していない限りアクセスすることはできません。

アクセス先の設定をいじれない場合は
[`jquery.xdomainajax.js`](https://github.com/padolsey/jquery.fn/blob/master/cross-
domain-ajax/jquery.xdomainajax.js) というプラグインを使用するとアクセスできるようです。

下のコードで動作確認は出来ましたが、 `jquery.xdomainajax.js` は Yahoo API を経由してレスポンスを取得するという実装のため
Yahoo! 側が API の提供を停止する等してしまうと使用不能になるかもしれません。

[code]

    <!DOCTYPE html>
    <html>
    <head>
        <script src="http:////ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script src="./jquery.xdomainajax.js" type="text/javascript"></script>
    </head>
    <body>
        <script>
            var url = 'http://www.yahoo.co.jp';
            $(document).ready(function(){
                $.ajax({
                    url:url,
                    type: 'GET',
                    cache: false,
                    success: function(res) {
                        console.log(res);
                    }
                });
            });
        </script>
    </body>
    </html>
    
[/code]


CC BY-SA 3.0
2015-01-27T07:34:45.130
5410
2015-01-27T07:44:25.277
2015-01-27T07:44:25.277
4978
7859
5406
answer


`jQuery.ajax()`の`crossDomain`オプションは[公式リファレンス](http://api.jquery.com/jQuery.ajax/)によると

> **crossDomain** (default: `false for same-domain requests, true for cross-
> domain requests`)  
>  Type: Boolean  
>  If you wish to force a crossDomain request (such as JSONP) on the same
> domain, set the value of crossDomain to `true`. This allows, for example,
> server-side redirection to another domain. **(version added: 1.5)**

ということであり、「クロスドメイン通信したいです」と設定するものではなく、「同ドメイン上でクロスドメインっぽく通信したいです」という設定をするもののようです。

実際にクロスドメイン通信ができない理由はsige yangさんがおっしゃるように、リクエスト先のサーバーが`Access-Control-Allow-
Origin`ヘッダーにリクエスト元を含めてくれていないからです。

`jQuery.ajax()`の`crossDomain`オプションがどのように作用するのかリクエストヘッダーを見た結果を以下に添付します。

  1. クロスドメインで`crossDomain`を`true`にした場合
[code]     GET /?_=1422345793807 HTTP/1.1

    Host: www.yahoo.co.jp
    Connection: keep-alive
    Accept: */*
    Origin: http://ja.stackoverflow.com
    User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.91 Safari/537.36
    DNT: 1
    Referer: http://ja.stackoverflow.com/questions/5406/jquery%e3%81%aecrossdomain%e3%82%aa%e3%83%97%e3%82%b7%e3%83%a7%e3%83%b3%e3%81%8c%e5%8a%b9%e3%81%8b%e3%81%aa%e3%81%84
    Accept-Encoding: gzip, deflate, sdch
    Accept-Language: ja,en-US;q=0.8,en;q=0.6
    
[/code]

  2. クロスドメインで`crossDomain`を`false`にした場合
[code]     OPTIONS /?_=1422345943662 HTTP/1.1

    Host: www.yahoo.co.jp
    Connection: keep-alive
    Access-Control-Request-Method: GET
    Origin: http://ja.stackoverflow.com
    User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.91 Safari/537.36
    Access-Control-Request-Headers: accept, x-requested-with
    Accept: */*
    DNT: 1
    Referer: http://ja.stackoverflow.com/questions/5406/jquery%e3%81%aecrossdomain%e3%82%aa%e3%83%97%e3%82%b7%e3%83%a7%e3%83%b3%e3%81%8c%e5%8a%b9%e3%81%8b%e3%81%aa%e3%81%84
    Accept-Encoding: gzip, deflate, sdch
    Accept-Language: ja,en-US;q=0.8,en;q=0.6
    
[/code]

  3. 同ドメインで`crossDomain`を`true`にした場合
[code]     GET
/questions/5406/jquery%E3%81%AEcrossdomain%E3%82%AA%E3%83%97%E3%82%B7%E3%83%A7%E3%83%B3%E3%81%8C%E5%8A%B9%E3%81%8B%E3%81%AA%E3%81%84?_=1422346041101
HTTP/1.1

    Host: ja.stackoverflow.com
    Connection: keep-alive
    Accept: */*
    User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.91 Safari/537.36
    DNT: 1
    Referer: http://ja.stackoverflow.com/questions/5406/jquery%e3%81%aecrossdomain%e3%82%aa%e3%83%97%e3%82%b7%e3%83%a7%e3%83%b3%e3%81%8c%e5%8a%b9%e3%81%8b%e3%81%aa%e3%81%84
    Accept-Encoding: gzip, deflate, sdch
    Accept-Language: ja,en-US;q=0.8,en;q=0.6
    Cookie: __qca=P0-1411648952-1418703068360; usr=t=nDf3Q2CrkkWh&s=7muexQo30CrB; _ga=GA1.2.1581710640.1418703068; __cfduid=d0399dc82953e8eaf559a1655c6da639e1422239231; sgt=id=dc0a90b3-67f2-4f8b-bf96-1907b718803b; _ga=GA1.3.1581710640.1418703068; acct=t=Vwpz8j9lJUBoz4SgBQrYvpa2GV85zbWp&s=gacZfjyUemiWR1NH0/x1mObJofJ0rwh+; jauser=t=2YRIB2kcUkno&s=B3s4tM0fEOvh
    
[/code]

  4. 同ドメインで`crossDomain`を`false`にした場合
[code]     GET
/questions/5406/jquery%E3%81%AEcrossdomain%E3%82%AA%E3%83%97%E3%82%B7%E3%83%A7%E3%83%B3%E3%81%8C%E5%8A%B9%E3%81%8B%E3%81%AA%E3%81%84?_=1422346068309
HTTP/1.1

    Host: ja.stackoverflow.com
    Connection: keep-alive
    Accept: */*
    X-Requested-With: XMLHttpRequest
    User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/40.0.2214.91 Safari/537.36
    DNT: 1
    Referer: http://ja.stackoverflow.com/questions/5406/jquery%e3%81%aecrossdomain%e3%82%aa%e3%83%97%e3%82%b7%e3%83%a7%e3%83%b3%e3%81%8c%e5%8a%b9%e3%81%8b%e3%81%aa%e3%81%84
    Accept-Encoding: gzip, deflate, sdch
    Accept-Language: ja,en-US;q=0.8,en;q=0.6
    Cookie: __qca=P0-1411648952-1418703068360; usr=t=nDf3Q2CrkkWh&s=7muexQo30CrB; _ga=GA1.2.1581710640.1418703068; __cfduid=d0399dc82953e8eaf559a1655c6da639e1422239231; sgt=id=dc0a90b3-67f2-4f8b-bf96-1907b718803b; _ga=GA1.3.1581710640.1418703068; acct=t=Vwpz8j9lJUBoz4SgBQrYvpa2GV85zbWp&s=gacZfjyUemiWR1NH0/x1mObJofJ0rwh+; jauser=t=2YRIB2kcUkno&s=B3s4tM0fEOvh
    
[/code]

同ドメインで`crossDomain`を`true`にすると`X-Requested-With:
XMLHttpRequest`を送らなくなるようですね。クロスドメインで`crossDomain`による差異はわりとあるのでここでは割愛しますが、少なくともともかくリクエストの仕方に違いが出るようですね。


CC BY-SA 3.0
2015-01-27T08:15:35.753
5412
2015-01-27T08:15:35.753
3160
5406
answer