I am encountering an issue with displaying external images in a Cordova app. While the DOM is functioning correctly, the images are failing to load. I am specifically trying to resolve this for Windows 8.1 only. In my Cordova project for JavaScript, I have configured the following in the config.xml file:
<?xml version="1.0" encoding="utf-8"?>
<widget xmlns:cdv="http://cordova.apache.org/ns/1.0" xmlns:vs="http://schemas.microsoft.com/appx/2014/htmlapps" id="pl.com.sk.todolist" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" defaultlocale="pl-PL">
<name>todolist</name>
<description>todolist</description>
<author href="http://cordova.io" email="<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="d0b4b5a690b3bfa2b4bfa6b1feb1a0b1b3b8b5febfa2b7">[email protected]</a>">SK Team</author>
<content src="index.html" />
<access origin="*" />
<vs:features />
<preference name="SplashScreen" value="screen" />
<preference name="windows-target-version" value="8.1" />
<!-- Support for Cordova 5.0.0 plugin system -->
<plugin name="cordova-plugin-whitelist" version="1" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<platform name="android">
<allow-intent href="market:*" />
</platform>
<platform name="ios">
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
</platform>
<vs:plugin name="cordova-plugin-camera" version="1.2.0" />
<vs:plugin name="cordova-plugin-file" version="3.0.0" />
<vs:plugin name="cordova-plugin-file-transfer" version="1.2.1" />
<vs:platformSpecificValues>
<vs:platformSpecificWidget platformName="windows" id="pl.com.sk.todolist" version="0.0.0.1">
<vs:name>todolist</vs:name>
</vs:platformSpecificWidget>
</vs:platformSpecificValues>
<vs:plugin name="cordova-plugin-media-capture" version="1.0.1" />
<preference name="Fullscreen" value="True" />
<vs:plugin name="io.github.pwlin.cordova.plugins.fileopener2" version="1.0.11" src="https://github.com/pwlin/cordova-plugin-file-opener2" />
</widget>
The img tag I am using is:
<img ng-src="{{cfg.img_url}}{{groupImg.link}}" alt="{{groupImg.name}}"
title="{{groupImg.name}}" ng-click="mc.showPreviewGroupImg()" />
Once rendered in the DOM, it appears as:
<img alt="The image" title="The image" ng-click="mc.showPreviewGroupImg()" ng-src="http://static.videezy.com/system/resources/thumbnails/000/003/294/original/aerial-view-of-mountain-forests-free-hd-video.jpg" src="http://static.videezy.com/system/resources/thumbnails/000/003/294/original/aerial-view-of-mountain-forests-free-hd-video.jpg">
When running in debug mode, I am receiving an error in Visual Studio 2015:
SEC7117: Network request to http://static.videezy.com/system/resources/thumbnails/000/003/294/original/aerial-view-of-mountain-forests-free-hd-video.jpg did not succeed. Your application manifest does not declare the following capabilities: privateNetworkClientServer
Where should I configure this capability?