0

伙计们！使用 ember-data 存储从远程服务器获取的跨域 ajax 请求的数据的任何示例？现在我有了这个，但是...

TravelClient.Tour = Ember.Object.extend({
});

TravelClient.Tour.reopenClass({
  allTours: [],
  find: function(){
    $.ajax({
      url: 'http://someIP:somePORT/tours.json',
      dataType: 'jsonp',
      context: this,
      success: function(data){
        data.forEach(function(tour){
          this.allTours.addObject(TravelClient.Tour.create(tour))
        }, this)
      }
    })
    return this.allTours;
  }
});

更新： 现在我这样做：

TravelClient.Tour.reopenClass({
  allTours: [],
  find: function(){
    $.ajax({
      url: 'http://someIP:somePORT/tours.json',
      dataType: 'jsonp',
      context: this,
      success: function(response){
        response.data.forEach(function(tour){
          this.allTours.addObject(TravelClient.Tour.create(tour))
        }, this)
      }
    })
    return this.allTours;
  }
});

但是得到这个错误：

Uncaught TypeError: Cannot call method 'forEach' of undefined

快照：

有了这个：

$.ajax({
  dataType: 'jsonp',
  url:"http://192.168.1.39:3000/tours.json",
  success:function(response){
    return response.data;
  }
});

我明白了：

Object
abort: function (e){var t=e||S;return r&&r.abort(t),N(0,t),this}
always: function (){return i.done(arguments).fail(arguments),this}
complete: function (){if(a){var t=a.length;(function r(t){y.each(t,function(t,n){var i=y.type(n);i==="function"?(!e.unique||!c.has(n))&&a.push(n):n&&n.length&&i!=="string"&&r(n)})})(arguments),i?o=a.length:n&&(s=t,l(n))}return this}
done: function (){if(a){var t=a.length;(function r(t){y.each(t,function(t,n){var i=y.type(n);i==="function"?(!e.unique||!c.has(n))&&a.push(n):n&&n.length&&i!=="string"&&r(n)})})(arguments),i?o=a.length:n&&(s=t,l(n))}return this}
error: function (){if(a){var t=a.length;(function r(t){y.each(t,function(t,n){var i=y.type(n);i==="function"?(!e.unique||!c.has(n))&&a.push(n):n&&n.length&&i!=="string"&&r(n)})})(arguments),i?o=a.length:n&&(s=t,l(n))}return this}
fail: function (){if(a){var t=a.length;(function r(t){y.each(t,function(t,n){var i=y.type(n);i==="function"?(!e.unique||!c.has(n))&&a.push(n):n&&n.length&&i!=="string"&&r(n)})})(arguments),i?o=a.length:n&&(s=t,l(n))}return this}
getAllResponseHeaders: function (){return E===2?s:null}
getResponseHeader: function (e){var t;if(E===2){if(!o){o={};while(t=wn.exec(s))o[t[1].toLowerCase()]=t[2]}t=o[e.toLowerCase()]}return t==null?null:t}
overrideMimeType: function (e){return E||(c.mimeType=e),this}
pipe: function (){var e=arguments;return y.Deferred(function(n){y.each(t,function(t,s){var o=s[0],u=y.isFunction(e[t])&&e[t];i[s[1]](function(){var e=u&&u.apply(this,arguments);e&&y.isFunction(e.promise)?e.promise().done(n.resolve).fail(n.reject).progress(n.notify):n[o+"With"](this===r?n.promise():this,u?[e]:arguments)})}),e=null}).promise()}
progress: function (){if(a){var t=a.length;(function r(t){y.each(t,function(t,n){var i=y.type(n);i==="function"?(!e.unique||!c.has(n))&&a.push(n):n&&n.length&&i!=="string"&&r(n)})})(arguments),i?o=a.length:n&&(s=t,l(n))}return this}
promise: function (e){return e!=null?y.extend(e,r):r}
readyState: 4
setRequestHeader: function (e,t){var n=e.toLowerCase();return E||(e=b[n]=b[n]||e,g[e]=t),this}
state: function (){return n}
status: 200
statusCode: function (e){var t;if(e)if(E<2)for(t in e)m[t]=[m[t],e[t]];else x.always(e[x.status]);return this}
statusText: "success"
success: function (){if(a){var t=a.length;(function r(t){y.each(t,function(t,n){var i=y.type(n);i==="function"?(!e.unique||!c.has(n))&&a.push(n):n&&n.length&&i!=="string"&&r(n)})})(arguments),i?o=a.length:n&&(s=t,l(n))}return this}
then: function (){var e=arguments;return y.Deferred(function(n){y.each(t,function(t,s){var o=s[0],u=y.isFunction(e[t])&&e[t];i[s[1]](function(){var e=u&&u.apply(this,arguments);e&&y.isFunction(e.promise)?e.promise().done(n.resolve).fail(n.reject).progress(n.notify):n[o+"With"](this===r?n.promise():this,u?[e]:arguments)})}),e=null}).promise()}
__proto__: Object
4

1 回答 1

2

这更多的是关于服务器应该如何向客户端返回数据而不是关于 ember-data，您需要做的是，将对 ajax 调用的响应包装在一个回调中，该回调的值作为参数发送给服务器。一旦你这样做了，对于 ember-data 来说，它就像往常一样，即对它非常透明

这是在 Rails 上使用 ruby​​ 的示例

在客户端

$.ajax({
    dataType: 'jsonp',
    success: function(response) {
       // loop through your objects
       response.accounts.forEach(function(account){
          console.info(account.id)
       })
    }
});

在服务器端，您应该执行类似于

params[:callback] + '("' + response + '");';

例如，产生类似于以下内容的响应：

callbackValue00923411(
    {
        "accounts":
        [
            {
                "id": 123,
                "name": "Personal",
            },
            {
                "id": 234,
                "name": "Corporate",
            }
        ]
    }
);

然后在您的成功功能中，您可以通过这种方式访问​​帐户列表，如上所述

success: function(response) {
   // loop through your objects
   response.accounts.forEach(function(account){
      console.info(account.id)
   })
}

这是一个关于如何使用/处理 jsonp ajax 请求的示例

如果您可以访问服务器，则可以考虑将其配置为使用CORS并避免使用 jsonp

于 2013-02-01T12:54:39.657 回答