How To Let Users Save Files From Your Website To Various Cloud storage Using Filepicker.io

By Cloud Techie Wednesday, 20 March 2013
Nearly every website offers some sort of downloads. Lets say you have a website and you let viewers  download files and contents from your website. Some users might download it to their computer, some users want that files in their dropbox ,box,Google drive  or any other cloud storage. Wouldnt it be great if your website allows users to save the file directly to any cloud storage , email  or their computer??. Filepicker.io does this job in an efficient way, so that you dont have to mess around with all those custom codes. Filepicker.io allows your viewers to download your website content to  any cloud storage of their choice by integrating you website with all the cloud storage through API's. You can integrate filpicker.io with a few lines of code. It takes care of all the API and cloud storage integration's.


Saving Files To Cloud Storage:

Step1: Signup for filepicker.io here FilePicker Signup.

Step2:Login to the account and open developers portal.Create a new appliction by clicking "create new application " option under applications.



Step 3: Note down the API key somewhere in notepad or some other editor. Now add the following code just above the closing body tag of your webpage.
<script src="//api.filepicker.io/v1/filepicker.js" type="text/javascript"></script>
Step 4: Add the following code to the head section of your webpage. This javascript contains the filepicker.io API key which is highlighted in blue and the url of the file which has to uploaded to viewers cloud storage is highlighted in red. You have to replace the API key with your applications API key and url with your files url. If your file is a pdf or a word document , you have to change the extension type according to that.
<script type="text/javascript">
function storefile()
 {
   filepicker.setKey('A8edxitRqTkGOV4L2EtRHz');
   filepicker.exportFile('http://www.countrymusictattletale.com/wp-content/freebies/2013/02/Taylor-Swift.jpg',
   {mimetype:'image/png'},
   function(FPFile){
   console.log(FPFile.url);
   });
  }
/* for pdf and rar downloads use {extension: '.pdf,.rar'} inside the storefile() function */
Step 5: Add the following code inside the body tag where you want to place the download button.
 <button onclick="storefile()">Download</button>