ember ajax
v4.0.1
用于在 Ember 应用程序中发出 AJAX 请求的服务。
ember-ajax现已弃用。请考虑使用ember-fetch或ember-ajax-fetch作为更直接的替代品。
如果您刚刚开始，那么您已经安装了ember-ajax ！但是，如果您的package.json中缺少它，您可以通过执行以下操作来添加它：
ember install ember-ajax要使用 ajax 服务，请将ajax服务注入到您的路由或组件中。
import Ember from 'ember' ;
export default Ember . Route . extend ( {
ajax : Ember . inject . service ( ) ,
model ( ) {
return this . get ( 'ajax' ) . request ( '/posts' ) ;
}
} ) ; AJAX 服务提供了用于发出 AJAX 请求的方法，类似于使用jQuery.ajax的方式。事实上， ember-ajax是 jQuery 方法的包装器，并且可以以大致相同的方式进行配置。
一般来说，您将使用request(url, options)方法，其中url是请求的目的地， options是jQuery.ajax的配置哈希。
import Ember from 'ember' ;
export default Ember . Controller . extend ( {
ajax : Ember . inject . service ( ) ,
actions : {
sendRequest ( ) {
return this . get ( 'ajax' ) . request ( '/posts' , {
method : 'POST' ,
data : {
foo : 'bar'
}
} ) ;
}
}
} ) ;在此示例中， this.get('ajax').request()将返回带有请求结果的 Promise。 .then或.catch中的处理程序代码将自动包装在 Ember 运行循环中，以实现与 Ember 的最大兼容性，开箱即用。
您可以在调用request(url, options)时跳过在options对象中设置method或type键，而是调用post(url, options) 、 put(url, options) 、 patch(url, options)或del(url, options) 。
post ( '/posts' , { data : { title : 'Ember' } } ) ; // Makes a POST request to /posts
put ( '/posts/1' , { data : { title : 'Ember' } } ) ; // Makes a PUT request to /posts/1
patch ( '/posts/1' , { data : { title : 'Ember' } } ) ; // Makes a PATCH request to /posts/1
del ( '/posts/1' ) ; // Makes a DELETE request to /posts/1ember-ajax允许您指定要与请求一起使用的标头。当您有一个会话服务提供一个身份验证令牌时，这尤其有用，您必须将其包含在请求中以授权您的请求。
要包含与请求一起使用的自定义标头，您可以在Ajax Service上指定headers哈希。
// app/services/ajax.js
import Ember from 'ember' ;
import AjaxService from 'ember-ajax/services/ajax' ;
export default AjaxService . extend ( {
session : Ember . inject . service ( ) ,
headers : Ember . computed ( 'session.authToken' , {
get ( ) {
let headers = { } ;
const authToken = this . get ( 'session.authToken' ) ;
if ( authToken ) {
headers [ 'auth-token' ] = authToken ;
}
return headers ;
}
} )
} ) ;默认情况下，仅当主机匹配或请求是相对路径时才会传递标头。您可以通过通过请求传递主机、设置 ajax 服务的主机或设置trustedHosts数组（可以是字符串或正则表达式数组）来覆盖此行为。
// app/services/ajax.js
import Ember from 'ember' ;
import AjaxService from 'ember-ajax/services/ajax' ;
export default AjaxService . extend ( {
trustedHosts : [ / .example. / , 'foo.bar.com' ]
} ) ;namespace属性可用于为请求添加特定 url 命名空间的前缀。
// app/services/ajax.js
import Ember from 'ember' ;
import AjaxService from 'ember-ajax/services/ajax' ;
export default AjaxService . extend ( {
namespace : '/api/v1'
} ) ; request('/users/me')现在将定位/api/v1/users/me
如果您需要覆盖自定义请求的命名空间，请使用namespace作为请求方法的选项。
// GET /api/legacy/users/me
request ( '/users/me' , { namespace : '/api/legacy' } ) ;ember-ajax允许您指定要与请求一起使用的主机。这特别有用，因此您不必不断地传入主机和路径，使request()更干净一些。
要包含与您的请求一起使用的自定义主机，您可以在Ajax Service上指定host属性。
// app/services/ajax.js
import Ember from 'ember' ;
import AjaxService from 'ember-ajax/services/ajax' ;
export default AjaxService . extend ( {
host : 'http://api.example.com'
} ) ;这允许您只需要像这样调用request() ：
// GET http://api.example.com/users/me
request ( '/users/me' ) ;ember-ajax允许您指定要与请求一起使用的默认 Content-Type 标头。
要包含自定义 Content-Type，您可以在Ajax Service上指定contentType属性。
// app/services/ajax.js
import Ember from 'ember' ;
import AjaxService from 'ember-ajax/services/ajax' ;
export default AjaxService . extend ( {
contentType : 'application/json; charset=utf-8'
} ) ;您还可以使用options参数覆盖每个request Content-Type。
即使发生错误，某些 API 也会以状态代码 200 进行响应，并在负载中提供状态代码。使用该服务，您可以通过覆盖isSuccess方法轻松解释此行为。
// app/services/ajax.js
import AjaxService from 'ember-ajax/services/ajax' ;
export default AjaxService . extend ( {
isSuccess ( status , headers , payload ) {
let isSuccess = this . _super ( ... arguments ) ;
if ( isSuccess && payload . status ) {
// when status === 200 and payload has status property,
// check that payload.status is also considered a success request
return this . _super ( payload . status ) ;
}
return isSuccess ;
}
} ) ;ember-ajax提供内置错误类，您可以使用它们来检查响应返回的错误。这允许您将错误结果的确定限制在服务中，而不是将其散布在代码中。
ember-ajax具有内置错误类型，发生错误时将从服务返回：
BadRequestError (400)UnauthorizedError (401)ForbiddenError (403)NotFoundError (404)InvalidError (422)ServerError (5XX)AbortErrorTimeoutError上述所有错误都是AjaxError的子类型。
ember-ajax附带辅助函数，用于将响应错误与其各自的ember-ajax错误类型进行匹配。上面列出的每个错误都有一个相应的is*函数（例如isBadRequestError ）。
强烈鼓励使用这些函数，以帮助消除对样板错误检测代码的需要。
import Ember from 'ember' ;
import {
isAjaxError ,
isNotFoundError ,
isForbiddenError
} from 'ember-ajax/errors' ;
export default Ember . Route . extend ( {
ajax : Ember . inject . service ( ) ,
model ( ) {
const ajax = this . get ( 'ajax' ) ;
return ajax . request ( '/user/doesnotexist' ) . catch ( function ( error ) {
if ( isNotFoundError ( error ) ) {
// handle 404 errors here
return ;
}
if ( isForbiddenError ( error ) ) {
// handle 403 errors here
return ;
}
if ( isAjaxError ( error ) ) {
// handle all other AjaxErrors here
return ;
}
// other errors are handled elsewhere
throw error ;
} ) ;
}
} ) ;如果您的错误不是标准的，则可以使用该错误类型的辅助函数作为构建自定义检测函数的基础。
如果需要访问失败请求的 json 响应，可以使用raw方法而不是request 。
this . get ( 'ajax' )
. raw ( url , options )
. then ( ( { response } ) => this . handleSuccess ( response ) )
. catch ( ( { response , jqXHR , payload } ) => this . handleError ( response ) ) ;请注意，在此用例中无法访问错误对象。您可以检查jqXHR对象以获取有关失败请求的其他信息。特别是jqXHR.status返回相关的 HTTP 错误代码。
Ember AJAX 提供了一个 mixin，可在 Ember 数据适配器中使用，以避免 Ember Data 提供的网络代码并依赖 Ember AJAX。这是将 Ember AJAX 真正集成到 Ember Data 中的第一步。
要使用 mixin，您可以将 mixin 包含到 Adapter 中，如下所示：
// app/adapters/application.js
import DS from 'ember-data' ;
import AjaxServiceSupport from 'ember-ajax/mixins/ajax-support' ;
export default DS . JSONAPIAdapter . extend ( AjaxServiceSupport ) ;这就是所需的所有配置！如果您想自定义适配器，例如使用替代的 AJAX 服务（例如您自己扩展的服务），则提供了这样做的钩子；查看 mixin 的实现以了解详细信息。
请注意，您不应在应用程序中使用 Ember Data 错误检查代码，而应使用 Ember AJAX 提供的代码。
如果您不使用 Ember Data 并且无权访问服务，您可以像这样导入 ajax 实用程序：
import request from 'ember-ajax/request' ;
export default function someUtility ( url ) {
var options = {
// request options
} ;
return request ( url , options ) . then ( response => {
// `response` is the data from the server
return response ;
} ) ;
}它将具有与ajax服务相同的 API。如果您想要原始 jQuery XHR 对象，那么您可以使用raw方法：
import raw from 'ember-ajax/raw' ;
export default function someOtherUtility ( url ) {
var options = {
// raw options
} ;
return raw ( url , options ) . then ( result => {
// `result` is an object containing `response` and `jqXHR`, among other items
return result ;
} ) ;
} 仅当您希望为ember-ajax做出贡献时，此信息才有意义。
git clone这个存储库npm installember serverember testember test --serverember build有关使用 ember-cli 的更多信息，请访问 http://www.ember-cli.com/。
