AngularJS $ http и $ resource


257

У меня есть несколько веб-сервисов, на которые я хочу позвонить. $resourceили $httpкакой из них мне следует использовать?

$resource: https://docs.angularjs.org/api/ngResource/service/$resource

$http: https://docs.angularjs.org/api/ng/service/$http

После того, как я прочитал две вышеупомянутые страницы API, я потерян.

Не могли бы вы объяснить мне на простом английском языке, в чем разница и в какой ситуации я должен их использовать? Как мне структурировать эти вызовы и правильно читать результаты в объекты js?


25
$ resource построен поверх $ http и обеспечивает дальнейшее абстрагирование от базовых коммуникаций. Требуется также конечная точка REST, соответствующая шаблонам $ resource. Поскольку вы спрашиваете, я предлагаю начать с $ http, познакомиться, а затем посмотреть, сможете ли вы перейти на $ resource.
Дэвид Риччелли

4
Спасибо за ответ. Итак, в какой ситуации $ http всегда предпочтительнее $ ресурса, кроме того, что я могу познакомиться с API?
Том

Ответы:


168

$httpдля общего назначения AJAX. В большинстве случаев это то, что вы будете использовать. С $httpвы собираетесь делать GET, POST, DELETEтип вызовов вручную и обработки объектов , они возвращаются на свои собственные.

$resourceобертки $httpдля использования в сценариях RESTful web API.


Если говорить в самом общем виде : веб - сервис успокоительной будет обслуживание с одной конечной точки для типа данных , который делает разные вещи с этим типом данных на основе HTTP методы , такие как GET, POST, PUT, DELETEи т.д. Таким образом , с $resource, вы можете назвать , GETчтобы получить ресурс как объект JavaScript, затем измените его и отправьте обратно с помощью POSTили даже удалите его с помощью DELETE.

... если это имеет смысл.


1
Таким образом, $ resource обрабатывает Restful-сервисы, что означает, что его также можно использовать для вызова обычных веб-сервисов? Так как это делает ПОЛУЧИТЬ ПОСТАВИТЬ УДАЛИТЬ PUT все это. Итак, в какой ситуации $ http всегда предпочтительнее $ ресурса?
Том

7
На самом деле, когда вы не имеете дело с по-настоящему спокойной конечной точкой. Он добавляет множество функциональных возможностей, которые вам не нужны, например, если ваша конечная точка разрешает только GET.
Бен Леш

@blesh, поэтому использование $resourceсервиса будет только идиоматическими / хорошо , если ваша REST конечной точка опоры GET, POST, и DELETE ? Документы ( docs.angularjs.org/api/ngResource.$resource ) показывают, что вы получаете эти 3 метода REST $resource.
Кевин Мередит

9
@KevinMeredith: Или это любой метод. Вы можете добавить PUTили что-нибудь еще, что вы хотите GET, POSTи DELETEпросто по умолчанию. Если у вас есть конечная точка, которая имеет дело с одним и тем же ресурсом (что важно) для более чем одного метода HTTP, то $resourceэто хороший выбор.
Бен Леш

Даже для конечной точки без RESTful я нашел удобным использовать $ resource для данных типа GET и QUERY. Учитывая способ .$promiseработает хорошо resolveдля маршрутизации и связывания.
Кевин

210

Я чувствую, что другие ответы, хотя и правильные, не совсем объясняют суть вопроса: RESTэто подмножество HTTP. Это означает, что все, что может быть сделано через, RESTможет быть сделано через, HTTPно не все, что может быть сделано через, HTTPможет быть сделано через REST. Поэтому$resource использует $httpвнутренне.

Итак, когда использовать друг друга?

Если все, что вам нужно, это то REST, что вы пытаетесь получить доступ кRESTful веб-сервису, $resourceэто очень упрощает взаимодействие с этим веб-сервисом.

