2014-02-01 2 views
1

Я новичок в Backbone и получил ГЭТ работать с тестом конечной точки, например,Backbone POST JSON

var Attributes = Backbone.Collection.extend({ 
    url: '//127.0.0.1:8080/blah' 
}); 

var AttributeListView = Backbone.View.extend({ 
    el: '.page', 
    render: function() { 
    var that = this; 
    var attributes = new Attributes(); 
    attributes.fetch({ 
     success: function (attributes) { 
     var template = _.template($('#attribute-list-template').html(), {attributes: attributes.models}); 
     that.$el.html(template); 
     } 
    }) 
    } 
}) 

Однако реальная конечная точка требует POST с JSON полезной нагрузки, и я не могу получить синтаксис для работы , Я пробовал что-то вроде этого

var AttributeListView = Backbone.View.extend({ 
    el: '.page', 
    render: function() { 
    var that = this; 
    var attributes = new Attributes(); 
    attributes.fetch({ 
     type: "POST", 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     data: '{ "searchtext": "abc" }', 
     success: function (attributes) { 
     var template = _.template($('#attribute-list-template').html(), {attributes: attributes.models}); 
     that.$el.html(template); 
     } 
    }) 
    } 
}) 

@Rusty, URL-адрес работает нормально с или без http, теперь браузеры обрабатывают его правильно. После копания немного больше, похоже, что это проблема CORS. Я знаю, что конечная точка установить Access-Control-Allow-Origin: *, но только для запроса POST, и я не думаю, что запрос не будет установлен правильно, вот что я получил от Chrome отладки

Request URL:http://127.0.0.1:8080/blah 
Request Headers CAUTION: Provisional headers are shown. 
Accept:application/json, text/javascript, */*; q=0.01 
Cache-Control:max-age=0 
Content-Type:application/x-www-form-urlencoded; charset=UTF-8 
Origin:http://localhost:8000 
Referer:http://localhost:8000/ 
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/32.0.1700.102 Safari/537.36 
Form Dataview sourceview URL encoded 
{ "searchtext": "abc" }: 

С консольный журнал

XMLHttpRequest cannot load http://127.0.0.1:8080/blah. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8000' is therefore not allowed access. 
+0

Хм. Этот URL не выглядит правильным, похоже, что вы используете синтаксис относительного пути для полного пути. Попробуйте изменить 'url' на' http: //127.0.0.1: 8080/blah', иначе просто '/ blah', тот или другой. Но вы сказали, что он работает с запросом GET. Каковы результаты, которые вы получаете? Выполняется ли обратный вызов 'success'? Вы бросили «console.log» или «alert» в обратном вызове успеха, чтобы проверить, или журналы сервера говорят вам, что они не работают? – RustyToms

+0

См. Обновленный вопрос для получения дополнительной информации – Bob

ответ

2

Как вы сказали, это CORS вопрос.

В частности, на POSTPUT и DELETE, что браузер фактически выполняет 2 запроса.

Что происходит под капотом, так это то, что перед реальным запросом браузер отправляет предполетный запрос OPTION, который напоминает запрос на получение разрешения на получение фактического запроса. (пожалуйста проверяет на журнал сервера, какой тип запроса приходит из браузера)

Для разрешения CORS запросить сервер должен корректно обрабатывать этот сценарий и реагировать на OPTION запроса с набором CORS Headers как те:

Access-Control-Allow-Origin: http://some.another.domain 
Access-Control-Allow-Methods: GET, POST, PUT 
Access-Control-Allow-Headers: Content-Type 
Content-Type: text/html; charset=utf-8 

в CORS заголовки (все начинаются с Access-Control-allow- *) сервер определяет следующие разрешения:

  • Какой домен разрешено выполнять запрос, он может быть *, чтобы разрешить любой внешний домен.
  • Какие HTTP-методы принимаются из этих доменов.
  • Какие заголовки заявок принимаются, вы можете добавить все необходимые заголовки. Например, чтобы обрабатывать HTTP-аутентификацию между разными доменами, что является распространенным сценарием с использованием внешнего API, вам нужно добавить заголовок авторизации.

Если сервер правильно ответил на запрос OPTION, браузер выполнит фактический запрос.

Это руководство, чтобы правильно обрабатывать CORS запросов на Rails но он легко распространяется на все стороны сервера языков/рамок: http://leopard.in.ua/2012/07/08/using-cors-with-rails/

0

Rustytoms в своем комментарии является правильным. Вам не нужно устанавливать весь URL-адрес, вы можете просто написать /blah, но я думаю, что проблема, с которой вы сталкиваетесь, отличается.

По умолчанию при вызове fetch на новой модели Backbone генерирует запрос GET для получения информации, следующей за принципами REST. Чтобы проверить, является ли модель новой, Backbone использует метод model.isNew(), который в основном просто проверяет, имеет ли модель идентификатор. Если вы вызываете метод save() на модели, то Backbone будет генерировать запрос POST для «/ users», а если модель не является новой, она будет генерировать запрос SYNC для «/ users /: id».

Эти методы делегируют всю функциональность методу Backbone.sync(). Итак, что вы можете сделать, если API обратной связи не соответствует принципу REST, это заменить метод fetch() в вашей модели вызовом AJAX или создать новый. В разделе «Успех» запроса AJAX вы можете использовать model.set(), чтобы сохранить свои атрибуты в модели.

Предлагаю вам прочитать Backbone documentation, чтобы узнать об этом методах, поскольку все очень ясно.

Смежные вопросы