No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. が出る。

PhoneGapでなんとか(ださいけども)スマホのアプリ系のものをつくろうかなぁと思ってる。

Railsにデータを取得にしにいくみたいなことをしたかった。

その中で、

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

ってのが出たのでいろいろ調べてみたメモ。

Same Origin Policyってなんだ

javascript - No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://wordicious.com' is therefore not allowed access - Stack Overflowっていうで、same-origin policyってワードが出てたので調べる。

Same-Origin Policy とは何なのか。 - 葉っぱ日記

http://example.jp/foohttp://example.jp:80/bar はそれぞれ同一のスキーム(http)、ホスト(example.jp)、ポート(80)を持つため、同一のオリジンであると判断されます。一方、https://example.jp/foohttp://example.jp/foo はどちらも同じホストを持ちますが、スキームがそれぞれhttpsとhttpであるため、異なるオリジンのリソースであると判断されます。data:スキームはそれぞれ独立したオリジンを持つものとして取り扱われ、またfile:スキームに関しては実装依存ということになっています。2つのオリジンが同一でない場合、すなわち異なるオリジンを「クロスオリジン」と言います。

スキーム、ホスト、ポートが違ってると、セキュリティ的な問題を抱えるために、制約されるらしい。

解決策として。

Ajaxのクロスサイト通信をJSONPを使わないでやってみよう - Back yard : yuya_lush’s report

ポイントは、

class ApplicationController < ActionController::Base
  protect_from_forgery
 
  before_filter :allow_cross_domain_access
  def allow_cross_domain_access
    response.headers["Access-Control-Allow-Origin"] = "*"
    response.headers["Access-Control-Allow-Headers"] = "Content-Type"
    response.headers["Access-Control-Allow-Methods"] = "PUT,DELETE,POST,GET,OPTIONS"
  end
end

っていうので、Access-Control-Allow-Origin をヘッダにつける。

追記 2014/01/06 16:00

HTTP access control (CORS) | MDN

Mozilla Developer Network

読みます。