apollo icon indicating copy to clipboard operation
apollo copied to clipboard

Nuxt 3 Composable usage: status code 400

Open hermesalvesbr opened this issue 2 years ago • 6 comments

Environment

Nuxt project info:                                                    15:00:27

------------------------------
- Operating System: `Linux`
- Node Version:     `v18.12.1`
- Nuxt Version:     `3.0.0`
- Nitro Version:    `1.0.0`
- Package Manager:  `[email protected]`
- Builder:          `vite`
- User Config:      `ssr`, `runtimeConfig`, `modules`, `apollo`, `app`
- Runtime Modules:  `@nuxtjs/[email protected]`, `@nuxtjs/[email protected]`, `[email protected]`, `@pinia/[email protected]`
- Build Modules:    `-`
------------------------------

Describe the bug

This request:

async getCompanyProfile() {
        const query = gql`
          query getCompanyProfileByID($id: String!) {
            empresa(filter: { id: { _eq: $id } }) {
              id
              nome
              cnpj
              razao_social
              email
              ie_estadual
              ie_municipal
              telefone
              cep
              bairro
              complemento
              estado
              cidade
              endereco
              numero
              regime_fiscal
            }
          }
        `;
        const variables = { id: "dc604b7" };
        try {
          const { result } = await useQuery(query, variables);
        } catch (e) {
          console.log(e);
        }

Give me this error: {"errors":[{"message":"GraphQL validation error.","extensions":{"code":"GRAPHQL_VALIDATION_EXCEPTION","graphqlErrors":[{"message":"Cannot query field \"empresa\" on type \"Query\".","locations":[{"line":2,"column":3}]}]}}]}

Expected behaviour

Without filter, just using limit: 10, works fine. But a filter with query parameter didn't work. My backend server is directus v9. But with postman, works fine: image

Reproduction

I'm using Directus for GraphQL backend:

https://docs.directus.io/reference/query.html#filter

Additional context

I'm using Apollo Module inside a composable in nuxt.

Logs

No response

hermesalvesbr avatar Jan 09 '23 18:01 hermesalvesbr

Terminal show me this errors:

Error: nuxt instance unavailable   09:08:35
    at Module.useNuxtApp
     at readRawCookies
     at Module.useCookie
      at updateAuth
      at onLogin
      at Proxy

"@nuxtjs/apollo": "5.0.0-alpha.5",

hermesalvesbr avatar Jan 11 '23 12:01 hermesalvesbr

Captura de tela de 2023-01-11 11-57-52 Captura de tela de 2023-01-11 11-56-27 Captura de tela de 2023-01-11 11-56-16

hermesalvesbr avatar Jan 11 '23 15:01 hermesalvesbr

I have the same issue

500
nuxt instance unavailable

at Module.useRequestEvent (./node_modules/nuxt/dist/app/composables/ssr.mjs:14:58)
at readRawCookies (./node_modules/nuxt/dist/app/composables/cookie.mjs:52:62)
at Module.useCookie (./node_modules/nuxt/dist/app/composables/cookie.mjs:23:19)
at getToken (./node_modules/@nuxtjs/apollo/dist/runtime/composables.mjs:45:68)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async setup (./pages/channels.js:42:12)
<script setup>
const { getToken } = useApollo()

const currentUserAuthToken = await getToken()
</script>

masterkain avatar Feb 02 '23 04:02 masterkain

so, is getToken broken with nuxt in ssr mode? anybody got it working?

masterkain avatar Feb 10 '23 15:02 masterkain

I keep having this issue when ssr is enabled.

[Vue warn]: Unhandled error during execution of setup function
  at <Channels onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > >
[nuxt] error caught during app initialization H3Error: nuxt instance unavailable
    at Module.useNuxtApp (/usr/src/app/node_modules/nuxt/dist/app/nuxt.mjs:173:13)
    at Module.useRequestEvent (/usr/src/app/node_modules/nuxt/dist/app/composables/ssr.mjs:14:58)
    at readRawCookies (/usr/src/app/node_modules/nuxt/dist/app/composables/cookie.mjs:52:62)
    at Module.useCookie (/usr/src/app/node_modules/nuxt/dist/app/composables/cookie.mjs:23:19)
    at getToken (/usr/src/app/node_modules/@nuxtjs/apollo/dist/runtime/composables.mjs:45:68)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async setup (/usr/src/app/pages/dashboard/channels.vue:16:124) {
  statusCode: 500,
  fatal: false,
  unhandled: false,
  statusMessage: undefined,
  __nuxt_error: true
}
// dashboard/channels.vue
<script setup lang="ts">
const { getToken } = useApollo()
const currentUserAuthToken = await getToken()
</script>

can someone advise if is there anything that can be done?

I'm not sure if this can be related https://github.com/nuxt/nuxt/issues/13965#issuecomment-1397323668 @danielroe

masterkain avatar Mar 06 '23 00:03 masterkain

I've opened PR #524 that should fix this issue.

aapokiiso avatar Jul 06 '23 14:07 aapokiiso