"Not allowed to load local resource" for Local image from Remote page in PhoneGap Build
<p>I'm hosting my webpages for a phonegap build app.
I'd like to use the camera to upload a photo, and show a preview the image, basically doing this:</p>

<pre><code>&lt;img src="file:///storage/emulated/0/Android/data/com.myapp.myapp/cache/1470418568917.jpg" height="500" /&gt;
</code></pre>

<p>Because my pages are hosted I'm getting this error:</p>

<p>Not allowed to load local resource: file:///storage/emulated/0/Android/data/com.myapp.myapp/cache/1470418568917.jpg", source: <a href="https://www.myapp.com/v5.5/imager.html#" rel="noreferrer">https://www.myapp.com/v5.5/imager.html#</a></p>

<p>I assume that this is some CORS problem, so I've added this to the html of the page</p>

<pre><code>&lt;meta http-equiv="Content-Security-Policy" content="default-src *; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'; media-src *; img-src * filesystem: data:"&gt;
</code></pre>

<p>and this to my config.xml (I'm using Phonegap Build)</p>

<pre><code> &lt;plugin name="cordova-plugin-whitelist" source="npm" /&gt;

 &lt;allow-navigation href="*" /&gt;
 &lt;allow-navigation href="*://*/*" /&gt;
 &lt;allow-navigation href="file:///*/*" /&gt;
 &lt;allow-navigation href="http://*/*" /&gt;
 &lt;allow-navigation href="https://*/*" /&gt;
 &lt;allow-navigation href="data:*" /&gt;

 &lt;allow-intent href="*" /&gt;
 &lt;allow-intent href="http://*/*" /&gt;
 &lt;allow-intent href="https://*/*" /&gt;
 &lt;allow-intent href="tel:*" /&gt;
 &lt;allow-intent href="sms:*" /&gt;
 &lt;allow-intent href="mailto:*" /&gt;
 &lt;allow-intent href="geo:*" /&gt;

 &lt;access origin="*" /&gt;
 &lt;access origin="*://*/*" /&gt;
 &lt;access origin="file:///*" /&gt;
 &lt;access origin="cdvfile://*" /&gt;
 &lt;access origin="content:///*" /&gt;
</code></pre>

<p>As you can see I've tried every setting I can think of, from scouring the web.
Am I missing something obvious?</p>

<p>Thanks in advance.</p>