Dropbox APIs for JavaScript developers

5573f0b3cbe983ae0f2d00a2e610d6be?s=47 Leah Culver
September 18, 2014

Dropbox APIs for JavaScript developers

Nordic.js, Sept 18, 2014
http://nordicjs.com/

We live in a world where users expect their data to follow them seamlessly across devices and platforms, and developers therefore require simple APIs to enable this seamless integration. This talk will cover the range of Dropbox APIs available for JavaScript developers, from simple file uploading and downloading to more complex file system interfaces and data storage.

Find out how to do a simple upload/download Dropbox integration with just a few lines of code or how to more deeply integrate with the Dropbox file system, powered by notifications. Also learn how to use the Dropbox Datastore API, a database-like backend for your JavaScript application as demoed in the Dropbox clone of the popular game 2048.

5573f0b3cbe983ae0f2d00a2e610d6be?s=128

Leah Culver

September 18, 2014
Tweet

Transcript

  1. 3.
  2. 4.
  3. 6.

    Drop-ins Just a few lines of code • Choose a

    file from Dropbox • JavaScript, iOS, Android • Save a file to Dropbox • JavaScript Chooser Saver
  4. 9.
  5. 11.

    var options = { success: function(files) { alert("Here's the file

    link: " + files[0].link) }, cancel: function() {}, linkType: "preview", // or “direct" multiselect: false, // or true extensions: [“.jpg”, “.png”], } Chooser options
  6. 12.

    Chooser result file = { name: "filename.txt", link: "https://...", bytes:

    464, icon: "https://...", thumbnailLink: "https://...?bounding_box=75&mode=fit", }
  7. 14.
  8. 17.

    Saver options var options = { files: [ // Up

    to 100 files [“url":"…", "filename":"…"}; ], success: function() {}, cancel: function() {}, error: function(errorMessage) {}, // Called periodically, between 0 and 1 progress: function(progress) {}, }
  9. 18.

    Saver caching • Download unique files once • HTTP headers

    to determine freshness • Cache-Control and Expires
  10. 19.

    Drop-ins Supported browsers • Chrome • Firefox • Safari •

    Internet Explorer 8+ • Safari • Android browser • Chrome on Android Desktop Mobile
  11. 20.
  12. 21.

    Core API • REST-ish, OAuth 2.0, JSON • SDKs for

    Python, Ruby, PHP, Java, Android, iOS, OSX • Community-supported libraries for JavaScript, C#, Perl, and more HTTP API for files
  13. 22.

    • List files
 /metadata/<root>/<path> • Upload file
 /files_put/<root>/<path> • Get

    a thumbnail
 /thumbnails/<root>/<path> • Share via a link
 /shares/<root>/<path> Core API
  14. 25.

    Datastore API Structured data • Like a no-SQL database •

    JavaScript, iOS, OSX, Android, Python • Stored in user’s Dropbox
  15. 30.
  16. 31.

    var client = new Dropbox.Client({ key: ‘APP_KEY' }); client.authenticate(updateAuthenticationStatus); !

    function updateAuthenticationStatus(err, client) { var datastoreManager = client.getDatastoreManager(); … } Setup and auth
  17. 32.

    // Create a datastore datastoreManager.createDatastore(function(err, ds){ … }); // Open

    existing datastore datastoreManager.openDatastore(dsid, function(err, ds) { … }); // Delete a datastore datastoreManager.deleteDatastore(dsid, function(){ … }); Datastore manager actions
  18. 33.

    Listen for changes // Datastores changed datastoreManager.datastoreListChanged.addListener(function(e){ // DatastoreInfo objects

    for all datastores var infos = e.getDatastoreInfos(); … }); ! // Records changed in a single datastore datastore.recordsChanged.addListener(function(e){ … });