标签: apollo

Apollo客户端突变错误处理

我在服务器上使用GraphQL和猫鼬。

发生验证错误时,GraphQL突变会发送状态码为200的响应。在客户端,响应如下所示:

{
  "data": null,
  "errors": [{
    "message": "error for id...",
    "path": "_id"
  }]
}
Run Code Online (Sandbox Code Playgroud)

我想使用catchapollo-client突变承诺的功能来访问验证错误。就像是:

      this.props.deleteProduct(this.state.selectedProductId).then(response => {
         // handle successful mutation
      }).catch(response => {
         const errors = response.errors; // does not work
         this.setState({ errorMessages: errors.map(error => error.message) });
      });
Run Code Online (Sandbox Code Playgroud)

如何才能做到这一点?

apollo graphql apollo-client

8
推荐指数
2
解决办法
9407
查看次数

Apollo(GraphQL)在查询中获取多个元素

我可以在GraphQL查询中获取多个元素吗?我有很多产品列表数据,我想在我的组件中获取三个产品.我有一系列需要的产品ID,我可以将其传递给查询吗?这是我对一个产品的查询:

query ProductInCartQuery($id: ID!){
  Product(id: $id) { 
   id
   name
   price
 }
}
Run Code Online (Sandbox Code Playgroud)

但我不认为我可以把它放在一个函数中,例如对三个产品执行三次.

apollo reactjs graphql

8
推荐指数
1
解决办法
1007
查看次数

apollo-link-state cache.writedata导致缺少字段警告

当我在客户端上调用变异时,我收到以下警告:

writeToStore.js:111 {}中缺少字段updateLocale

这是我的stateLink:

const stateLink = withClientState({
  cache,
  resolvers: {
    Mutation: {
      updateLocale: (root, { locale }, context) => {
        context.cache.writeData({
          data: {
            language: {
              __typename: 'Language',
              locale,
            },
          },
        });
      },
    },
  },
  defaults: {
    language: {
      __typename: 'Language',
      locale: 'nl',
    },
  },
});
Run Code Online (Sandbox Code Playgroud)

这是我的组成部分:

export default graphql(gql`
  mutation updateLocale($locale: String) {
    updateLocale(locale: $locale) @client
  }
`, {
    props: ({ mutate }) => ({
      updateLocale: locale => mutate({
        variables: { locale },
      }),
    }),
  })(LanguagePicker);
Run Code Online (Sandbox Code Playgroud)

我错过了什么?

apollo react-apollo

8
推荐指数
1
解决办法
3820
查看次数

GraphQL如何避免输入和输出类型之间的重复代码

我是GraphQL的新手,但我真的很喜欢它.现在,我正在玩接口和工会,我面临着突变的问题.

假设我有这个架构:

interface FoodType {
    id: String
    type: String
    composition: [Ingredient]
  }

  type Pizza implements FoodType {
    id: String
    type: String
    pizzaType: String
    toppings: [String]
    size: String
    composition: [Ingredient]
  }

  type Salad implements FoodType {
    id: String
    type: String
    vegetarian: Boolean
    dressing: Boolean
    composition: [Ingredient]
  }

  type BasicFood implements FoodType {
    id: String
    type: String
    composition: [Ingredient]
  }

  type Ingredient {
      name: String
      qty: Float
      units: String
  }
Run Code Online (Sandbox Code Playgroud)

现在,我想创造新的食品,所以我开始做这样的事情:

type Mutation {
    addPizza(input:Pizza):FoodType
    addSalad(input:Salad):FoodType
    addBasic(input:BasicFood):FoodType
}
Run Code Online (Sandbox Code Playgroud)

这不起作用有两个原因:

  1. 如果我想将对象作为参数传递,则该对象必须是"输入"类型.但"披萨","沙拉"和"基本食品"只是"类型".
  2. 输入类型无法实现接口.

所以,我需要修改我之前的架构,如下所示: …

interface apollo graphql

8
推荐指数
1
解决办法
1259
查看次数

使用GraphQL Apollo跟踪在线用户

我需要在GraphQL Apollo Node.js服务器上处理"用户现在在线"和"用户现在离线"的事件.最好的方法是什么?

我的调查:我非常确定我不需要实现任何心跳逻辑,因为订阅正在处理WebSockets.但是我没有在他们的文档中找到任何关于如何处理WebSockets事件的信息,例如"连接"和"断开连接"...实际上我可以从实际订阅的外部处理这些事件:

SubscriptionServer.create({
    execute,
    subscribe,
    schema,
    onConnect = (...args) => {
        console.log('User connected')
    },
    onDisconnect = (...args) => {
        console.log('User disconnected')
    }
}, {
    server: ws,
    path: '/subscriptions'
})
Run Code Online (Sandbox Code Playgroud)

但无法确定通过此套接字连接的用户.

