聚合物铁-ajax响应代码

beh*_*ani 1 javascript polymer

我正在使用Polymer 1.6和<iron-ajax>我的API调用.我根据iron-ajax-error事件无法区分这两种情况:

  1. 后端基本身份验证失败(浏览器返回403 Forbidden)
  2. 找不到服务(浏览器返回404 Not Found)

在这两种情况下,响应正文都是空的,即使在身份验证问题中,服务器也会使用JSON正文进行响应.

我想阅读响应状态代码,或者能够获得情况1中的响应主体.

ton*_*y19 7

当服务器以错误响应,响应体被认为是null根据规范.但是,<iron-ajax>事件详细信息仍然可以访问状态代码和状态文本.

<iron-ajax>.response 事件

活动的详细信息<iron-ajax>.response<iron-request>.状态代码存储在<iron-request>.status,相应的文本位于<iron-request>.statusText:

_onResponse: function(e) {
  const req = e.detail; // iron-request
  console.log('status', req.status, req.statusText);
}
Run Code Online (Sandbox Code Playgroud)

HTMLImports.whenReady(() => {
  Polymer({
    is: 'x-foo',
    _onResponse: function(e) {
      const req = e.detail;
      console.log('response', req.status, req.statusText);
      this.responseStatus = req.status;
      this.responseStatusText = req.statusText;
    },
    _onError: function(e) {
      const req = e.detail.request;
      const err = e.detail.error;
      console.log('error', err, req.status, req.statusText);
      this.errorStatus = req.status;
      this.errorStatusText = req.statusText;
      this.errorMessage = err;
    }
  });
});
Run Code Online (Sandbox Code Playgroud)
<head>
  <base href="https://polygit.org/polymer+1.11.1/components/">
  <script src="webcomponentsjs/webcomponents-lite.js"></script>
  <link rel="import" href="polymer/polymer.html">
  <link rel="import" href="iron-ajax/iron-ajax.html">
</head>
<body>
  <x-foo></x-foo>

  <dom-module id="x-foo">
    <template>
      <iron-ajax url="//httpbin.org/status/200"
                 auto
                 on-response="_onResponse"
                 on-error="_onError"></iron-ajax>
      <div>'on-response' status: [[responseStatus]] ([[responseStatusText]])</div>
    </template>
  </dom-module>
</body>
Run Code Online (Sandbox Code Playgroud)

<iron-ajax>.error 事件

请注意,<iron-ajax>.error事件的详细信息与详细信息不同<iron-ajax>.response.所述error的事件细节是具有以下形状的物体:

{
  error: String,
  request: iron-request
}
Run Code Online (Sandbox Code Playgroud)

因此,<iron-ajax>.error事件处理程序可以读取状态和状态文本,如下所示:

_onError: function(e) {
  const req = e.detail.request; // iron-request
  console.log('status', req.status, req.statusText);
}
Run Code Online (Sandbox Code Playgroud)

HTMLImports.whenReady(() => {
  Polymer({
    is: 'x-foo',
    _onResponse: function(e) {
      const req = e.detail;
      console.log('response', req.status, req.statusText);
      this.responseStatus = req.status;
      this.responseStatusText = req.statusText;
    },
    _onError: function(e) {
      const req = e.detail.request;
      const err = e.detail.error;
      console.log('error', err, req.status, req.statusText);
      this.errorStatus = req.status;
      this.errorStatusText = req.statusText;
      this.errorMessage = err;
    }
  });
});
Run Code Online (Sandbox Code Playgroud)
<head>
  <base href="https://polygit.org/polymer+1.11.1/components/">
  <script src="webcomponentsjs/webcomponents-lite.js"></script>
  <link rel="import" href="polymer/polymer.html">
  <link rel="import" href="iron-ajax/iron-ajax.html">
</head>
<body>
  <x-foo></x-foo>

  <dom-module id="x-foo">
    <template>
      <iron-ajax url="//httpbin.org/status/404"
                 auto
                 on-response="_onResponse"
                 on-error="_onError"></iron-ajax>
      <div>'on-error' status: [[errorStatus]] ([[errorStatusText]]) - [[errorMessage]]</div>
    </template>
  </dom-module>
</body>
Run Code Online (Sandbox Code Playgroud)

codepen