11

乾杯!私は残り火データストアを持っています:

TravelClient.Store = DS.Store.extend({
  revision: 11,
  adapter: DS.RESTAdapter.create({ bulkCommit: false, url: "http://someIP:somePORT"})
});

そしてルーター:

TravelClient.ToursRoute = Ember.Route.extend({
  model: function() {
    return TravelClient.Tour.find();
  }
});

このJSONをリモートサーバーから受け取ります。

{
  "tours": [
    {
      "id": "5110e8b5a8fefe71e0000197",
      "title": "qui deserunt dolores",
      "description": "Id velit nihil.",
      "seats": 12,
      "options": [

      ],
      "images": [
        {
          "id": "5110e8b5a8fefe71e0000196",
          "url": "url"
        }
}

しかし、私がしようとすると、次のreturn TravelClient.Tour.find()ように失敗します。

http://someIP:somePORT/tours 404 (Not Found)

XMLHttpRequest cannot load http://someIP:somePORT/tours. Origin http://localhost:3000 is not allowed by Access-Control-Allow-Origin.

RESTAdapterは、JSONを受信する必要があることを知らないようです。

アップデート:

Railsサーバー側のアプリケーションコントローラー:

def set_access_control_headers
  headers['Access-Control-Allow-Origin'] = '*'
  headers['Access-Control-Request-Method'] = '*'
end

しかし、それはまだです:

OPTIONS http://someIP:somePORT/tours 404 (Not Found)

そして、RESTAdapterはtours.jsonではなくtoursリソースを読み込もうとしているようです。

Request URL:http://someIP:somePORT/tours

実用的なソリューション

RESTAdapterを拡張します。

TravelClient.CUSTOMAdapter = DS.RESTAdapter.extend({
  bulkCommit: false, 
  url: "http://remote_server_address",    
  buildURL: function(record, suffix) {
    var s = this._super(record, suffix);
    return s + ".json";
  }
})

正しいヘッダーでOPTIONSリクエストに応答します

4

3 に答える 3

10

これは問題ではないとRESTAdapter予想されますが、ページと json が同じドメイン上にありません。これはセキュリティ上の問題です。JSONこれは、以下に示す 2 つの解決策のいずれかを使用して解決できます。

またはを使用する必要がある同じオリジン ポリシーに遭遇しています。おそらく最も簡単な解決策は、使用したい ember-data を伝えることです。JSONPCORSJSONP

サーバーは、ヘッダーを使用CORSしてリクエストに応答する必要があります。OPTIONS

  • Access-Control-Allow-Origin
  • Access-Control-Request-Method

私はレールの専門家ではありませんが、おそらく宝石で何かをする必要があるでしょうhereまたはhererack-corsを参照してください。

次のようにajaxフックをオーバーライドすることで、それを行うことができます。RESTAdapter

App.store = DS.Store.create({
    revision: 11,
    adapter: DS.RESTAdapter.create({
        namespace: "data",
        url: "",
        ajax: function (url, type, hash) {
            hash.url = url;
            hash.type = type;
            hash.dataType = 'jsonp';
            hash.contentType = 'application/json; charset=utf-8';
            hash.context = this;

            if (hash.data && type !== 'GET') {
                hash.data = JSON.stringify(hash.data);
            }

            jQuery.ajax(hash);
        },
    })
});
于 2013-02-12T08:47:43.683 に答える
1

JSONP を使用する場合は、メソッドを使用してオーバーライドするよりも、プライベート関数をオーバーライドする方がはるかに簡単ajaxOptionsです。Ember のパイプラインには、jQuery 依存関係の削除が含まれています。そのため、代わりに次のようにします。jQueryajax

adapters/application.js:

import DS from 'ember-data';

export default DS.RESTAdapter.extend({
    ajaxOptions: function(url, type, options) {
        var hash = this._super(url, type, options);
        hash.dataType = "jsonp";
        return hash;
    }
});

Ember コア チームが (プライベート API をハッキングする代わりに) これを公式にサポートするパブリック メソッドを公開できれば、それは作成されます。

https://github.com/emberjs/data/blob/1.0.0-beta.15/packages/ember-data/lib/adapters/rest_adapter.js#L915

于 2015-02-22T21:37:28.900 に答える