Compatible pouchdb-Browser versions

Hello,

I initialize hoodie in a typescript/react project like this:

 const PouchDB = require('pouchdb-browser');
 const pouchdb = PouchDB.default.defaults({ revs_limit: this.revisionLimit, auto_compaction: true });
 
 const Hoodie = require('@hoodie/client');
 const hoodie = new Hoodie({
            url: someUrl
            PouchDB: pouchdb
 });

When I use the latest pouchdb-browser version (7.1.1.) I experience the following behavior when I try to connect to the hoodie backend:

• SignUp and SignIn are working
• Normally in a working environment after signing in Hoodie/ PouchDb try to connect (Console message “The above 404 is totally normal. PouchDB is just checking if a remote checkpoint exists.” is shown) but this does not work.
• Instead I see a “unauthorized” request and a “getCheckpoint rejected with” error:

GET http://.../hoodie/store/api/user%.../ 401 (Unauthorized)

customPouchError {statusCode: 401, error: "Unauthorized", status: 401, name: "Unauthorized", message: "getCheckpoint rejected with ", …}
error: "Unauthorized"
message: "getCheckpoint rejected with "
name: "Unauthorized"
result: {ok: false, start_time: "...", docs_read: 0, docs_written: 0, doc_write_failures: 0, …}
status: 401
statusCode: 401

The combination of hoodie@28.2.9, @hoodie/client@10.1.1 and pouchdb-browser@6.4.3 seems to work. So is the latest pouchdb-browser not supported by hoodie?

Kind Regards

[PiTomar]

I did some more research: As expectet it has something to do with the authorization header. In @hoodie\client\lib\get-api.js the PouchDB request is build like this:

var hoodieStore = new internals.Store('store', {
    PouchDB: state.PouchDB,
    get remote () {
      return hoodieAccount.get(['id', 'session.id']).then(function (properties) {
        return new state.PouchDB(url + '/store/api/' + encodeURIComponent('user/' + properties.id), {
          ajax: {
            headers: {
              authorization: 'Session ' + properties.session.id
            }
          }
        })
      })
    }
  })

Since PouchDB 7 there is a change about the request handling, see also chapter “Switch to fetch” on https://github.com/pouchdb/pouchdb/releases/tag/7.0.0 And: https://github.com/pouchdb-community/pouchdb-authentication/issues/239

On the following picture on the left is pouch 6.4.3. You can see the “Ajax.headers” are evaluated. On the right in pouch 7.1.1, this is no longer the case. (Only a “header object is evaluated)

So if I change the PouchDB init to something like this it seems to work:

  var hoodieStore = new internals.Store('store', {
    PouchDB: state.PouchDB,
    get remote () {
      return hoodieAccount.get(['id', 'session.id']).then(function (properties) {
        return new state.PouchDB(url + '/store/api/' + encodeURIComponent('user/' + properties.id), {
          headers: {authorization: 'Session ' + properties.session.id}
        })
      })
    }
  })

Now there is no “unauthorized error” anymore and the sync works but I’m not sure if this is enough and unfortunately, I’m not sure how to handle this now. I would like to do a PR but I can’t find the right pouch dependency in the hoodie client stuff and I also don’t know how to fix it without breaking old stuff. If someone could give me a little guidance what to do next, I would really appreciate and will try to create a PR.

[PiTomar]

I need to dig some deeper in the hoodie/pouchdb stuff because this is my first ever contact with it, but if I can figure it out I’ll try to do a PR.