javascript - Backbone 获取 : Headers are not set while performing backbone fetch with custom header data

Question

我正在开发一个主干应用程序，其中涉及从外部 API 获取数据。我的应用程序的域是product.site1.com，而API的域是api.site1.com。

这就是我的模型和收藏的样子

var pModel = new Backbone.Model.extend({});
var pCollection = new Backbone.Collection.extend({
                      model: pModel,
                      url: 'api.site1.com/product'
});

View 如下所示

var pView = new Backbone.View.extend({
         initialize: function() {
                var _this = this;
                var pCollectionVar = new pCollection();
                pCollectionVar.fetch({
                           dataType: 'jsonp',
                           beforeSend: _this.sendAuthentication,
                           success: function(collection, response, options) {
                                   console.log(collection);
                           },
                           error: function(collection, xhr, options) {
                                   console.log("error");
                           }
                     });
                } 
         sendAuthentication: function(xhr) {
            xhr.setRequestHeader('customKey1', 'ABCD');
            xhr.setRequestHeader('customKey2', '1234');
        }
});

当我执行此操作时，我的应用程序向 API 服务器发出 get 请求，而我没有在服务器端获取 header 数据。我在 Chrome 开发工具中也没有看到为请求设置的这些自定义 header 。

编辑:选项 http://api.site1.com/product 405(不允许的方法)jquery-1.10.2.js:8706

选项http://api.site1.com/product无效的 HTTP 状态代码 405 jquery-1.10.2.js:8706

XMLHttpRequest 无法加载 http://api.site1.com/product 。无效的 HTTP 状态代码 405(索引):1

这些是我在执行请求时遇到的错误。

Answer 1

如果你想像你一样使用sendAuthentication，它应该是一个全局函数:

pCollectionVar.fetch({
  dataType: 'jsonp',
  beforeSend: sendAuthentication,
  success: function(collection, response, options) {
    console.log(collection);
  },
  error: function(collection, xhr, options) {
    console.log("error");
  }
});

function sendAuthentication(xhr){
   //Code goes here
}

虽然这会污染全局范围，但我会使用命名空间:

var MyApplication = {};
MyApplication.sendAuthentication = function(xhr){ //code inside}.


pCollectionVar.fetch({
  dataType: 'jsonp',
  beforeSend: MyApplciation.sendAuthentication,
  success: function(collection, resp){//rest...}

编辑:

如上所述here , jsonp 不是 ajax 调用，不能被视为 ajax 调用