Question

TL; DR;

当graphQL服务器不可用时，watchQuery加载标志永远不会更改为false，因此应使用apollo-link-error处理错误。

有什么办法可以通过watchQuery解决此问题？

我已经开发了一个小型Angular GraphQL应用程序。功能之一就是触发像这样的简单查询：

  this.apollo
    .watchQuery<any>({
      query: this.BookingByID,
      variables: {
        bookingCode: id
      }
    })
    .valueChanges.subscribe(result => {
      this.booking = result.data.booking;
      this.loading = result.loading;
      this.error = result.errors;
    });

我想在网络或Graphql服务器出现故障时测试应用程序的行为。这些是我尝试过的方案。

没有互联网连接
无法连接GraphQL服务器。

没有Internet连接

没有Internet连接this.error可以正常工作。我能够检测到错误并显示正确的消息。

无法连接GraphQL服务器

当GraphQL服务器不可用时，我遇到了问题。即使出现网络错误，查询加载状态仍为“ true”。（阿波罗错误。代码0。未知错误）。

做完一些研究后，我读到 apollo-link-error模块使您可以更好地处理networkErrors。所以我已经实现了类似的东西。

import { NgModule } from '@angular/core';
import { ApolloModule, APOLLO_OPTIONS } from 'apollo-angular';
import { HttpLinkModule, HttpLink } from 'apollo-angular-link-http';
import { InMemoryCache} from 'apollo-cache-inmemory';
import { onError } from 'apollo-link-error';

const uri = 'http://localhost:4000'; // <-- add the URL of the GraphQL server here

export function createApollo( httpLink: HttpLink ) {
  const http = httpLink.create({uri});
  const error = onError(({networkError}) => {
    console.log(networkError);
  });

  return {
    link: error.concat(http),
    cache: new InMemoryCache(),
    defaultOptions: {
      watchQuery: {
        errorPolicy: 'all'
      }
    }
  };
}

@NgModule({
  exports: [ApolloModule, HttpLinkModule],
  providers: [
    {
      provide: APOLLO_OPTIONS,
      useFactory: createApollo,
      deps: [HttpLink],
    },
  ],
})
export class GraphQLModule {}

实现apollo-link-error后，我可以在浏览器控制台中看到该错误。但是我仍然想知道为什么watchQuery的加载状态指示器不会从loading = true变为loading = false。

template.html

<p *ngIf="loading">Loading...</p>
<p *ngIf="error">{{ error | json }}</p>

如果解决方案是继续使用apollo-link-error方法，那么正确的解决方法是什么？我应该如何通知视图有关错误？参数？路线？有没有最佳做法？我在这里想念东西吗？

预先感谢

吉列尔莫

Apollo GraphQL-watchQuery和networkErrors问题

0 个答案: