vue-dropzone icon indicating copy to clipboard operation
vue-dropzone copied to clipboard

Issue using S3 Upload with Apollo & Graphql

Open bjensen opened this issue 6 years ago • 1 comments

Hi,

Im using the s3 direct upload option.

<vue-dropzone
    id="profile_image_dropzone"
    ref="myDropzone"
    :awss3="awss3"
    :options="dropzoneOptions"
  />

In my data I have:

 data: function() {
    return {
      awss3: {
        signingURL: f => {
          this.getSigningUrl(f);
        },
     }
}

And the method:

methods: {
    async getSigningUrl(f) {
      const response = await this.$apollo.mutate({
        mutation: createProfileImage,
        variables: {
          studentId: this.$route.params.id,
          fileName: f.name,
          fileType: f.type,
        },
      });
      const graphqlErrors = response.data.createProfileImage.errors;
      if (graphqlErrors) {
        console.log("errors happend")
      } else {
        return response.data.createProfileImage;
      }
    },

When the upload is initiated the getSigningUrl is executed, however because of async / await then the result is not returned as needed. How do I fix this?

bjensen avatar Mar 27 '20 19:03 bjensen

You probably need to call the getSigningUrl when the component is mounted rather or a computed property rather than as a function

rowanwins avatar May 03 '20 13:05 rowanwins