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）