创建一个 Ember 数据适配器以从 Flickr API 中提取数据

Question

我正在开发一个 Ember 应用程序，它需要使用 Flickr API 获取照片信息。我想要一些关于如何编写适配器以将此信息提取到我的 Ember 应用程序的建议。我调用 Flickr API returns 一个 JSON 的形式：

{
"photos": {
    "page": 1,
    "pages": 2,
    "perpage": 100,
    "total": "123",
    "photo": [
        {
            "id": "1234567890",
            "owner": "1234567@123",
            "secret": "1234567890",
            "server": "1111",
            "farm": 1,
            "title": "Some Title",
            "ispublic": 1,
            "isfriend": 0,
            "isfamily": 0
        },...
        ]
    },
 "stat": "ok"
}

根据此响应的格式，我确定我不能使用 JSONAPIAdapter，必须使用 RESTAdapter。我真正感兴趣的唯一响应部分是照片阵列。这部分响应似乎也被正确格式化以适合 Ember 数据模型，因为它为主键提供了一个 id。我花了很多时间查看 docs 以找到解决此问题的方法，但我仍然对这些适配器和序列化程序的工作方式感到非常困惑。我需要采取哪些步骤来自定义我的适配器以将这些数据正确地提取到照片模型中？提前谢谢你。

Answer 1

这是一本关于这个主题的好书：Ember Data in the Wild: Getting Ember Data to Work With Your API, by David Tang - and there is also this excellent blog article: Fit Any Backend Into Ember with Custom Adapters & Serializers 来自 Ember Igniter。

https://api.flickr.com/services/rest/?method=flickr.photos.search&api_key={api-key}&tags=flower&per_page=3&format=json

会出现：

{
  photos: {
    page: 1,
    pages: 71281,
    perpage: 3,
    total: "213841",
    photo: [
      {
        id: "35314184896",
        owner: "33472394@N00",
        secret: "e02e15d7c3",
        server: "4198",
        farm: 5,
        title: "Bird's-foot Trefoil",
        ispublic: 1,
        isfriend: 0,
        isfamily: 0
      },
    ]
  },
  stat: "ok"
}

所以你需要为 'photo' 创建一个模型 + 一个适配器来获取数据，然后在序列化器 munge/reformat 中，数据如何 ember-data 想要它使用 normalizeResponse() 或一些方法组合将其放入数组中。照片的 URL 在哪里？

同时查看 David 的这篇文章：Ember Data and Custom APIs - 5 Common Serializer Customizations

这是一个粗略的过程。我只是想弄个小玩意，但没有适配器。祝你好运！

Answer 2

已解决：

使用 normalizeResponse() 将数据序列化为照片模型。照片模型反映了上面发布的示例 JSON 中的照片区域。

import DS from 'ember-data';

    // app/serializers/photo.js
    export default DS.RESTSerializer.extend({
      normalizeResponse(store, primaryModelClass, payload, id, requestType) {
        payload = {
          photo: payload.photos.photo
        };

        return this._super(store, primaryModelClass, payload, id, requestType);
      }
    });

我的适配器定义如下：

import DS from 'ember-data';

// app/adapters/photo.js
export default DS.RESTAdapter.extend({
  host: 'https://api.flickr.com/services/rest/?method=flickr.people.getPublicPhotos&api_key=<YOUR_KEY_HERE>&user_id=<YOUR_USER_ID_HERE>&format=json&nojsoncallback=?',
  namespace: 'api'
});

感谢 sheriffderek 分享以上宝贵资源。

创建一个 Ember 数据适配器以从 Flickr API 中提取数据

Creating an Ember Data Adapter to Pull from Flickr API

rest

json

model

adapter

ember.js