Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/simonprickett/cordovacsp
Cordova Content Security Policy / iOS 9 ATS Demo App
https://github.com/simonprickett/cordovacsp
android-app content-security-policy cordova ios-app javascript phonegap xcode
Last synced: 15 days ago
JSON representation
Cordova Content Security Policy / iOS 9 ATS Demo App
- Host: GitHub
- URL: https://github.com/simonprickett/cordovacsp
- Owner: simonprickett
- License: mit
- Created: 2015-10-13T22:18:25.000Z (about 9 years ago)
- Default Branch: master
- Last Pushed: 2015-10-14T04:24:30.000Z (about 9 years ago)
- Last Synced: 2024-10-29T15:49:38.057Z (2 months ago)
- Topics: android-app, content-security-policy, cordova, ios-app, javascript, phonegap, xcode
- Language: JavaScript
- Homepage: https://simonprickett.dev/
- Size: 895 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Cordova Content Security Policy / iOS 9 ATS Demo App
## Introduction
This is a Cordova 5 app that demonstrates the steps needed to successfully make an Ajax request for data from a server, and how to configure the Content Security Policy meta tag to allow this.
For iOS 9 / Xcode 7 users this also demonstrates the configuration of App Transport Security (ATS) which by default will block non SSL requests to backend servers.
The app is very simple, it calls out to an exchange rate API (```http://api.fixer.io```) and aims to tell us the current value of the Euro in US Dollars. It uses JQuery, but nothing about the Content Security Policy or ATS setup is framework specific - configurations apply to any JS framework.
## Environment Setup
**This project contains iOS specifics, so you will need to build it on a Macintosh.**
You will need the following installed to be able to use this app properly:
* Cordova CLI 5.3.3 or newer
* XCode 7 or newer (must be XCode 7 as 6.x doesn't build for iOS 9 and use ATS)
* Android SDK installed and SDK API level 22 (Android 5.1.1) or higher installed
* Internet connection
* Optional: Android emulator configured
* Optional: Android and iOS device(s)
To check you have Cordova CLI configured properly, open up a Terminal window on your Mac and type:
```
cordova -version
```
You should expect to see something like:
```
5.3.3
```
If your version doesn't begin with 5, or the cordova binary can't be found then update your Cordova version and Terminal path appropriately.
## Clone and Initial Build
Clone the GitHub repo to your Macintosh, then open up a Terminal and cd to wherever you cloned the repo. To get the app running in the first of three demo states, enter these commands:
```
cd
cd app
cordova platform add ios android
cordova build ios
cordova build android
```
You should now be able to run the app in the emulators or on your device in the normal way.
When first cloned, the app will be in the "Step 1" state (broken).
## App States
There are 3 states, or steps, to this app:
* **Step 1:** Initial out of the box app using default Content Security Policy and ATS configurations that the Cordova CLI uses when creating an app. This will fail to get the remote data on iOS < 9, iOS 9 and Android because the Content Security Policy meta tag in index.html does not permit it
* **Step 2:** Here, the Content Security Policy meta tag in index.html has been modified to allow data connections to the API that we are using. This will work on iOS < 9 and Android, but will continue to fail on iOS 9 because even though we have Cordova configured correctly now, iOS 9 is still blocking our http URL request because the default ATS configuration disallows all non-SSL backends
* **Step 3:** Here, we have modified the iOS app's .plist (using a Cordova build hook script) to configure an ATS exception allowing non-SSL connections to our API host. This version of the app will now work on all iOS and Android versions
After cloning the repo and following the initial build instructions, you will be at step 1 with a pretty broken app for both Android and iOS.
## Transitioning Between States
When first cloned, the app is at step 1 (default Cordova configuration) and will fail to get the data from the API.
To transition it to step 2 (fixed Content Security Policy meta tag, works on iOS <9 and Android):
```
cd /app
./step2.sh
cordova build ios
cordova build android
```
To then transition to step 3 (fixed Content Security Policy and patches iOS 9 ATS in the project's .plist file - works on all devices):
```
cd /app
./step3.sh
cordova build ios
cordova build android
```
To go back to step 1 (not working on iOS <9, 9 or Android):
```
cd /app
./step1.sh
cordova build ios
cordova build android
```