從零編寫一個Koa + graphQL的案例

在Nest.js的文檔中看到了有集成GraphQL的指導,所以在本地嘗試下先用Koa寫出一個DEMO,之後再去與Nest.js集成起來。

先寫出數據庫模型(這個文件是之前就存在的,沒有做更改,將文件名改成了models.ts):

/**
 * Created by w on 2018/4/13.
 */
const mongoose = require('mongoose');

mongoose.Promise = global.Promise;
mongoose.connect('mongodb://localhost/ticket', {
  server: {
    socketOptions: {
      keepAlive: 1
    }
  }
});

const models = {
  users: {
    username: {
      type: String,
      required: true
    },
    password: {
      type: String,
      required: true
    },
    description: {
      type: String
    },
    createTime: {
      type: Date,
      default: new Date()
    }
  },
  tickets: {
    name: {
      type: String,
      required: true
    },
    price: {
      type: Number,
      requred: true
    },
    holdTime: {   //舉辦時間
      type: Date,
      required: true
    },
    count: {    //剩餘數量
      type: String,
      required: true
    },
    place:{
      type: String,
      required: true
    },
    img: {
      type: String
    },
    description: {
      type: String
    },
    publicTime: {
      type: Date,
      default: new Date()
    },
  }
};

for (let m in models) {
  mongoose.model(m, mongoose.Schema(models[m]));
}

module.exports = {
  getModules: (name) => {
    return mongoose.model(name);
  }
};

之後編寫各自模型的GraphQL查詢文件(user.ts)):

// @ts-ignore
const {
  //@ts-ignore
  graphql, GraphQLSchema, GraphQLObjectType,GraphQLString,GraphQLID,GraphQLList,GraphQLNonNull,GraphQLInt,isOutputType,
} = require('graphql');
// @ts-ignore
const User = require('../db/model').getModules('users');

const userType = new GraphQLObjectType({
  name: 'User',
  fields: {
    username: {
      type: GraphQLString,
    },
    password: {
      type: GraphQLString,
    },
    description: {
      type: GraphQLString,
    },
    createTime: {
      type: GraphQLString,
    }
  }
});

module.exports = {
  query: {
    type: new GraphQLList(userType),
    args: {
      username: {
        username: 'username',
        type: GraphQLNonNull(GraphQLString)
      }
    },
    resolve(root, params, options) {
      if (params.username === '$all') {
        return User.find().exec()
      }
      return User.find({ username: params.username }).exec();
    }
  },
  create: {
    type: new GraphQLList(userType),
    args: {
      username: {
        username: 'username',
        type: GraphQLNonNull(GraphQLString)
      },
      possword: {
        name: 'price',
        type: GraphQLNonNull(GraphQLString)
      },
      createTime: {
        type: GraphQLString,
      },
      description: {
        name: 'description',
        type: GraphQLString
      }
    },
    resolve: async (root, params, options) => {
      let user = new User({
        username: params.username,
        password: params.password,
        description: params.description,
        createTime: params.createTime
      });
      try {
        await user.save();

        return user.find({ username: params.username }).exec()
      }catch(e) {
        console.error("Error while save data: ", e);
      }
    }
  }
}

ticket.ts:

// @ts-ignore
const {
  // @ts-ignore
  graphql, GraphQLSchema, GraphQLObjectType, GraphQLString, GraphQLID, GraphQLList, GraphQLNonNull, GraphQLInt, isOutputType,
} = require('graphql');
// @ts-ignore
const Ticket = require('../db/model').getModules('tickets');

const ticketType = new GraphQLObjectType({
  name: 'Ticket',
  fields: {
    name: {
      type: GraphQLString
    },
    price: {
      type: GraphQLInt
    },
    holdTime: {
      type: GraphQLString
    },
    count: {
      type: GraphQLInt
    },
    place: {
      type: GraphQLString
    },
    img: {
      type: GraphQLString
    },
    description: {
      type: GraphQLString
    },
    publicTime: {
      type: GraphQLString
    }
  }
});