Если вместо этого вы пытаетесь получить доступ ко всему, что не является RESTfulвеб-сервисом, вам придется с этим согласиться $http. Имейте в виду, вы также можете получить доступ к RESTfulвеб-сервису через $http, это будет гораздо более громоздким, чем с $resource. Именно так большинство людей делают это вне AngularJS, используя jQuery.ajax(эквивалент Angular's $http).


21
хороший ответ, это должно быть принято, а не тот, кто на вершине
Анджей Реманн

2
Это означает, что у нас есть три способа вызвать RESTful ?? Используя $ resource, $ http и jquery.ajax, я прав?
Джейк Хуан,

4
@JakeHuang Вы можете назвать это даже без какой-либо библиотеки, есть бесконечные способы сделать это. Я только что раскрыл 2 самых популярных подхода в мире AngularJS и самый распространенный подход за его пределами.
bluehallu

Могу ли я узнать, каковы 2 самых популярных подхода в AngularJS? : p
Джейк Хуан,

41

$httpделает общего назначения AJAX вызова, в котором вообще означает , что он может включать в себя RESTful API плюс Non-успокоительный API.

и $resourceспециализируется на этой части RESTful .

Restful Api стал распространенным в последние годы, потому что URL лучше организован, а не случайный URL, составленный программистами.

Если бы я использовал RESTful API для создания URL, это было бы что-то вроде /api/cars/:carId.

$resource способ получения данных

angular.module('myApp', ['ngResource'])

    // Service
    .factory('FooService', ['$resource', function($resource) {
        return $resource('/api/cars/:carId')
    }]);

    // Controller
    .controller('MainController', ['FooService', function(FooService){
        var self = this;
        self.cars = FooService.query();
        self.myCar = FooService.get('123');

    }]);

Это даст вам объект ресурса , который сопровождается с get, save, query, remove, deleteметодами автоматически.

$http способ получения данных

angular.module('myApp', [])

    // Service
    .factory('FooService', ['$http', function($http){
        return {
            query: function(){
                return $http.get('/api/cars');
            },

            get: function(){
                return $http.get('/api/cars/123');
            }
            // etc...
        }

Посмотрите, как нам нужно определить каждую общую операцию в RESTFul API . Также одним отличием является то, что $httpвозвращает promiseвремя $resourceвозвращает объект. Существуют также сторонние плагины, помогающие Angular справляться с RESTFul API, такие как restangular


Если API это что-то вроде /api/getcarsinfo. Все что нам осталось это использовать $http.


4
Это должен быть ответ.
Ройи Намир

1
Если API, /api/getcarsinfoя думаю, мы все еще можем использовать$resource
Kittu

1
Это должен быть ответ. когда вы сказали: «Кроме того, одно различие заключается в том, что $ http возвращает обещание, а $ resource возвращает объект» 1 - означает ли это, что мне не нужно использовать .then с $ resource? 2- также как пользователь интерфейса, и это может звучать глупо, как я могу узнать, успокаивает ли API или нет? спасибо
ширеф Хатаб

1
@shireefkhatab 1. Да, $ resource - это просто абстракция более высокого уровня, чем $ http для RESTFul API. В примере Doc показано , как использовать его. 2. Это полностью зависит от того, как ваш бэкэнд разработал URL. Если он хочет соответствовать парадигме RESTFul api, тогда вам пора
Qiang

30

Я думаю, что ответ больше зависит от того, кем вы являетесь в то время, когда пишете код. Используйте, $httpесли вы новичок в Angular, пока не знаете, зачем вам это нужно $resource. Пока у вас не будет конкретного опыта того, как $httpвас сдерживать, и вы не поймете смысл использования $resourceв вашем коде , придерживайтесь $http.

Это был мой опыт: я начал свой первый Angular-проект, мне нужно было отправлять HTTP-запросы в интерфейс RESTful, поэтому я провел то же исследование, что и вы сейчас. Основываясь на обсуждении, которое я прочитал в таких вопросах, как этот, я решил пойти с ним $resource. Это была ошибка, которую я хотел бы отменить. Вот почему:

  1. $httpпримеров много, они полезны и, как правило, именно то, что вам нужно. Ярких $resourceпримеров мало, и (по моему опыту) редко все, что вам нужно. Для новичка Angular вы не поймете последствия вашего выбора до тех пор, пока вы не озадачены документацией и не злитесь на то, что не можете найти полезных $resourceпримеров, которые могли бы вам помочь.
  2. $httpэто, вероятно, ментальная карта 1 к 1 с тем, что вы ищете. Вам не нужно изучать новую концепцию, чтобы понять, что вы получаете $http.$resourceприносит много нюансов, для которых у вас еще нет ментальной карты.
  3. К сожалению, я сказал, что вам не нужно изучать новую концепцию? В качестве углового новичка вы действительно должны узнать о обещаниях. $httpвозвращает обещание и .thenможет, так что оно вписывается в новые вещи, которые вы узнаете об Angular и обещаниях. $resource, который не возвращает обещание напрямую, усложняет ваше предварительное понимание угловых основ.
  4. $resourceявляется мощным, потому что он конденсирует код для вызовов RESTful CRUD и преобразования для ввода и вывода. Это здорово, если вам надоело многократно писать код для обработки результатов $httpсебя. Для всех, кто $resourceдобавляет загадочный слой синтаксиса и передачи параметров, что сбивает с толку.

Хотелось бы, чтобы я знал меня 3 месяца назад, и я бы решительно сказал себе: «Держись с $httpребенком. Это просто прекрасно».


1
Мне нравится ваш ответ, особенно последняя строка. В настоящее время я переживаю изменения в использовании $ resource против $ http. Еще я хотел бы добавить, что $ resource действительно очень удобен и помогает, когда вы используете то же существительное API , как /user/:userIdили /thing. Как только вы перейдете к этому, /users/roles/:roleIdвам придется изменять $ resource url и params для каждого глагола, и вы также можете использовать $ http на этом этапе.
coblr

3
Называйте меня шизофреником, чтобы комментировать мой собственный ответ, но я подумал, что упомяну более недавний опыт. Я рефакторинг, чтобы устранить $resourceи переключиться на $httpместа. Я не могу особо подчеркнуть, как сильно я желаю, желаю, чтобы я никогда не встречался $resource. Я вероятно потратил впустую больше недели, гоняясь за нюансами $resourceза месяцы. $httpЭто так просто и понятно, что любой выигрыш, который нужно получить, $resourceбыл полностью уничтожен кривой обучения.
Мэтью Маричиба

24

Я думаю, что важно подчеркнуть, что $ resource ожидает объект или массив как ответ от сервера, а не необработанную строку. Поэтому, если в качестве ответа у вас есть необработанная строка (или что-либо кроме объекта и массива), вы должны использовать $ http


Означает ли это, что $ http не поддерживает объект и массив? Просто хотел уточнить.
Шардул

Я считаю, что $ http поддерживает объекты, массивы и строки - хотя мне нужно подтверждение этого
Katana24

@Shardul, я понял, что $ http имеет дело с любым ответом, но $ resource имеет дело только с объектами и массивами.
Ширеф Хатаб

Не правда, вы все равно можете использовать $ resource для возврата String. Используйте 'transformResponse' в своем коде внешнего интерфейса, чтобы обернуть возвращаемую строку в объект.
Терри Дэн

7

Когда дело доходит до выбора между $httpили$resource технически говоря, нет правильного или неправильного ответа, по сути, оба будут делать то же самое.

Цель $resourceсостоит в том, чтобы позволить вам передать строку шаблона (строку, содержащую заполнители) вместе со значениями параметров. $resourceзаменит заполнители из строки шаблона значениями параметров, передаваемыми в качестве объекта. Это в основном полезно при взаимодействии с источником данных RESTFul, так как они используют аналогичные принципы для определения URL.

Что $httpделает для выполнения асинхронных HTTP-запросов.


1
Это хороший ответ, потому что указывает на то, что $ http - это то, что обеспечивает запросы от $ resource, и которые либо делают, по сути, то же самое.
coblr

@Dalorzo То есть ты хочешь сказать, что $resourceне может работать асинхронно? Просто хотел уточнить
Kittu

Нет, я указал на то, что в конце $httpсамый простой способ выполнить асинхронные HTTP-запросы и что, по $resourceсути, делает то же самое, но с другими параметрами
Dalorzo

2

Сервис ресурсов - это просто полезный сервис для работы с REST APSI. когда вы используете его, вы не пишете свои методы CRUD (создавать, читать, обновлять и удалять)

Насколько я понимаю, ресурсная служба - это просто ярлык, с http-сервисом можно делать все что угодно.


Я не уверен, что классифицировал бы $ resource как ярлык. Это оболочка для $ http, поэтому использование $ http напрямую будет «короче». Это способ настроить $ http так, чтобы у вас было потенциально меньше кода при использовании $ http. В одном случае $http.get('/path/to/thing', params)против myResource.get(params)плюса на самом деле делают настройку для myResource. Больше кода заранее и только действительно работает плавно с тем же существительным API. В противном случае вы кодируете столько же, сколько используете $ http.
coblr

2

Одна вещь, которую я заметил при использовании $ resource over $ http, - это если вы используете Web API в .net

$ resource связан с одним контроллером, который выполняет одну цель.

$ resource ('/ user /: userId', {userId: '@ id'});

[HttpGet]
public bool Get(int id)
{
    return "value"
}

public void Post([FromBody]string value)
{
}

public void Put(int id, [FromBody]string value)
{
}

public void Delete(int id)
{
}

Хотя $ http может быть чем угодно. просто укажите URL.

$ http.get - "api / authenticate"

[HttpGet]
public bool Authenticate(string email, string password)
{
    return _authenticationService.LogIn(email, password, false);
}

это только мое мнение.


0

Служба $ resource в настоящее время не поддерживает обещания и поэтому имеет совершенно другой интерфейс со службой $ http.


1
Служба $ resource поддерживает обещания, но не возвращает $ обещание напрямую, как $ http. Вы должны сделать это, как и var myResource = $resource(...config...);где-то еще в службе, которую вы делаете, return myResource.get(..params...)или вы можете сделатьvar save = myResource.save(); save.$promise.then(...fn...); return save;
coblr
Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.