Skip to content

florine2623/ionic-2-file-transfer-example

 
 

Repository files navigation

Ionic 2 File Transfer Example

A very simple file transfer example for Ionic 2 using TypeScript and the Transfer module from ionic-native.

Build

Clone the repository and follow the steps based on the platform of your device.

iOS

Note: building iOS requires a Mac OS.

  1. npm install
  2. ionic build ios
  3. Connect your iOS device and run the application, either by
  4. Opening up the relevant .xcodeproj on Xcode and clicking the run button (making sure your device is selected)
  5. Running ionic run ios --device on your CLI - this requires that the npm package ios-deploy is installed globally (npm install -g ios-deploy)

Android

  1. npm install
  2. ionic build android
  3. Connect your Android device and run the application with ionic run android (make sure USB debugging is enabled on your device)

File Transfer - Storage Locations

The .jpg used in this example is saved in different locations dependant on platform:

  • iOS - in the app-specific Documents/ folder using cordova.file.documentsDirectory

  • Android - persistent and private data storage within the application's sandbox using cordova.file.dataDirectory

Here's the list of the different places you can store files using this plugin.

Testing

iOS

Using Xcode, go to Window and selected Devices, then

  1. Select the device you downloaded the file to
  2. Select the application you used to download the file (in this case Ionic2FileTransferExample)
  3. You should see the folder Documents, inside of which you'll find the image.

Android

Use adb:

adb shell
run-as com.ionicframework.ionic2filetransferexample648376
cd files
ls

Extending this example - checking if files/directories exist, copying files etc.

Ionic Native has a File module (seperate from the Transfer module we're using in this example).

Using it is as simple as installing the plugin

ionic plugin add cordova-plugin-file

Importing it alongside Transfer in the home.ts

import {File, Transfer} from 'ionic-native';

Now you can get coding with it ✌🏻 

License

MIT

About

📁 File Transfer in Ionic 2 using Ionic Native's Transfer module

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 32.6%
  • TypeScript 28.1%
  • CSS 23.6%
  • HTML 15.7%