今回はクロスドメインの問題について話します。
クロスドメイン問題とは
あるドメインで読み込まれたHTMLページから、Javascriptなどブラウザ上で動作するプログラミング言語によって、異なるドメインのサービスに接続するとブラウザがエラーや警告を表示することがあります。
以下の条件になったら、クロスドメイン問題が発生します。
・プロトコルが違う場合
・ドメインが違う場合
・ポート番号が違う場合
クロスドメイン解決策
CORSの設定による、解決
この方法はサーバサイドでの設定が必要です。サーバやサーバ側に変更できる環境の場合にお使いください。
設定方法：
レスポンスのヘッダに以下の内容を設定すれば、問題が解決できる。
Access-Control-Allow-Origin: *
JSONPとして扱う
JSONP (JSON with padding) とは、scriptタグを使用してクロスドメインな（異なるドメインに存在する）データを取得する仕組みのことである。 HTMLのscriptタグ、JavaScript（関数）、JSONを組み合わせて実現される。
使用例：
HTMLコード「URL：http://127.0.0.1:8080/index.htm」
<script>
function getData(data) {
console.log(data);
}
</script>
<script src=”http://127.0.0.1:8000/getData?callback=getData“></script>
サーバ側以下の内容を返す(node.js)
res.end(urlObject.query.callback+'(‘+123+’)’);
テストすると、ちゃんと123のデータを出力された。
