Question

我正在尝试使用Angular Apollo作为客户端和Apollo 2.0作为服务器上载文件。

相信我，我尝试了所有教程，可以在互联网上找到但没有帮助的示例。有一个名为apollo-upload-file的库，他们提供了一个示例来实现它，但是在客户端，他们使用了React。尽管我尝试实现他的示例，但没有任何效果。

请帮助。

Answer 1

服务器

在您的模式中，您需要将文件参数定义为类型Upload，这是Apollo提供的内置类型。

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

const TypeDef = gql `
  type Mutation {
    upload(file: Upload!)
  }
`

如果您收到有关类型上传（不是类型）的错误，也可以在您的模式中定义它（我遇到了这个问题）

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

const TypeDef = gql `
  scalar Upload

  type Mutation {
    upload(file: Upload!)
  }
`

在您的左轮手枪中，您可以在args中访问该文件，需要注意的一点是该文件将是一个应许；

const resolver = {
        Mutation: {
            async upload(obj, args, context, info) {
                const file = await args.file;
                // ... DO STUFF
            },
        }
}

客户

在客户端中，您需要使用apollo-angular-link-http软件包来帮助文件上传。在请求的context中，需要设置useMultipart : true

查询将类似于此

const uploadFileMutation = gql`
  mutation UploadMutation(
    $file: Upload!
  ) {
    upload(file: $file) {
        YOUR RESPONSE
      }
    }
  }
`

Apollo请求将如下所示


  constructor(
    private Apollo: Apollo
  ) { }

  fileUpload(file){
    this.Apollo.mutate<any>({
      mutation: uploadFileMutation,
      variables: {
        file: this.file
      },
      context: {
         useMultipart: true
      }
    }).subscribe(({ data }) => {
       this.response = data.upload
    });
   }

我希望这可以帮助或至少使您走上正轨。

将文件从Angular 7 Web App上载到Apollo 2.0 GraphQL Server

1 个答案:

服务器

客户