Search code examples
ionic-frameworkcouchbasepouchdbcouchbase-litecouchbase-sync-gateway

Setting up PouchDB to Sync Gateway Walrus replication


I'm having a hard time setting up the replication between PouchDB and Sync Gateway.

I tried to follow Couchbase's blog post, but I wasn't successfull, either.

I'm building an Ionic application with angular-pouchdb and ng-pouchdb.

Here's what I got figured out so far:

  1. every time I call pouchCollection it either creates a new database with the given name, or gives you a reference of the already created database;
  2. the Sync Gateway is responsible for authorization of each document. I'm running it now with the GUEST user enabled, with "admin_channels": ["*"], so everyone should be able to access everything, right?
  3. CORS should be enable, since both the app and the server are running on the same machine (localhost)
  4. to get replication in both ways, I should use db.sync(URL) (angular-pouchdb), where URL is something like http://localhost:4984/prospect/ (and prospect could be the DB name)

Here's my Sync Gateway config.json file:

{
  "log": ["CRUD", "REST+", "Access"],
  "facebook": {"register": true},
  "CORS": {
    "Origin": ["http://localhost:8100"],
    "LoginOrigin": ["http://localhost:8100"],
    "Headers": ["Content-Type"],
    "MaxAge": 17280000
  },
  "databases": {
    "prospect": {
      "server": "walrus:",
      "users": {
        "GUEST": {"disabled": false, "admin_channels": ["*"]}
      },
      "sync":
      `
      function(doc, oldDoc) {
        channel("everything");
      }
      `
    }
  }
}

Here's my Ionic code:

app.controller('MyCtrl', function($scope, pouchCollection) {
  $scope.students = pouchCollection('students');
  var URL = 'http://localhost:4984/prospect/';
  $scope.students.$db.replicate.sync(URL);
// ...list the array in the view
}

Whenever I try to make the replication work, I get the following in the console when running for the first time:

GET http://localhost:4984/prospect/_local/jeOaLtKGemQWDpNAPzorJQ%3D%3D?_nonce=1442271117949 404 (Not Found)xhRequest @ pouchdb.js:641625.module.exports @ pouchdb.js:6435ajax @ pouchdb.js:604824.module.exports @ pouchdb.js:6211ajax @ pouchdb.js:989(anonymous function) @ pouchdb.js:994ajaxPromise @ pouchdb.js:993(anonymous function) @ pouchdb.js:1241(anonymous function) @ pouchdb.js:1069979 @ pouchdb.js:10760(anonymous function) @ pouchdb.js:7659(anonymous function) @ pouchdb.js:764679 @ pouchdb.js:1076068.Checkpointer.getCheckpoint @ pouchdb.js:9407(anonymous function) @ pouchdb.js:10076
pouchdb.js:6416 GET http://localhost:4984/prospect/_local/2_QcxPjLD.zmtOXa7VM8Gw%3D%3D?_nonce=1442271117953 404 (Not Found)xhRequest @ pouchdb.js:641625.module.exports @ pouchdb.js:6435ajax @ pouchdb.js:604824.module.exports @ pouchdb.js:6211ajax @ pouchdb.js:989(anonymous function) @ pouchdb.js:994ajaxPromise @ pouchdb.js:993(anonymous function) @ pouchdb.js:1241(anonymous function) @ pouchdb.js:1069979 @ pouchdb.js:10760(anonymous function) @ pouchdb.js:7659(anonymous function) @ pouchdb.js:764679 @ pouchdb.js:10760(anonymous function) @ pouchdb.js:9408
pouchdb.js:6416 GET http://localhost:4984/prospect/_local/jeOaLtKGemQWDpNAPzorJQ%3D%3D?_nonce=1442271118095 404 (Not Found)xhRequest @ pouchdb.js:641625.module.exports @ pouchdb.js:6435ajax @ pouchdb.js:604824.module.exports @ pouchdb.js:6211ajax @ pouchdb.js:989(anonymous function) @ pouchdb.js:994ajaxPromise @ pouchdb.js:993(anonymous function) @ pouchdb.js:1241(anonymous function) @ pouchdb.js:1069979 @ pouchdb.js:10760(anonymous function) @ pouchdb.js:7659(anonymous function) @ pouchdb.js:764679 @ pouchdb.js:10760updateCheckpoint @ pouchdb.js:930368.Checkpointer.updateTarget @ pouchdb.js:936868.Checkpointer.writeCheckpoint @ pouchdb.js:9362finishBatch @ pouchdb.js:9829
(index):28 The above 404 is totally normal. PouchDB is just checking if a remote checkpoint exists.

Since the last line says it is normal, I assume everything is fine.

When I run the app in the browser and in the emulator, Sync Gateway says things like:
2015-09-14T19:54:04.913-03:00 HTTP:  #001: GET /prospect/?_nonce=1442271244612
2015-09-14T19:54:18.730-03:00 HTTP:  #002: GET /prospect/?_nonce=1442271258729
...
2015-09-14T19:56:13.362-03:00 HTTP:  #049: GET /prospect/_local/2_QcxPjLD.zmtOXa7VM8Gw==?_nonce=1442271373356
2015-09-14T19:56:13.376-03:00 HTTP:  #050: PUT /prospect/_local/2_QcxPjLD.zmtOXa7VM8Gw==

To me, it looks like everything is working. But I can't get it to sync with the iOS emulator or in a different browser.

What am I missing?


Solution

  • For your Questions..

    [2]: The * Star channel is the channel where every document is automatically added to that channel. Example, a guest user will be granted the * star channel where that gives you the open ended access so any user that gets * (star) will be able to see everything in the system.

    [3]: You do not need to enable CORS as sync gateway is running on the same domain as your webapp. Enabling CORS allows web apps to access resources on other domains rather than the origin domain.

    The LoginOrigin list protects access to the _session and _facebook endpoints.

    [4]: To replicate your data, within the app.js file you would define a URL variable for sync, like:

    var SYNC_GATEWAY_URL = 'http://127.0.0.1:4984/prospect/';