创建 Ember 数据适配器以从 Flickr API 中提取答案

【问题标题】：Creating an Ember Data Adapter to Pull from Flickr API创建 Ember 数据适配器以从 Flickr API 中提取
【发布时间】：2017-06-16 00:04:41
【问题描述】：

我正在构建一个需要使用 Flickr API 提取照片信息的 Ember 应用程序。我想要一些关于如何编写适配器以将这些信息拉入我的 Ember 应用程序的建议。我对 Flickr API 的调用返回了一个 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 Data 模型，因为它提供了主键的 id。我花了很多时间查看docs 以找到解决此问题的方法，但我仍然对这些适配器和序列化程序的工作方式感到非常困惑。我需要采取哪些步骤来自定义我的适配器以正确地将这些数据提取到照片模型中？提前谢谢你。

【问题讨论】：

这可能不是解决这种开放式问题的最佳场所 - 您正在寻找的是指南。您是否仔细阅读过文档的这一部分？ guides.emberjs.com/v2.13.0/models您可能还想查看这篇文章。 emberigniter.com/…。如果您只想与专家聊天，ember slack 频道是个不错的地方。

标签： json rest ember.js model adapter

【解决方案1】：

这是一本关于这个主题的好书：Ember Data in the Wild: Getting Ember Data to Work With Your API，作者是 David Tang - 还有一篇很棒的博客文章：来自 Ember Igniter 的 Fit Any Backend Into Ember with Custom Adapters & Serializers。

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"
}

因此，您需要为“照片”创建一个模型 + 一个适配器来获取数据，然后在序列化程序中使用 normalizeResponse() 或一些方法组合来重新格式化数据将其放入数组中。照片的网址在哪里？

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

这是一个粗略的。我只是试着旋转一下，但没有适配器。祝你好运！

【讨论】：

感谢您的帮助！我将研究这些链接。图像的 URL 不直接出现在 JSON 响应中，但是，因为图像 URL 的格式保持一致，我应该能够使用 Handlebars 和图像 ID 相当容易地生成它们。

【解决方案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 分享以上精彩资源。

【讨论】：