Как подключить couchDB с помощью angular.js?

Ответ 1

Пока у меня нет опыта angular.js, посмотрите Пример Google Buzz, у него есть способ справиться с JSON - предоставление ресурсов. Поскольку это именно то, что CouchDB, я не думаю, что есть необходимость в участии node.js.

Доступ ко всем функциям CouchDB осуществляется через HTTP-запросы, поэтому он должен соответствовать требованиям, если необходимо, с помощью вызовов AJAX. angular.service.$resource выглядит подходящим кандидатом.

Ответ 2

Я создал модуль AngularJS под названием CornerCouch, который улучшает подход Ресурс AngularJS $, адаптируя его специально для CouchDB. Он основан на службе $http в AngularJS. Я закончил с красивым чистым кодом JavaScript таким образом, особенно в определенном для приложения контроллере AngularJS.

Модуль CornerCouch AngularJS

Выполнение вызовов напрямую оставляет три варианта, насколько я знаю:

• Загрузите приложение html непосредственно из приложения CouchDB (подход CouchApp)

• Использовать прозрачный прокси-сервер, включенный в проект Jetty (Java app stack)

• Доступ только через GET, но с использованием JSONP, после включения его на сервере CouchDB

Все остальное не связано с ограничениями на межсайтовый скриптинг.

Ответ 3

Эшвин, спасибо, что спросил об этом. Я тоже борюсь с этой проблемой.

Я еще не понял, как использовать $resource для вызова локального CouchDB из AngularJS, так как он использует полный URL-адрес локального хоста, например:

http://localhost:5984/<dbname>/_all_docs

а все документы и примеры AngularJS показывают локальные пути. Они действительно не говорят, как обратиться к отдельной веб-службе, или, по крайней мере, я не нашел объяснений, которые помогают:)

Вот способ использования jQuery, который мне было легче понять. Я поместил это в файл с именем couch.js - для подключения к CouchDB наших тварей (собак, кошек и т.д.). Фактический модуль ( "приложение" ) определен в другом месте приложения, поэтому я просто поместил его в переменную с именем "приложение" и добавил контроллер Couch так:

(function () {
    'use strict';
    var app = angular.module('app');
    app.controller('CouchCtrl', function ($scope,$http,$resource) {
        var all_critters = 'http://localhost:5984/critters/_all_docs?callback=?';
        $.getJSON(all_critters, function(json) {
            $scope.$apply(function(){
                $scope.all_critters = json;
            });
        });
        $scope.getAllCritters = function() {
            return $scope.all_critters;
        };
    });
}());

Я добавил 'callback =? для JSONP, чтобы избежать проблем с локальным хостом при работе с браузерами, когда я работал локально, поэтому я установил JSONP = true в настройках CouchDB.

На странице html просто посмотрите на результат этого вызова, поставив crittersDB в привязку:

<ul ng-controller="CouchCtrl">
    <h5>Critters</h5>
    <p>There are currently {{all_critters.total_rows}} critters.</p>
    <li ng-repeat="(key,value) in all_critters">
        {{key}} - {{value}}
    </li>
</ul>

Если кто-нибудь может опубликовать некоторый фактический код ресурса AngularJS $, чтобы реплицировать этот способ jQUery.getJSON для вытаскивания данных из CouchDB в приложение AngularJS, я был бы признателен.

Ответ 4

Хитрость заключается в том, что ваша страница, которая включает запросы на couchdb, должна обслуживаться с одного и того же адреса и порта как сама couchdb. Это может быть выполнено путем обслуживания вашего html с помощью couchdb или путем установки прокси-сервера, который будет действовать как зонтик для вашего веб-сервера, на котором размещаются html и couchdb.

Ответ 5

Я изменил пример на веб-сайте AngularJS, чтобы использовать CouchDB вместо mongolab. См. Jsfiddle здесь http://jsfiddle.net/WarwickGrigg/dCCQF/ и репозиторий github здесь https://github.com/telanova/angularjs-couchdb. Я новичок angular: я нашел, что это борьба за то, чтобы получить голову вокруг $resource, но, похоже, она работает хорошо.

$scope.projects = ProjectCouch.get({q:'_all_docs', include_docs: 'true', limit: 10});

angular.module('CouchDB', ['ngResource']).
    factory('ProjectCouch', function($resource) {
        var ProjectCouch = $resource(':protocol//:server/:db/:q/:r/:s/:t',
                                     {protocol: 'http:', server: 'localhost:5984', db:'projects'}, {update: {method:'PUT'}   
                           }
   ); 

   ProjectCouch.prototype.update = function(cb) {
    return ProjectCouch.update({q: this._id},
        this, cb);
  };

  ProjectCouch.prototype.destroy = function(cb) {
      return ProjectCouch.remove({q: this._id, rev: this._rev}, cb);
  };

  return ProjectCouch;
});