module.exports = {
  query: {
    type: new GraphQLList(ticketType),
    args: {
      name: {
        name: 'name',
        type: GraphQLNonNull(GraphQLString)
      }
    },
    resolve(root, params, options) {
      if (params.name === '$all') {
        return Ticket.find().exec()
      }
      return Ticket.find({ name: params.name }).exec();
    }
  },
  create: {
    type: new GraphQLList(ticketType),
    args: {
      name: {
        name: 'name',
        type: GraphQLNonNull(GraphQLString)
      },
      price: {
        name: 'price',
        type: GraphQLInt
      },
      holdTime: {
        name: 'holdTime',
        type: GraphQLNonNull(GraphQLString)
      },
      count: {
        name: 'count',
        type: GraphQLNonNull(GraphQLInt)
      },
      place: {
        name: 'place',
        type: GraphQLNonNull(GraphQLString)
      },
      img: {
        name: 'img',
        type: GraphQLString
      },
      description: {
        name: 'description',
        type: GraphQLString
      },
      publicTime: {
        name: 'publicTime',
        type: GraphQLString
      }
    },
    resolve: async (root, params, options) => {
      let ticket = new Ticket({
        name: params.name,
        price: params.price,
        holdTime: params.holdTime,
        count: params.count,
        place: params.place,
        img: params.img,
        description: params.description,
        publicTime: params.publicTime
      });
      try {
        await ticket.save();

        return Ticket.find({ name: params.name }).exec()
      }catch(e) {
        console.error("Error while save data: ", e);
      }
    }
  }
}

接下來編寫用於查詢或修改數據的Schema.ts:

const {
  //@ts-ignore
  GraphQLSchema, GraphQLObjectType,
} = require('graphql');
//@ts-ignore
const Ticket = require('./ticket');
//@ts-ignore
const User = require('./user');

module.exports = new GraphQLSchema({
  query: new GraphQLObjectType({
    name: 'Queries',
    fields: {
      Ticket: Ticket.query,
      User: User.query,
    }
  }),
  mutation: new GraphQLObjectType({
    name: 'Mutations',
    fields: {
      Ticket: Ticket.create,
      User: User.create,
    }
  })
})

編寫服務端(server.ts):

const Koa = require('koa');
const app = new Koa();
const koaBody = require('koa-body');
const CombileRouter = require('./combineRouter');

app
  .use(koaBody({
    multipart: true,
    formidable: {
      keepExtensions: true,
    },
  }))
  .use(CombileRouter.routes())
  .use(CombileRouter.routes());

app.listen(5000, () => {
  console.log('App running~');
})

定義ticket路由的ticket.router.ts:

const KoaRouter = require('koa-router');
const ticketRouter = new KoaRouter();
// @ts-ignore
const { graphqlKoa, graphiqlKoa } = require('graphql-server-koa');
// @ts-ignore
const Ticket = require('../db/model').getModules('tickets');
const ticketSchema = require('../graphql/schema');

ticketRouter.get('/ticket/all', async (ctx) => {
  try {
    let result = await Ticket.find({});

    ctx.body = { data: Object.assign({}, result), code: '0' };
  } catch (e) {
    console.error("Getting all ticket error: ", e);
  }
});

ticketRouter.post('/graphql', async (ctx, next) => {
  console.log('graphql', ctx.request.body);
  await graphqlKoa({schema: ticketSchema})(ctx, next)
})
.get('/graphql', async (ctx, next) => {
  await graphqlKoa({schema: ticketSchema})(ctx, next)
})
.get('/graphiql', async (ctx, next) => {
  await graphiqlKoa({endpointURL: '/graphql'})(ctx, next)
})


module.exports = ticketRouter;

還有之前定義的user.router.ts(測試這個user路由是否是reachable的):

const Router = require('koa-router');
const userRouter = new Router();
// @ts-ignore
const { graphiqlKoa } = require('graphql-server-koa');

userRouter.get('/user/all', async (ctx) => {
  ctx.body = {
    code: '0',
    msg: 'OK',
    info: {
      data: [{
        username: 'a',
        id: 0,
        desc: 'ok',
      }, {
        username: 'd',
        id: 1,
        desc: 'ok',
      }, {
        username: 'c',
        id: 2,
        desc: 'ok',
      }, {
        username: 'b',
        id: 3,
        desc: 'ok',
      }]
    }
  }
});

module.exports = userRouter;

將兩個路由文件融合起來(combineRouter.ts):

const UserRouter:object = require('./koa-router/user.router');
const TicketRouter:object = require('./koa-router/ticket.router');

const combiler = (routers: object[]): object => {
  let arr = [];
  
  routers.forEach(v => {
    //@ts-ignore
    arr.push(...v.stack)
  });
  return Object.assign(routers[0], { stack:arr });
}

const res = combiler([UserRouter, TicketRouter]);

module.exports = res;

OK了,這部分就寫好了基礎的query和mutation功能,還有刪除的功能之後再加上。
附上tsconfig.json文件:

{
  "compilerOptions": {
    "module": "commonjs",
    "target": "es6",
    "sourceMap": true,
    "experimentalDecorators": true,
  },
  "exclude": [
    "node_modules"
  ]
}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章