使用GraphQL进行文件上传

使用GraphQL进行文件上传

使用GraphQL(Apollo Server)在服务器上上传文件。
服务器端使用node.js。
客户端使用Altair GraphQL Client。

样本源代码如下。

    ymatzki/graphql-server-example: Learn GraphQL.

准备之前

根据Apollo Server – Apollo GraphQL Docs开始使用Apollo Server。

$ mkdir graphql-server-example ;\
  cd graphql-server-example
$ npm init --yes
$ npm install apollo-server graphql

服务器 (Sā fú wù qì)

文件上传-几乎直接使用Apollo Server- Apollo GraphQL Docs。
稍作修改,更改为在上传成功时显示一条消息。

const { ApolloServer, gql } = require('apollo-server');

const typeDefs = gql`
  type File {
    filename: String!
    mimetype: String!
    encoding: String!
  }

  type Query {
    uploads: [File]
  }

  type Mutation {
    singleUpload(file: Upload!): File!
  }
`;

const resolvers = {
  Query: {
    uploads: (parent, args) => {},
  },
  Mutation: {
    singleUpload: (parent, args) => {
      return args.file.then(file => {
        console.log(`? File get ${file.filename}`);
        return file;
      });
    },
  },
};

const server = new ApolloServer({
  typeDefs,
  resolvers,
});

server.listen().then(({ url }) => {
  console.log(`? Server ready at ${url}`);
});

启动服务器。

$ node file-uploads/index.js
? Server ready at http://localhost:4000/

客户

准备上传文件。

echo "FOO" > file-uploads/foo.txt

使用Altair GraphQL Client上传文件。

altair.gif

请在对应位置输入以下内容,并点击发送请求。

    URL
http://localhost:4000
    graphQL query
mutation($file: Upload!){
  singleUpload(file: $file){
    filename
    mimetype
    encoding
  }
}
    Choose file
foo.txt
    File name
file

如果成功的话,以下的日志将会被输出到服务器上。

? File get foo.txt
广告
将在 10 秒后关闭
bannerAds