nodejs 使用调用graphql接口(不是写服务端,而是调用接口)

百度上 都是用 node 做服务端  写graphql接口 供给前端使用  

这里博主考虑 如果 用node框架 做服务端调用服务端的graphql接口  那么如何写呢 

所以 还是会有这种需求的

第一步  下载包   博主第一次的时候 下了很多包 后来发现有个包里面包含了这些常用的  所以 只需要下2个

yarn add apollo-boost graphql -S

然后我把 graphql 的query 和 mutate方法 封装到了 base.js里 方便 其他controller 进行extends

对了 首先 你要先有一个 服务端的graphql 哦   这里 我就不介绍怎么写服务端的 graphql接口了  各种语言 都有

base.js里封装代码

const ApolloBoost = require('apollo-boost');  //引入核心
const fetch = require('node-fetch');    // 引入fetch
const { createHttpLink } = require('apollo-link-http'); // 引入http
const {ApolloClient,InMemoryCache} = ApolloBoost // 引入必须设置的客户端及cache

const client = new ApolloClient({
  link: createHttpLink({
    uri: "http://192.168.50.82:7001/graphql", // 这个url可以抽取到配置文件里
    fetch: fetch, 
  }),
  cache: new InMemoryCache(),
})

调用接口的客户端已经准备好了 下面是封装的方法

// 这个是类似我们熟悉的get请求
gqlQuery(query,variables={}){
   const p = new Promise( (resolve) => {
      client.query({
        query,
        variables
      }).then((res) => {
        resolve(res.data)
      })
   })
   return p
}

// 这个是类似我们熟悉的post请求
gqlMutate(mutation,variables={}){
    const p = new Promise( (resolve) => {
        client.mutate({
            mutation,
            variables
        }).then((res) => {
            resolve(res.data)
        })
    })
    return p
}

基类的方法已经准备好  而且这里 我利用promise形式 方便 外部调用使用async 和await

下面说说如何使用

先准备 我们2个 js文件  里面分别是给query使用的  和  mutate使用的  里面的内容是针对我的graphql后台写的 

第一个test1文件

const gql = require('graphql-tag') // 引入graphql
module.exports = {
  testQuery: gql `query Query{  
    test
  }`,
  testLogin: gql `query login($username:String!,$pwd:String!){
    login(username:$username,pwd:$pwd){
       status
       errorCode
       msg
    }
  }`,
  testLogin_m: gql `query testLogin_m($loginModel: LoginModel!){
    login_m(loginModel:$loginModel){
       status
       errorCode
       msg
    }
  }`,
  getUserInfo: gql `query getUserInfo($userid: ID!){
    getUserInfo(userid:$userid){
       id
       name
       userAvatar
       vip
       showVip
       token
       fans {
        name
       }
    }
  }`,
  getUserShowVip: gql `query ($userid: ID!,$vip:Int){
    getUserShowVip(userid:$userid,vip:$vip){
       id
       name
       userAvatar
       vip
       showVip
       token
       fans {
        name
       }
    }
  }`,
  queryUsers: gql `query queryUsers($vip:Int!){
    queryUsers(vip:$vip){
       name
       fans {
         name
         vip
         token
       }
    }
  }`
}

第二个test2文件

const gql = require('graphql-tag') // 引入graphql
module.exports = {
  testCreateUser: gql`mutation createUser($name:String,$userAvatar:String,$vip:Int){
    createUser(name:$name,userAvatar:$userAvatar,vip:$vip){
      errorCode
      status
      msg
    }
  }`
}

然后 页面调用

// 引入文件
const { testQuery, testLogin, testLogin_m, getUserInfo, getUserShowVip, queryUsers } = require("./gql/test1");
const { testCreateUser } = require("./gql/test2");

// 调用刚才准备的方法

      console.info('*************11111111***************')
      const result1 = await this.gqlQuery(testQuery)
      console.info(result1)
      console.info('*************22222222***************')
      const variables1 = {username: 'gq', pwd: '123'}
      const result2 = await this.gqlQuery(testLogin,variables1)
      console.info(result2)
      console.info('*************33333333***************')
      const variables2 = {
        loginModel: {
          username: 'gq',
          pwd: '123',
          authCode: '321'
        }
      }
      const result3 = await this.gqlQuery(testLogin_m,variables2)
      console.info(result3)
      console.info('*************44444444***************')
      const variables3 = {
        userid: 123
      }
      const result4 = await this.gqlQuery(getUserInfo,variables3)
      console.info(result4)
      console.info('*************555555555***************')
      const variables4 = {
        userid: 123,
        vip:1
      }
      const result5 = await this.gqlQuery(getUserShowVip,variables4)
      console.info(result5)
      console.info('*************666666666***************')
      const variables5 = {
        vip:1
      }
      const result6 = await this.gqlQuery(queryUsers,variables5)
      console.info(result6)
      console.info('*************777777777***************')
      const mutation1 = {
        vip: 1,
        name: 'gq',
        userAvatar: '123321'
      }
      const result7 = await this.gqlMutate(testCreateUser,mutation1)
      console.info(result7)
      console.info('*************88888888***************')

结束  希望可以帮到你哦

发布了100 篇原创文章 · 获赞 75 · 访问量 28万+

猜你喜欢

转载自blog.csdn.net/gaoqiang1112/article/details/103385959