ChromeでAccess-Control-Allow-Originを停止させつつ、別アプリとして動かす
以前からChromeでの開発・デバッグがメインになっているのですが、ちょっと前からローカルで開発している時に、以下のようなメッセージが出て、リソースにアクセスできない事が多々ありました。
XMLHttpRequest cannot load file:///*****. Origin null is not allowed by Access-Control-Allow-Origin.
セキュリティ上の理由は分かるし、MAMP上のディレクトリ上で確認していたのですが、わざわざApache動かすのもダルいし、MAMPでリソース食うのも気持ちよくないなーと思っていました。
Access-Control-Allow-Origin自体はコマンドライン引数から抑制させる事はできるのですが、開発中とは言え、普通にネットを見ながらなので、Chrome全体に適用させてしまうと、セキュリティ上よろしくない。
というわけで、別アプリケーションとして動作させつつ、Access-Control-Allow-Originを停止する方法を調べてみました。
Access-Control-Allow-Originの抑制
これは調べるとすぐに出てきます。コマンドラインオプションに以下を加えれば良いだけです。
--allow-file-access-from-files --disable-web-security
Chromeを別プロファイルで動かす
Chromeを同時に複数動かすために、別のプロファイルを用意します。
chrome://version/
を確認すると、「プロフィールパス」が以下のような感じになっていると思います。
/Users/****/Library/Application Support/Google/Chrome/Default
ので、Defaultの代わりにdeveloperとして作成する事にします。
次に「アプリケーション」「ユーティリティ」「AppleScriptエディタ.app」を起動し、以下をコピペします。(※1行です)
do shell script "/Applications/Google\\ Chrome.app/Contents/MacOS/Google\\ Chrome --user-data-dir=/Users/$USER/Library/Application\\ Support/Google/developer --allow-file-access-from-files --disable-web-security > /dev/null 2>&1 &"
保存する時は、「ファイルフォーマット」を「アプリケーション」にします。名前は「Chrome Dev.app」とでもしておきました。
上手く起動されない場合は/dev/nullを/Users/$USER/Desktop/chrome.logとしてエラーを出力して確認してみてください。
これで完了ですが、アイコンを変えた方が区別がつきやすいので、書いておきます。
アイコンを変える
Chrome Dev.appを右クリック、「情報を見る」でウィンドウを表示させます。
アイコン画像はこのへんからDLできそうです。
私は画像を拾って来て、以下のツールでアイコン形式に変換しました。
Image2icon - Your Mac. Your Icons.
用意ができたら、ウィンドウ左上のアイコンをクリックし、青色の枠が表示された時点で、先ほどのアイコン画像をドラッグします。
以上で終了です。
起動してみると以下のような警告が表示されているのが確認できます。
command + tabキーで表示されるアイコンも変えられれば尚良いんですけどね・・。
(ご存知の方、教えてください)