I am attempting to display an image from an external location (AWS S3) in an iOS emulator using Ionic/Cordova/Angular. Here is the code snippet I am trying to work with:
<img src="https://miyagi-photos.s3.amazonaws.com/madeline-profile"/>
Here are some of the methods I have tried:
1) Added AmazonAWS to Cordova's whitelist, although I believe it is already covered by the existing access origin line:
<access origin="*"/> <!-- existing -->
<access origin="*.amazonaws.*" /> <!-- added this -->
2) Attempted to remove the protocol altogether like this:
<img src="miyagi-photos.s3.amazonaws.com/madeline-profile"/>
3) Tried using a different image with a standard http protocol:
<img src="http://upload.wikimedia.org/wikipedia/en/b/b1/Portrait_placeholder.png"/>
4) Experimented with using ng-src instead of src:
<img ng-src="https://miyagi-photos.s3.amazonaws.com/madeline-profile"/>
For full reference, here is the entire page layout:
<ion-view class="has-header" view-title="Create Class">
<ion-content>
<form>
<div>
<label for="ClassName">Class Name: </label>
<input type="text" name="name" ng-model="classInformation.name" required>
</div>
<div>
<label for="ClassPhoto">Class Photo: </label>
<div class="button" ng-file-select ng-file-change="upload($files)" ng-multiple="multiple">Select File</div>
<img src="https://miyagi-photos.s3.amazonaws.com/madeline-profile" height="150px"/>
</div>
<div>
<label for="description">description: </label>
<input type="text" name="description" ng-model="classInformation.description" required>
</div>
<div>
<label for="rate">rate: </label>
<input type="text" name="rate" ng-model="classInformation.rate" required>
</div>
<div>
<label for="date">date: </label>
<input type="text" name="date" ng-click="setDate()" ng-model="classInformation.date" required>
</div>
<div>
<label for="time">time: </label>
<input type="text" name="time" ng-click="setTime()" ng-model="classInformation.time" required>
</div>
<div>
<label for="location">location: </label>
<input type="text" name="location" ng-model="classInformation.location" required>
</div>
<button type="submit" value="Submit" ng-click="createClass()">Create Class</button>
</form>
</ion-content>
</ion-view>