Google ChromeでローカルファイルのAjax読み込みができない件

覚書です。

Webページ作成中に困ったことがあった。

jQueryのload()命令で同じサーバー上にあるファイルを読み込むコードを書いて、ローカル環境でテストしようとしたら読み込まれず、なんでかなーと思っていた。

Google ChromeのJavaScriptコンソールを確認してみたらこんなエラーが出ていた。

XMLHttpRequest cannot load file:〜. Origin null
                              is not allowed by Access-Control-Allow-Origin.

調べてみるとどうやら、Google Chromeではローカルファイルの読み込みを制限しているらしい。

Google Chromeでは(Ajaxで)ローカルファイルにアクセスしようとするとエラーになることについて、他

ローカルであってもWebサーバー経由でのアクセスであればいいらしい。「file:スキーマ」だと公開を意図していないファイルを盗まれるなどの恐れがあるからだろうか？

そこで起動時にオプション引数として「--allow-file-access-from-files」を与えればいいらしい。

上記サイトはWindowsユーザーのページのようなので回避策は別のページで調べた。

【警告】MacでGoogle Chromeに起動オプションをつける方法【消す】

$ /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome \
 --allow-file-access-from-files

あるいは、

WebGL の脆弱性問題と Macintosh 版の Google Chrome に関して

$ open -a Google\ Chrome --args --allow-file-access-from-files

のようにすればいい。

あるいはAutomatorアプリにするとよいということ。ラウンチャアプリであるQuickSilverを使えば、コマンドライン引数を与えられるらしいのだが、残念ながら私が使っているDragThingsではできないよう。


ちなみに私は面倒なのでSafariで動作確認することで問題を回避。

ウェルカムナビ

エキスパートのヴァル研究所がこんなサービスをしていました。
ウェルカムナビ

店舗ウェッブサイトで、店舗所在地最寄り駅などへの経路検索を簡単にできるようなインタフェースを提供して、お客さんを店舗などへ誘導しやすくするサービス。利用状況の解析や地図表示などのオプションサービスもあり、なかなか面白いサービスです。

当社では、営業系の顧客管理ツール（Web版）において、お客様の所在地の地図を表示／印刷したり、目的地までの経路検索を簡単にするサービスを追加したシステムの開発を予定しています。

利用できるサービスを探しているところ、このサービスは目的の物とは違いますが、まあ自分が考えつくようなサービスはすでに誰かが提供しているわけです。無料のサービスを使うつもりなので、すでに誰かが提供してくれていないと困るのですけどね。

地図の方は、Google MapがAPIを公開しているので簡単なんですが、経路検索の無料サービスはありませんか？