Понять вызовы REST Backbone.js

Я пытаюсь понять метод синхронизации Backbone.js и просматривал документацию по http://backbonejs.org/#Sync

В нем говорится

The default sync handler maps CRUD to REST like so:

create → POST   /collection
read → GET   /collection[/id]
update → PUT   /collection/id
delete → DELETE   /collection/id

Теперь, когда я всегда был в интерфейсной разработке и новичок в Backbone, я считаю, что это трудно понять... Я никогда не использовал REST или любые другие серверные протоколы...

Не могли бы вы объяснить то же самое простыми словами (например, как карты REST при использовании Backbone.sync) Любой очень простой пример был бы очень полезен...

Ответ 1

Если вы не возражаете, я начну с расчистки некоторых формулировок. REST не является протоколом сам по себе, это просто способ использования протокола HTTP. Стиль REST особенно полезен для API, поскольку, надеюсь, вы увидите. Когда API соответствует этому стилю, он называется "RESTful". Если API, с которым вы работаете, не RESTful, вам придется внести много изменений в Backbone.sync, чтобы заставить его работать. Надеюсь, это так!:)

Протокол HTTP

Мне нравятся примеры, поэтому вот HTTP-запрос, чтобы получить HTML для этой страницы:

GET /questions/18504235/understand-backbone-js-rest-calls HTTP/1.1
Host: stackoverflow.com

[Необязательно] Если вы когда-либо играли с командной строкой или терминалом, попробуйте запустить команду telnet stackoverflow.com 80 и вставить в нее выше, а затем нажмите "Enter" пару раз. Вуаля! HTML во всем этом слава.

В этом примере...

  • GET - это метод.
  • /questions/18504235/understand-backbone-js-rest-calls - это путь.
  • HTTP/1.1 - это протокол .
  • Host: stackoverflow.com - пример заголовка .

Ваш браузер делает примерно то же самое, просто с большим количеством заголовков, чтобы получить HTML для этой страницы. Круто, да?

Поскольку вы работаете в интерфейсе, вы, вероятно, много раз видели тег формы. Вот пример одного из них:

<form action="/login" method="post">
    <input type="text" name="username" />
    <input type="password" name="password" />
    <input type="submit" name="submit" value="Log In" />
</form>

Когда вы отправляете эту форму вместе с соответствующими данными, ваш браузер отправляет запрос, который выглядит примерно так:

POST /login HTTP/1.1
Host: stackoverflow.com

username=testndtv&password=zachrabbitisawesome123&submit=Log%20In

Существуют три различия между предыдущим и предыдущим.

  • Теперь POST.
  • путь теперь /login.
  • Существует дополнительная строка, называемая телом.

В то время как существует множество других методов, те, которые используются в приложениях RESTful, это POST, GET, PUT и DELETE. Это сообщает серверу, какой тип действия он должен принимать с данными, без необходимости иметь разные пути для всего.

Назад на магистраль

Итак, надеюсь, теперь вы поймете немного больше о том, как работает HTTP. Но как это относится к Backbone? Давайте узнаем!

Вот небольшой фрагмент кода, который вы можете найти в приложении Backbone.

var BookModel = Backbone.Model.extend({
    urlRoot: '/books'
});
var BookCollection = Backbone.Collection.extend({
    model: BookModel
    , url: '/books'
});

Создать (POST)

Поскольку мы используем API RESTful, вся информация, на которую должна быть связана Базовая система, должна создавать, читать, обновлять и удалять всю нашу информацию о книге! Давайте начнем с создания новой книги. Следующий код должен быть достаточным:

var brandNewBook = new BookModel({ title: '1984', author: 'George Orwel' });
brandNewBook.save();

Магистраль понимает, что вы пытаетесь создать создать новую книгу и знаете из информации, которую она предоставила, чтобы сделать следующий запрос:

POST /books HTTP/1.1
Host: example.com

{"title":"1984","author":"George Orwel"}

Чтение (GET)

