Upgrade to Pro — share decks privately, control downloads, hide ads and more …

How to secure your data with Sencha Space

How to secure your data with Sencha Space

How to secure your data with Sencha Space
We all love HTML5 apps! Nowadays they perform so well, and they all can run across multiple devices with just one single code base! There is just one thing, which is often a bottleneck for (large) enterprises. The reason why these companies can’t choose their solution in HTML5 is because of data security! Local Storage, Session Storage, local databases, app cache and even cookies… they are not secure. Think about XSS attacks, stolen devices or your digital downloads available for purchase are for free available on torrent sites. A security breach can be easily made!
Introducing Sencha Space; the secure platform to deploy your HTML5 apps in. Let's see how to encrypt and develop code to optimize your apps for Sencha Space!

Lee Boonstra

November 27, 2014

More Decks by Lee Boonstra

Other Decks in Technology


  1. Copyright Sencha Inc. 2014 3 This Session Introduction to Sencha

    Space Sencha Space Clients Sencha Space Admin Console Sencha Space API
  2. Copyright Sencha Inc. 2014 5 We all love HTML5 apps!

    “Storing data within HTML5 applications is by it’s nature not really secure.”
  3. Copyright © 2014 Sencha Inc. 6 Sencha Space | Data

    in HTML5 apps App Cache Cookies Local & Session Storage Web SQL File System IndexedDB We all save data offline…
  4. Copyright © 2014 Sencha Inc. 7 Your sensitive data in

    somebody else’s hands. Watch Dogs
  5. Copyright © 2014 Sencha Inc. 8 Sencha Space | A

    security breach Hackers attacked your website with cross-site scripting (XSS) Your iPhone got stolen, or you lost your tablet A download saved to the file system is available a week later on a torrent site A security breach!
  6. Copyright Sencha Inc. 2014 12 Sencha Space | What is

    Sencha Space? Develop Deploy Manage Reduce the cost of developing secure, cross- platform mobile apps. Simplify app deployment for testing and production. Enforce policies to secure your users, data, and applications
  7. Copyright © 2014 Sencha Inc. 17 Sencha Space | Supported

    platforms Mobiles (phones & tablets) Desktops
  8. Copyright © 2014 Sencha Inc. 21 Sencha Space | Sencha

    Space Client Browser Download the Sencha Space Client iOS: http://bit.ly/1bvUxot Android: http://bit.ly/1aBKsrI Windows Phone: http://bit.ly/TK05J0 (or Windows & Mac desktop)
  9. Copyright © 2014 Sencha Inc. 25 Sencha Space | Sencha

    Space Admin Console Browser Open the admin console http://manage.space.sencha.com Sencha Space Admin Log in to Sencha Space
  10. Copyright © 2014 Sencha Inc. 26 Sencha Space | Applications

    Sencha Space Admin Sencha Space Admin
  11. Copyright © 2014 Sencha Inc. 30 Sencha Space | VPN

    Sencha Space Admin Setup VPN access, map applications to 
 setup a secure tunnel Great for applications behind firewalls!
  12. Copyright © 2014 Sencha Inc. 34 Sencha Space | Cross

    platform deployment One code base.
  13. Copyright © 2014 Sencha Inc. 35 Sencha Space | Cross

    platform deployment Deploying with Sencha Space means no longer you have to deal with browser differences.
  14. Copyright © 2014 Sencha Inc. 36 Sencha Space | Eliminate

    app store deployment The review process of various app stores can take a lot of time! Sencha Space can deliver directly to all end users. Eliminate native packaging.
  15. Copyright © 2014 Sencha Inc. 37 Sencha Space | Branding

    your application Sencha Space Admin
  16. Copyright © 2014 Sencha Inc. 40 Sencha Space | Getting

    started with the Sencha Space API if(Ext.isSpace) { // Space Specific } else { // Fallback } JavaScript Code Check to see if your app is running inside Sencha Space Include the Sencha Space API in your HTML5 project. <script src="http://space.sencha.io/space.js"></script> HTML Code Ext.onSpaceReady().then(function(){ // Space APIs }); JavaScript Code Wait until Sencha Space has fully initialized before making any Space API calls.
  17. Copyright © 2014 Sencha Inc. 41 Sencha Space | Ext.Promise

    function getCustomResults() { var promise = Ext.Promise(); //code while pending, //for example a preloaded } JavaScript Code Ext.Promise is an Asynchronous API based on the Promises A+ spec. var success: function(result) { promise.fulfill(result); //code, to display the //promised result } JavaScript Code var failure: function(reason) { promise.reject(reason); //code, an error message with //the reason why it failed } JavaScript Code getCustomResults().then(success, failure); JavaScript Code Fulfill the promise or reject it. Now, let’s execute the method.
  18. Copyright © 2014 Sencha Inc. 42 Sencha Space | Ext.space.Invoke

    Ext.space.Invoke.get('photos').then(send, failure); JavaScript Code The Invoke API allows Applications running inside a Sencha Space client
 to communicate. Applications can securely exchange 
 data with each other.
  19. Copyright © 2014 Sencha Inc. 43 Sencha Space | Ext.space.Camera

    var promise = Ext.space.Camera.capture({ quality: 75, width: 200, height: 200, destination: 'file' }); promise.then(function(image){ //either URI to the image or data URI of the selected image. }); JavaScript Code Use the device camera.
  20. Copyright © 2014 Sencha Inc. 44 Sencha Space | Ext.space.Downloads

    // list some details when the download completes function onComplete(download) { console.log("File finished: " + download.url); console.log("Size: " + download.totalBytes); console.log("Saved to: " + download.fileName); } Ext.space.Downloads.download({ url: “http://www.sencha.com/" }).then(onComplete); JavaScript Code Space API for downloading files. Downloadable objects become instances of: Ext.space.files.Download
  21. Copyright © 2014 Sencha Inc. 45 Sencha Space | Ext.space.files.Collection

    //Create a collection of files var myCollection = Ext.space.SecureFiles.get(“secrets"); //To retrieve the file contents myCollection.get("someFile.txt").then(function(contents) { // got 'em }); //To write file contents myCollection.set("someFile.txt", "My new contents").then(function(file) { // `file` is the Ext.space.files.File that was written }); JavaScript Code Key/Value store for files. A collection represents a flat grouping of files in an application's file system, and it allows you to do basic CRUD operations on the files contained therein. Files become instances of: Ext.space.files.File. http://space.sencha.io/docs/api/Ext.space.files.Collection.html
  22. Copyright © 2014 Sencha Inc. 46 Sencha Space | Ext.space.SecureFiles

    var files = Ext.space.SecureFiles.get('secrets'); files.get('myKey').then(function(contents){ // do something with the content of the file. }); //or query for files Ext.space.SecureFiles.query({ name: "*.txt" }).then(function(files) { // got 'em }); JavaScript Code Key/Value store for files. Files stored using this API are encrypted automatically using Sencha Space's security infrastructure.
  23. Copyright © 2014 Sencha Inc. 47 Sencha Space | Ext.space.SecureLocalStorage

    var secrets = Ext.space.SecureLocalStorage.get('secrets'); secrets.set('myKey',object).then(function(){ //do something when done. }); secrets.get('myKey').then(function(object){ var a = object.field; }); secrets.forEach(function(key, value){}).then(function(){ // done. }); JavaScript Code Secure Local Storage is a key value store modeled around html5 localstorage, but it’s encrypted and not limited to 2-3mb.
  24. Copyright Sencha Inc. 2014 49 Sencha Space | Much more

    Device API Connection API Notifications Push Notifications Orientation BarCode Application Fullscreen API Focus API Window API Profile API Storage SecureSQL Uploads File transfers
  25. Copyright © 2014 Sencha Inc. 50 Sencha Space | Conclusion

    Sencha Space is a secure, cross-platform environment for the deployment of your desktop and mobile web apps. Data can be encrypted, and because you have an administrator panel, you can report, monitor and maintain application, user and device access. Applications within the Sencha Space can: • get access to the local stored and encrypted data. • get access to device APIs such as camera, downloads, etc.. • applications can invoke each other.
  26. Copyright © 2014 Sencha Inc. 51 Sencha Space | Resources

    Sencha Space http://www.sencha.com/space Sench Space API examples https://github.com/sencha/SpaceExamples Sencha Space Guides: http://docs.sencha.com/space Sencha Space webinar: http://vimeo.com/86939052 Sencha Space blog posts: http://docs.sencha.com/space/1.0.0/sencha_blog.html
  27. Copyright Sencha Inc. 2014 53 Sencha Create amazing apps built

    on web standards [email protected] | ladysign | http://www.speakerdeck.com/savelee