Ember.js在海市蜃楼成功后将应用程序连接到真正的api

Question

随着我对Ember.js应用程序构建过程的深入和深入，我撞上了另一面墙。

在我使用mirage获得巨大成功之前 - 我只是将我想要的API的输出复制到海市蜃楼灯具并且效果很好。

现在我有使它与真正的API一起工作的问题。

我在配置第一禁用海市蜃楼/ environment.js

ember g adapter filter

import ApplicationAdapter from './application'; 
export default ApplicationAdapter.extend({ 
    findAll: function(store, type, label) { 
     var url = `${this.host}/${this.namespace}/${type.modelName}`; 
     console.log(`${url}`); 
     return this.ajax(url, 'GET'); 
    }, 
}); 

应用适配器看起来像这样

import DS from 'ember-data'; 

export default DS.JSONAPIAdapter.extend({ 
    host: 'http://127.0.0.1:1234', 
    namespace: 'api', 

    headers: Ember.computed(function(){ 
     return {"secret": "1234"}; 
    }) 
}); 

而且这样当我输入/过滤器 app/routes/filter/index

import Ember from 'ember'; 

export default Ember.Route.extend({ 
     model() { 
        return this.store.findAll('filter'); 

     } 
}); 

我可以看到，网址是建行作为http://127.0.0.1:1234/api/filter并没有404，但我得到的错误

Error while processing route: filter.index The adapter operation was aborted EmberError@http://127.0.0.1:4200/assets/vendor.js:29616:15

和我不完全掌握灰烬督察IM的诀窍努力算出这个莫名其妙

，以前的工作（与幻影）我的滤镜模式是这样的：

import DS from 'ember-data'; 

export default DS.Model.extend({ 
     name: DS.attr(), 
     url: DS.attr() 
}); 

API返回列表[{"id":1, "name": "namex", "url": "http://"},{"id":2, "name": "namey", "url": "http://"}]

我敢肯定，如果它的方式api返回数据，因为它不是“过滤器”，因为我以前有复数的问题。

编辑：这解决问题

import DS from 'ember-data'; 

export default DS.RESTSerializer.extend(
{ 
     normalizeFindAllResponse(store, type, payload) 
     { 
       var data = []; 
       payload.forEach(
        function(item, index, enumerable) 
        { 
         var ob = {}; 
         Ember.set(ob, 'id', item.id); 
         Ember.set(ob, 'type', 'filter'); 
         Ember.set(ob, 'attributes', item); 
         data[index]=ob; 
         console.log(data[index]); 
        } 
       ); 
       return { 
         data: data 
       }; 
     } 
}); 

这几乎是修复，但不完全是。 我可以访问一些像名称这样的模型属性，但是里面有一个有3个数组的数组对象，其中2个是数组中间的一个是Getter（永远是这样），我无法再访问它作为它的数组了。所以即时通讯不知道这是否正确绑定到对象。此外，我无法对“数据”做任何事情，因为无论RESTAdapter在这里或那里我放哪都会忽略它，并要求具有数据/元/错误属性的对象......不知道它是否存在错误。

Answer 1

当您使用JSONAPIAdapter时，您的api响应应遵循JSON格式规范。

{  
    "data": [{ 
    "type": "filter", 
    "id": "1", 
    "attributes": { 
     "name": "namex", 
     "url": "http://"  
    } 
    }, { 
    "type": "filter", 
    "id": "2", 
    "attributes": { 
     "name": "namey", 
     "url": "http://" 
    } 
    }] 
} 

，或者如果你没有在这种情况下，以下两种JSONAPI你可以改变应用程序接口来扩展RESTAdapter。

import DS from 'ember-data'; 

export default DS.RESTAdapter.extend({ 
    host: 'http://127.0.0.1:1234', 
    namespace: 'api', 

    headers: Ember.computed(function(){ 
     return {"secret": "1234"}; 
    }) 
}); 

RESTAdapter反应会是什么样子，

{"filters":[{"id":1, "name": "namex", "url": "http://"},{"id":2, "name": "namey", "url": "http://"}]} 

要么你需要把它像上面的格式或操纵它来生产所需要的格式。（覆盖normalizeFindAllResponse）