我的实现:现在我让它像那样工作:

  1. 我们为所有调用表达了中间件,它将用户对象从jsonwebtoken推送到req对象.在这里,我可以触发"用户现在在线"的逻辑.

  2. 我已经创建了单独的订阅,客户端在登录时订阅它并在注销时取消订阅.由于没有取消订阅处理程序,我设法确定在没有有效负载的情况下在用户断开连接时调用过滤器函数,所以我采用了这种方法:

    userOnlineSubscription: {
        subscribe: withFilter(
            () => pubSub.asyncIterator('userOnlineSubscription'),
                async (payload, variables) => {
                    if (!payload) {
                        // set user offline
                }
                return false
            }
        )
    }
    
    Run Code Online (Sandbox Code Playgroud)

至于我,上面的解决方案是丑陋的.有人可以推荐更好的方法吗?

websocket node.js apollo graphql apollo-server

8
推荐指数
1
解决办法
872
查看次数

apollo(graphQL)-如何在查询中发送对象数组

我想在graphQL查询中发送对象数组。但是我不知道如何在查询$ gallery中键入指针:其中Type将是一个简单的数据结构,如类或字典。

 apollo_client.mutate({mutation: gql`
          mutation m(
            $title: String!, $gallery:<Type?>){
              mutatePmaGallery(pmaData:
                {title: $title, gallery: $gallery}) {
                  pma{
                    id
                  }
                }
              }`,
            variables: {
              title:      _this.state.title,
              gallery:    {<Type?>}
            })
Run Code Online (Sandbox Code Playgroud)

apollo graphql

8
推荐指数
1
解决办法
2610
查看次数

角度Apollo错误处理

大家好,我对apollo-angular和apollo-link-error的问题有点困惑.我尝试了几种不同的方法,我似乎无法在我的角度网络应用程序中捕获客户端的任何错误.我在下面发布了我的尝试.任何建议或一组额外的眼睛将非常感激.

基本上我所要做的就是当发生错误时提示我的用户有关问题.如果有人有一些替代npm包而不是apollo-link-error我都是耳朵.

尝试1:

export class AppModule {
  constructor (apollo: Apollo, httpLink: HttpLink) {
    apollo.create({
      link: httpLink.create({
        uri: 'http://localhost:8080/graphql'
      }),
      cache: new InMemoryCache()
    });

    const error = onError(({ networkError }) => {
      const networkErrorRef:HttpErrorResponse = networkError as HttpErrorResponse;
      if (networkErrorRef && networkErrorRef.status === 401) {
        console.log('Prompt User', error);
      }
    });
  }
}
Run Code Online (Sandbox Code Playgroud)

尝试2:

export class AppModule {
  constructor (apollo: Apollo, httpLink: HttpLink) {
    apollo.create({
      link: httpLink.create({
        uri: 'http://localhost:8080/graphql'
      }),
      cache: new InMemoryCache()
    });

    const error = onError(({networkError}) => {
      if (networkError.status …
Run Code Online (Sandbox Code Playgroud)

typescript apollo apollo-client angular

8
推荐指数
2
解决办法
2883
查看次数

如何在apollo-upload-client中使用apollo-link-http?

我试图找出如何使用apollo-link-httpapollo-upload-client.

两者都创建一个终止链接,但我怎么能一起使用这两个?在我的index.js中我喜欢这个,但它不会工作因为两个链接都终止=>

const uploadLink = createUploadLink({ uri: process.env.REACT_APP_GRAPHQL_URL });

const httpLink = new HttpLink({ uri: process.env.REACT_APP_GRAPHQL_URL });

const client = new ApolloClient({
    link: ApolloLink.from([ authLink, logoutLink, stateLink, uploadLink, httpLink ]),
    cache,
});
Run Code Online (Sandbox Code Playgroud)

有帮助吗?我对Apollo/Graphql没什么经验,但我想使用文件上传组件.

javascript file-upload apollo reactjs graphql

8
推荐指数
1
解决办法
2215
查看次数

React Native Android:Fetch Requests仅在连接React Native Debugger时有效

我在Android上对我的API进行获取请求时遇到了一个奇怪的问题(使用React Apollo).在dev构建以及发布构建中,fetch不起作用.一旦启动React Native Debugger并启用Enable Network Inspect,请求就会起作用.

我不知道如何调试请求,因为未启用Network Inspect时调试器中未显示这些请求.

我有什么想法可以找到错误或者是否有人遇到过同样的问题?

android apollo react-native

8
推荐指数
1
解决办法
512
查看次数

如何使用阿波罗服务器从服务器设置响应头?

我有一个可以在过期时更新用户令牌的应用程序。我需要使用此令牌更新客户端以防止错误。我实际上无法将新令牌放入前端,因为似乎无法在响应中设置任何内容。我可以在后端使用Graphql和护照,如果有帮助的话。

我已经尝试过res.send,res.setheader等...

有谁知道如何从apollo服务器向apollo客户端发送新的标头条目?

node.js apollo reactjs graphql apollo-client

8
推荐指数
1
解决办法
412
查看次数