Ember.js 入门指南——自定义适配器

在Ember应用中适配器决定了数据保存到后台的方式,比如URL格式和请求头部。Ember Data默认的适配器是内置的REST API回调。

实际使用中经常会扩展默认的适配器。Ember的立场是应该通过扩展适配器来添加不同的功能,而非添加标识。这样可以使得代码更加容易测试、更加容易理解,同时也降低了可能需要扩展的适配器的代码。

如果你的后端使用的是Ember约定的规则那么可用使用适配器adapters/application.js。适配器application优先级比默认的适配器高,但是比指定的模型适配器优先级低。模型适配器定义规则是:adapter-modelName.js。比如下面的代码定义了一个模型适配器adapter-post。

//  app/adapters/adapter-post.js
 
import Ember from ‘ember‘;
export default DS.JSONAPIAdapter.extend({
       namespace: ‘api/v1‘
});

此时适配器的优先级次序为:JSONAPIAdapter > application > 默认内置适配器;

Ember内置的是配有如下几种:

  1. DS.Adapter 这个适配器是最基础的适配器,它不包含任何功能。如果需要创建一个与Ember适配器有根本性区别的适配器可以使从这个适配器入手。
  2. DS.JSONAPIAdapter 这个适配器是默认适配器,并且是遵循JSON API规范,用于与HTTP服务器之间通过XHR交互JSON数据。
  3. DS.RESTAdapter 这个适配器与第二个适配器功能一样,并且在Ember Data2.0之前是作为默认的适配器。

1,自定义JSONAPIAdapter适配器

JSONAPIAdapter适配器通常用于扩展非标准的后台接口。

1,URL规范

JSONAPIAdapter适配器非常智能,它能够自动确定URL链接是那个模型。比如,如果你需要通过id获取post:

this.store.find(‘post’, 1).then(function(post) {
    //  处理post
});

JSONAPIAdapter会自动发送get请求到/post/1。

下表是Action、请求、URL三者的映射关系。


Action


HTTP


URL


find


get


/posts/1


find   all


get


/posts


update


patch


/posts/1


create


post


/posts


delete


delete


/posts/1

比如在action中执行find()方法,会发送get请求,JSONAPIAdapter会自动解析成形如/posts/1的URL。

2,多元化定制

为了适配复数名字的model名称,可以是哟高Ember Inflector绑定别名。

let inflector = Ember.Inflector.inflector;
inflector.irregular(‘formula’, ‘formulae’);
inflector.uncountable(‘advice’);

这样绑定之后目的是告诉JSONAPIAdapter。你可以使用/formulae/1代替/formulas/1。但是目前我还没搞清楚这个设置是什么意思?又有什么用?如果读者知道请指教。

3,断点路径定制

使用属性namespace可以设置URL的前缀。

app/adapters/application.js
import Ember from ‘ember‘;
export default DS.JSONAPIAdapter.extend({
  namespace: ‘api/1’
});

请求person会自动转发到/api/1/people/1。

4,自定义主机

默认情况下适配器会转到当前域名下。如果你想让URL转到新的域名可以使用属性host设置。

app/adapters/application.js
import Ember from ‘ember‘;
export default DS.JSONAPIAdapter.extend({
  host: ‘http://api.example.com’
});

请求person会自动转发到http://api.example.com/people/1。

5,自定义路径

默认情况下Ember会尝试去根据复数的model名字、中划线分隔的model名字生成路径。如果需要改变这个默认的规则可以使用属性pathForType设置。

app/adapters/application.js
import Ember from ‘ember’;
export default DS.JSONAPIAdapter.extend({
  pathForType: function(type) {
    return Ember.String.underscore(type);
  }
});

修改默认生成路径规则为下滑线分隔。比如请求person会转向/person/1。请求user-profile会转向/user_profile/1(默认情况转向user-profile/1)。

6,自定义请求头

有些请求需要设置请求头信息,比如提供API的key。可以以键值对的方式设置头部信息,Ember Data会为每个请求都加上这个头信息设置。

app/adapters/application.js
import Ember from ‘ember’;
export default DS.JSONAPIAdapter.extend({
  headers: {
‘API_KEY’: ‘secret key’,
‘ANOTHER_HEADER’: ‘some header value’
  }
});

更强大地方是你可以在header中使用计算属性,动态设置请求头信息。下面的代码是将一个session对象设置到适配器中。

app/adapters/application.js
import Ember from ‘ember’;
export default DS.JSONAPIAdapter.extend({
  session: Ember.inject.service(‘session’);
  headers: Ember.computed(‘session.authToken’, function() {
‘API_KEY’: this.get(‘session.authToken’),
‘ANOTHER_HEADER’: ‘some header value’ 
  });
});

你还可以使用volatile()方法设置计算属性为非缓存属性,这样每次发送请求都会重新计算header里的值。

app/adapters/application.js
import Ember from ‘ember’;
export default DS.JSONAPIAdapter.extend({
  //  ……
  }).volatile();
});

