LoginSignup
2

More than 5 years have passed since last update.

Cordova(PhoneGap)でアプリ開発する時のlocalhost指定についての注意点

Posted at

Rails等でサーバーサイド、Cordova(PhoneGap)でクライアントサイドのアプリを開発する時、localhost(127.0.0.1)を指定してデバッグする時の注意点です。
確認したCordovaのバージョンは、"5.4.1" です。

$ cordova create <foldername> <uri> <AppName>

のように雛形を作成し、自動的に生成されたindex.htmlのmeta情報まま、locaohostにアクセスしようとしても、正常にアクセスできません。
CSPポリシーが設定されていないためのようです。
(APIを使用してサーバーからjsonデータを取得する様なソフトの開発でデバッグしようすると、その前に躓くことになってしまいます)

このような現象に遭遇した時は、自動生成されたindex.htmlに対して、以下のようにconnect-srcでlocalhostとポートの設定を追加すると、正常にアクセスできるようになります。

編集元

<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">

編集後(例)

<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; connect-src http://localhost:3000">

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
2