Q: 关于 nuxt3/nuxt3ui/@apollo_client/hasura 的一些问题?

查看 14|回复 0
作者:c3de3f21   
Intro
无场景,就是做做看,试试 API 随便写写,现在有几个问题想请教各位仁兄
Env
  • nuxt3
  • @nuxt/ui
  • @apollo/client
  • docker
  • docker - pgsql
  • docker - hasura

    Code
    Nitro
    现在我通过
    export default defineNitroPlugin((nitroApp) => {
      const link = new HttpLink({
        uri: 'http://localhost:8080/v1/graphql',
        headers: {
          'x-hasura-admin-secret': '123456'
        }
      });
      const apolloClient = new ApolloClient({
        cache: new InMemoryCache(),
        link: link
      });
      nitroApp.hooks.hook('request', (event) => {
        event.context.apollo = apolloClient
      })
    })
    ------------------------Handler---------------------------------
    import { gql } from '@apollo/client/core'
    export default defineEventHandler(async (event) => {
      const client = event.context.apollo
      const query = gql`
        query getUser($limit: Int!) {
          User(limit: $limit) {
            id
            name
          }
          User_aggregate {
            aggregate {
              count
            }
          }
        }
      `
      const { limit } = await readBody(event)
      try {
        const { data } = await client.query({ query, variables: { limit: 10 } })
        return data
      } catch (error) {
        console.error('GraphQL query error:', error)
        return { error: 'Failed to fetch data' }
      }
    })
    连接本地的 Hasura 服务,Hasura 是动态管理 GraphQL 的 Schema 的一个服务,这个服务我链接了 PGSQL ,具体的环境如下
    version: '3.6'
    services:
      postgres:
        image: postgres:16.3
        restart: always
        environment:
          POSTGRES_USER: root
          POSTGRES_PASSWORD: root
          POSTGRES_DB: rm00
        ports:
          - "5432:5432"
        volumes:
          - ./postgres:/var/lib/postgresql/data
      hasura:
        restart: always
        image: hasura/graphql-engine:v2.15.2
        ports:
          - "8080:8080"
        depends_on:
          - postgres
        environment:
          HASURA_GRAPHQL_DATABASE_URL: postgres://root:root@postgres:5432/rm00
          HASURA_GRAPHQL_ENABLE_CONSOLE: "true"
          HASURA_GRAPHQL_ENABLE_ALLOWLIST: "true"
          HASURA_GRAPHQL_ADMIN_SECRET: 123456
    Nuxt 的前台
      
        Login
       
          {{ data }}
       
        {{ error }}
      
    整个 demo 跑通了是跑通了,但是总觉得不是一个很好的方式或者说不成熟,现在有几个问题想请教请教大佬们
    Question
  • 关于 GraphQL 用于不用好用与不好用的问题暂且不讨论,这里就是要用
  • 1.我试着使用 @nuxtjs/apollo ,但是 secret 会混入请求头也就是有注入风险,这里不明白这个 @nuxtjs/apollo 项目的用意,或者我应该配合 auth 使用?请问如何配合 auth 服务?
  • 2.由于第一个问题我将查询写到了后台也就是 nitro 的 server 中,这样是否妥善?
  • 3.有没有更好的方式,方案,能让我用 js/ts 走完整个开发流程?
  • 您需要登录后才可以回帖 登录 | 立即注册

    返回顶部