更多有关于适配器的信息浏览下面的网址:

·       Ember Observer

·       GitHub

·       Bower

对于适配器主要掌握JSONAPIAdapter足矣,如果你需要个性化定制URL或者请求的域名可以在适配中配置。不过大部分情况下都是使用默认设置。

时间: 2024-08-08 09:41:31

Ember.js 入门指南——自定义适配器的相关文章

Ember.js 入门指南——自定义包裹组件的HTML标签

按照惯例,先做好准备工作,使用Ember CLI命令生成演示所需的文件: ember g route customizing-component-element ember g component customizing-component-element ember g route home ember g route about 默认情况下,组件会被包裹在div标签内.比如,组件渲染之后得到下面的代码: <div id="ember180">   <h1>M

Ember.js 入门指南——自定义序列号器

在Ember应用中,序列化器会格式化与后台交互的数据,包括发送和接收的数据.默认情况下会使用JSON API序列化数据.如果你的后端使用不同的格式,Ember Data允许你自定义序列化器或者定义一个完全不同的序列化器. Ember Data内置了三个序列化器.JSONAPISerializer是默认的序列化器,用与处理后端的JSON API.JSONSerializer是一个简单的序列化器,用与处理单个JSON对象或者是处理记录数组.RESTSerializer是一个复杂的序列化器,支持侧面加

Ember.js 入门指南——总目录

Ember.js 是什么?我想对于想学习它的人应该知道它是个什么东西,如果你想了解那就赶紧去 Google 或者百度,本系列教程是通过学习官网教程然后摘抄个人觉得比较重要的部分,加上学习实例整合而成,如有疏漏欢迎提出修改意见,一起成长! Ember官网:http://emberjs.com/ 教程官网:http://guides.emberjs.com/v2.0.0/ 在此简单介绍下 Ember: Ember是一个雄心勃勃的Web应用程序,消除了样板,并提供了一个标准的应用程序架构的JavaSc

Ember.js 入门指南——包裹内容

准备工作: ember g route wrapping-content-in-component-route        ember g component wrapping-content-in-component 有些情况下,你需要定义一个包裹其他模板提供的数据的组件.比如下面的例子: <!--  app/templates/components/wrapping-content-in-component.hbs  -->   <h1>{{title}}</h1>

Ember.js 入门指南——异步路由

本文将为你介绍路由的高级特性,这些高级特性可以用于处理项目复杂的异步逻辑. 关于单词promises,直译是承诺,但是个人觉得还是使用原文吧.读起来顺畅点. 1,promises(承诺) Ember的路由处理异步逻辑的方式是使用promises.简而言之,promises就是一个表示最终结果的对象.这个对象可能是fulfill(成功获取最终结果)也可能是reject(获取结果失败).为了获取这个最终值,或者是处理promises失败的情况都可以使用then方法,这个方法接受两个可选的回调方法,一

Ember.js 入门指南——model简介2

本文接上一篇<Ember.js 入门指南--model简介1>. 2,核心概念 声明:下面简介内摘抄至http://www.emberjs.cn/guides/models/#toc_. 1,store store是应用存放记录的中心仓库.你可以认为store是应用的所有数据的缓存.应用的控制器和路由都可以访问这个共享的store:当它们需要显示或者修改一个记录时,首先就需要访问store. DS.Store的实例会被自动创建,并且该实例被应用中所有的对象所共享. store可以看做是一个缓存

Ember.js 入门指南--目录

本系列文章全部从(http://ibeginner.sinaapp.com/)迁移过来,欢迎访问原网站. Ember.js 是什么?我想对于想学习它的人应该知道它是个什么东西,如果你想了解那就赶紧去 Google 或者百度,本系列教程是通过学习官网教程然后摘抄个人觉得比较重要的部分,加上学习实例整合而成,如有疏漏欢迎提出修改意见,一起成长! Ember官网:http://emberjs.com/ 教程官网:http://guides.emberjs.com/v2.0.0/ 在此简单介绍下 Emb

Ember.js 入门指南——路由定义

当你的应用启动的时候,路由器就会匹配当前的URL到你定义的路由上.然后按照定义的路由层次逐个加载数据.设置应用程序状态.渲染路由对应的模板. 1,基本路由 在app/router.js的map方法里定义的路由会映射到当前的URL.当map方法被调用的时候方法体内的route方法就会创建路由. 下面使用Ember CLI命令创建两个路由: ember generate route about ember generate route favorites 命令执行完之后你可在你的项目目录app/ro

Ember.js 入门指南——模板渲染

路由的另一个重要职责是渲染同名字的模板. 比如下面的路由设置,posts路由渲染模板posts.hbs,路由new渲染模板posts/new.hbs. Router.map(function() {      this.route('posts', function() {      this.route('new');   }); }); 每一个模板都会渲染到父模板的{{outlet}}上.比如上面的路由设置模板posts.hbs会渲染到模板application.hbs的{{outlet}}