nuxt.js - 如何以与@nuxt/apollo subscribeToMore 一起使用的方式设置我的 nuxt

问题描述

在我们的 nuxt 项目中使用@nuxt/apollo时。出于某种原因，我不断得到

期待一个解析的 GraphQL 文档。也许您需要将查询字符串包装在“gql”标签中？http://docs.apollostack.com/apollo-client/core.html#gql

作为来自 Nuxt 的错误消息。我使用以下语法：

apollo: {
  items: {
    $subscribeToMore: {
        // below is the subscription query.
        document: gql`
         subscription($Group: String!){
           agents(Group: $Group){
             _id
             name
            }
          } 
        `,
        variables () {
          return {
            Group: Object.keys(this.$auth.user.app_access)[0],
          }
        },
        updateQuery: (previousResult, { subscriptionData }) => {
          console.log(subscriptionData);
          return subscriptionData.data; 
        }
      },
   }
},

我的 apollo 配置如下所示：

module.exports = function (ctx) {
  const httpEndpoint = ctx.route.path.includes('/app/cmb') ? process.env.GRAPHQL_HTTP_ENDPOINT : process.env.GRAPHQL_HTTP_ENDPOINT_IAM
  const wsEndpoint = ctx.route.path.includes('/app/cmb') ? process.env.GRAPHQL_WS_ENDPOINT : process.env.GRAPHQL_WS_ENDPOINT_IAM
  return {
    httpEndpoint,
    wsEndpoint,
    tokenName: 'auth._token.keycloak',
    inMemoryCacheOptions: {
      addTypename: false,
    },
    fetchOptions: { mode: 'no-cors' },
    authenticationType: 'Bearer',
    getAuth: (tokenName) => {
      if (process.client) {
        return localStorage.getItem(tokenName)
      } else {
        // get token from cookie in server side request
        return this.__VUE_SSR_CONTEXT__.req.headers.cookie.split('; ').reduce((acc, item) => {
          const split = item.split('=')

          if (split[0] === tokenName) {
            acc = decodeURIComponent(split[1]) // decode cookie value
          }

          return acc
        }, '')
      }
    },
    credentials: 'include'
  }
}

在 nuxt.config 我有以下内容：

apollo: {
    clientConfigs: {
      default: '~/apollo.config.js'
    },
    authenticationType: 'Bearer',
    tokenName: 'auth._token.keycloak'
  },

package.json 中的 nuxt apollo："@nuxtjs/apollo": "^4.0.1-rc.5",

有人可以告诉我如何设置正确的方式来进行多个订阅。只有一个订阅可以正常工作，但是当我想使用 subscribeToMore 添加多个订阅时，事情就会变得混乱。

标签： nuxt.jsapollo-clientvue-apollo

nuxt.js - 如何以与@nuxt/apollo subscribeToMore 一起使用的方式设置我的 nuxt

问题描述

解决方案

推荐阅读