48
44

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

開発時にCORSを無視するGoogleChromeの起動オプション

Last updated at Posted at 2016-12-31

まとめ

Chromuimベースのブラウザで起動オプションをつけることで、CORSを無視して動作させることが出来る。

open http://localhost:8000/ -a "/Applications/Google Chrome.app" --args --disable-web-security --user-data-dir

開発時に困るCORS(Cross-Origin Resource Sharing)

他のドメインにリクエストする際に以下の様なエラーを見たことありませんか?

XMLHttpRequest cannot load https://api.example.com. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://example.com' is therefore not allowed access.

これはCORS(Cross-Origin Resource Sharing)といって、他のサーバーにXMLHttpRequestをした際のリソースを読み取ることが出来ない仕様です。
セキュリティのための仕様ですが、開発時には鬱陶しくなることがあります。

サーバーのレスポンスで以下のようなヘッダーを返すと、読み込むことが出来ます。

Access-Control-Allow-Origin: "http://example.com"

しかし、サーバーが弄れない状況だったらどうでしょう。
年末年始でサーバーの方が弄れなくなってしまった…みたいな状況に心当たりありませんか?

起動オプションで無効にできる

実はGoogle Chromeは複数の起動オプションをつけることでブラウザの挙動を変えることが出来ます。

open http://localhost:8000/ -a "/Applications/Google Chrome.app" --args --disable-web-security --user-data-dir

Chromiumの方の機能なので、Chromiumを使っているブラウザだったらすべてこの方法で大丈夫そう。
自分は普段使いのブラウザがChromeなのでVivaldiをCORS無視にして開発しています。

48
44
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
48
44

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?