Import crypt-pouch and all its dependencies into the web app without using nodejs or bower

ajithmjose commented 8 years ago

Background

I am coming from a Java/JSP/JSF background. I would like to use 'crypto-pouch' within the new web application that I am working on (it is an angularjs, pouchdb app). I have no clue about nodejs or bower.

Issue

I am accessing the 'crypto-pouch' scripts via the online URL 'wzrd.in/standalone/crypto-pouch'. The app that I am building should work in an intranet environment with no access to internet . So I have to bring 'crypto-pouch' and all its dependencies into my project.

Please advice how I can bring the 'crypto-pouch' into my app. I don't use nodejs or bower.

calvinmetcalf commented 8 years ago

there is a file called bundle.js in this repo which is crypto-pouch and all it's dependencies, if you download that , make it availalble to the html page and then add a script tag pointing to it after the pouchdb script tag you should be all set

ajithmjose commented 8 years ago

<!DOCTYPE html>
<html>
 <head>
   <script src="pouchdb-5.2.1.min.js"></script>
   <script src="crypto-pouch-master/bundle.min.js"></script> 
   <script>
       var db = new PouchDB('kittens4');
      var password = "mypassword";
db.crypto(password).then(function (publicKey) {
   console.log("Public key: "+publicKey);
    return db.put({_id: 'foo', bar: 'baz'});
}).then(function () {
    return db.get('foo');
}).then(function (doc) {
    console.log('decrypted', doc);
    return db.removeCrypto();
}).then(function () {
    return db.get('foo');
}).then(function (doc) {
    console.log('encrypted', doc);
})
   </script>
 </head>
 <body>
 </body>
</html>

My code is provided above when I run my page , I get the following javascript error in my console...

Uncaught (in promise) RangeError: Trying to access beyond buffer length(…)v @ bundle.min.js:4i.readUInt32LE @ bundle.min.js:4i @ bundle.min.js:4i @ bundle.min.js:4i @ bundle.min.js:4r @ bundle.min.js:10r @ bundle.min.js:10s.bulkDocs @ bundle.min.js:10s @ bundle.min.js:9(anonymous function) @ bundle.min.js:9(anonymous function) @ pouchdb-5.2.1.min.js:10(anonymous function) @ pouchdb-5.2.1.min.js:7(anonymous function) @ pouchdb-5.2.1.min.js:7(anonymous function) @ pouchdb-5.2.1.min.js:7(anonymous function) @ pouchdb-5.2.1.min.js:7(anonymous function) @ pouchdb-5.2.1.min.js:7(anonymous function) @ pouchdb-5.2.1.min.js:7(anonymous function) @ pouchdbDemo.html:14

calvinmetcalf commented 8 years ago

if you do it with non minified versions of the libs we can maybe track down where the errors are coming from

ajithmjose commented 8 years ago

I ran the same code with the normal non minified 'bundle.js' and got the following error in the browser console.

Uncaught (in promise) RangeError: Trying to access beyond buffer length(…) checkOffset @ bundle.js:7543 Buffer.readUInt32LE @ bundle.js:7566 Chacha20 @ bundle.js:8225 Cipher @ bundle.js:8089 createCipher @ bundle.js:8189 encrypt @ bundle.js:22238 incoming @ bundle.js:21795 handlers.bulkDocs @ bundle.js:21844 callHandlers @ bundle.js:18102 (anonymous function) @ bundle.js:17847 (anonymous function) @ pouchdb-5.2.1.min.js:10 (anonymous function) @ pouchdb-5.2.1.min.js:7 (anonymous function) @ pouchdb-5.2.1.min.js:7 (anonymous function) @ pouchdb-5.2.1.min.js:7 (anonymous function) @ pouchdb-5.2.1.min.js:7 (anonymous function) @ pouchdb-5.2.1.min.js:7 (anonymous function) @ pouchdb-5.2.1.min.js:7 (anonymous function) @ pouchdbDemo.html:11

And my complete code is provided below for your reference:

<!DOCTYPE html>
<html>
 <head>
   <script src="pouchdb-5.2.1.min.js"></script>
   <script src="crypto-pouch-master/bundle.js"></script> 
   <script>
      var db = new PouchDB("kittens5");
      var password = "mypassword";

      db.crypto(password).then(function () {
       return db.put({_id: "foo", bar: "baz"});
      }).then(function () {
           return db.get("foo");
      }).then(function (doc) {
        console.log("decrypted", doc);
            return db.removeCrypto();
      }).then(function () {
            return db.get("foo");
      }).then(function (doc) {
        console.log("encrypted", doc);
      })
   </script>
 </head>
 <body>
 </body>
</html>

ajithmjose commented 8 years ago

Any clue why the above mentioned issue is happening ?..

Are we planning to find a solution to the above mentioned problem, otherwise I may have to abandon the idea of using 'crypto-pouch' for our application.

Please advice !

calvinmetcalf commented 8 years ago

let me take a look

calvinmetcalf commented 8 years ago

the bundle was built with an out of date version of browserify, updated and should work now

ajithmjose commented 8 years ago

Thanks Calvin, it all worked well. All good now

calvinmetcalf / crypto-pouch

Import crypt-pouch and all its dependencies into the web app without using nodejs or bower #22