Посмотрите, как это было легко? Но мы хотим получить эту информацию в какой-то момент. Скажем, мы побежали new BookCollection().fetch(). Магистраль понимает, что вы пытаетесь прочитать коллекцию книг, и она сделает следующий запрос:

GET /books HTTP/1.1
Host: example.com

BAM. Это просто. Но говорят, что нам нужна информация только для одной книги. Скажем, книга № 42. Скажем, мы побежали new BookModel({ id: 42 }).fetch(). Магистраль видит, что вы пытаетесь прочитать книгу single:

GET /books/42 HTTP/1.1
Host: example.com

Обновление (PUT)

О, черт возьми, я просто понял, что я неправильно назвал г-на Оруэлла. Легко исправить!

brandNewBook.set('author', 'George Orwell');
brandNewBook.save();

Магистраль достаточно умна, чтобы знать, что, несмотря на то, что она называется brandNewBook, она уже сохранена. Поэтому он обновляет книгу:

PUT /books/84 HTTP/1.1
Host: example.com

{"title":"1984","author":"George Orwell"}

Удалить (DELETE)

Наконец, вы понимаете, что правительство отслеживает все ваши шаги, и вам нужно хоронить тот факт, что вы прочитали 1984. Возможно, слишком поздно, но никогда не мешает попробовать. Таким образом, вы запускаете brandNewBook.destroy(), а Backbone становится разумным и понимаете вашу опасность удаляет книгу со следующим запросом:

DELETE /books/84 HTTP/1.1
Host: example.com

И он ушел.

Другие полезные мелочи

Хотя мы много говорили о том, что мы отправляем на сервер, мы должны, вероятно, также посмотреть, что мы получаем. Вернемся к нашей коллекции книг. Если вы помните, мы сделали запрос GET на /books. Теоретически мы должны вернуть что-то вроде этого:

[
    {"id":42,"author":"Douglas Adams","title":"The Hitchhiker Guide to the Galaxy"}
    , {"id":3,"author":"J. R. R. Tolkien","title":"The Lord of the Rings: The Fellowship of the Ring"}
]

Ничего страшного. И даже лучше, Backbone знает, как справиться с этим из коробки. Но что, если мы немного изменим? Вместо id, являющегося полем идентификации, оно было bookId?

[
    {"bookId":42,"author":"Douglas Adams","title":"The Hitchhiker Guide to the Galaxy"}
    , {"bookId":3,"author":"J. R. R. Tolkien","title":"The Lord of the Rings: The Fellowship of the Ring"}
]

Backbone получает, что каждый API немного отличается, и все в порядке. Все, что вам нужно сделать, это сообщить об этом idAttribute, например:

var BookModel = Backbone.Model.extend({
    urlRoot: '/books'
    , idAttribute: 'bookId'
});

Вам нужно только добавить эту информацию в модель, так как коллекция все равно проверяет модель. Таким образом, Backbone понимает ваш API! Даже если я не...

Недостатком этого является то, что вы должны не забывать использовать bookId в некоторых случаях. Например, когда мы ранее использовали new BookModel({ id: 42 }).fetch() для загрузки данных об одной книге, теперь мы должны использовать new BookModel({ bookId: 42 }).fetch().


Надеюсь, вы нашли этот ответ информативным, и не слишком невыносимо скучным. Я понимаю, что для многих HTTP-протокол и архитектура RESTful не самые волнующие темы, поэтому я попытался немного подправить их. Я могу сожалеть, что, когда я прочитаю все это в более позднем пункте, но это 2AM здесь, так что я собираюсь пойти и представить это в любом случае.

Ответ 2

Предполагая, что вы понимаете вызовы ajax (POST, GET и т.д. в '/collection' и т.д.).

Базовая система использует синхронизацию для маршрутизации некоторых методов моделей и коллекций для вызовов REST.

model/collection.fetch() => GET
model.save() => POST (isNew())
model.save() => PUT (!isNew())
model.destroy() => DELETE

collection.create() вызывает model.save() (isNew()) => POST

Если вы передадите url (/collection), который хотите использовать в модели/коллекции, Backbone позаботится о вызовах.