Question

我试图掌握ember和ember数据，但是在正确处理CORS时遇到了问题。

我设法使用静态夹具定义模型等，但现在想要使用一些远程JSON。所以我设置了这样的ember-data：

App = Ember.Application.create();

App.Store = DS.Store.extend({
    revision: 13,
    adapter: DS.RESTAdapter.create({
        url: 'http://clara.eagle/v1/money'
    })
});

这样的模型：

App.Transaction = DS.Model.extend({
    type:       DS.attr('string'),
    occurrence: DS.attr('date'),
    details:    DS.attr('string'),
    amount:     DS.attr('number'),
    currency:   DS.attr('string') 
});

这样的路线：

App.IndexRoute = Ember.Route.extend({
    model: function() {
        return App.Transaction.find();
    }
});

作为后端，我有一个现有的API，它将为有效的GET请求返回JSON，并为OPTIONS请求提供以下CORS标头。

Access-Control-Allow-Origin: http://ember.eagle
Access-Control-Allow-Headers: X-Requested-With, X-AUTHENTICATION, X-IP
Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS

（ember.eagle是ember app域，clara.eagle是api域名。）

当我运行应用程序时，Chrome会告诉我：

XMLHttpRequest cannot load http://clara.eagle/v1/money/transactions. Origin http://ember.eagle is not allowed by Access-Control-Allow-Origin.

所以我查看了网络标签，看看OPTIONS请求给出的结果，除了我找到的结果。虽然这解释了为什么API请求失败但我不知道为什么OPTIONS请求没有被执行，因为它最终使用jQuery发出请求（据我所知）。

因此，我的问题是为什么没有生成此OPTIONS请求？如果它不是设计的，我该怎么做呢？

我已经测试了API生成了OPTIONS请求，并且GET请求也有效，所以我不相信API有问题（screenshot ）。单独使用jQuery（即vanilla jQuery），OPTIONS请求按预期运行。

我是Ember os的新手，可能是我想念的东西，但此刻我无法看到它！

Answer 1

您可以尝试以下两项更改：

App.Store = DS.Store.extend({
  revision: 13,
  adapter: DS.RESTAdapter.create({
    url: 'http://clara.eagle/v1/money',
    corsWithCredentials: true
  })
});

另外将此添加到您的服务器配置Access-Control-Allow-Credentials: true，这与ajax设置的corsWithCredentials选项一起使用：

Access-Control-Allow-Origin: http://ember.eagle
Access-Control-Allow-Headers: X-Requested-With, X-AUTHENTICATION, X-IP
Access-Control-Allow-Credentials: true
Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS

希望它有所帮助。

Answer 2

在客户端：

Ember.$.ajaxSetup({
    beforeSend: function(xhr) {
        xhr.setRequestHeader('X-IP', 'some value');
    }
});

或

Ember.$.ajaxSetup({
    headers: { 'X-IP': 'some value' }
});

在服务器端，响应options方法：

Access-Control-Allow-Origin: http://ember.eagle
Access-Control-Allow-Methods: POST, GET, OPTIONS
Access-Control-Allow-Headers: X-Requested-With, X-Prototype-Version, X-IP
Access-Control-Max-Age: 1728000

使用ember-data缺少选项请求

2 个答案: