从 jsonapi 加载模型时，ember 中止转换到路由答案

【问题标题】：ember aborts transition to route when loading model from jsonapi从 jsonapi 加载模型时，ember 中止转换到路由
【发布时间】：2018-06-15 06:50:56
【问题描述】：

我有一个非常基本的 ember 应用程序。它定义了一个名为“clock”的路由和一个名为“timezone”的模型。

模型/timezone.js：

import DS from 'ember-data';

export default DS.Model.extend({
  title: DS.attr(),
  technicalName: DS.attr(),
  utcOffset: DS.attr()
});

路由/clock.js：

import Route from '@ember/routing/route';

export default Route.extend({
  model() {
    return this.get('store').findAll('timezone');
  }
});

数据是从一个根据json api规范返回数据的rest api加载的。我正在使用应用程序适配器：

适配器/application.js：

import DS from 'ember-data';

export default DS.JSONAPIAdapter.extend({
  host: 'http://localhost:3000'
});

调用http://localhost:3000/timezones时api返回如下数据：

{"data":
 [
  {
   "type":"timezones",
   "id":"1",
   "attributes": {
    "title":"Local Time",
    "technical-name":"alfa",
    "utc-offset":1
    }
   }
]}

然而 ember 拒绝渲染时钟路由：

Attempting URL transition to /clock
Transition #0: application: calling beforeModel 
Transition #0: application: calling deserialize hook
Transition #0: application: calling afterModel hook
Transition #0: clock: calling beforeModel hook
Transition #0: clock: calling deserialize hook
Transition #0: clock: transition was aborted

我在这里错过了什么？

【问题讨论】：

标签： javascript ember.js json-api

【解决方案1】：

我终于找到了问题所在。这是一个跨域问题。我通过添加解决了它

'connect-src': "'self' http://localhost:3000"

ember 环境配置 (config/environment.js) 并在我的快速应用程序的响应中添加 Access-Control 标头：

app.use(function(req, res, next) {
    res.setHeader('Access-Control-Allow-Origin', 'http://localhost:4200');
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    res.header('Access-Control-Allow-Methods', 'POST, GET, PUT, DELETE, OPTIONS');
    next();
});

【讨论】：