Need help with Express api upload via Insomania

Thanks @jaydenseric for this plugin, I’m working on Express API (mongodb, apollo server off course ) and using Insomania to test all my features.

Here is my code

index.js

const helperMiddleware = [
  bodyParser.json(),
  bodyParser.urlencoded({ extended: true }),
  bodyParser.text({ type: 'application/graphql' }),
  (req, res, next) => {
    if (req.is('application/graphql')) {
      req.body = { query: req.body }
    }
    next()
  }
]

const buildOptions = async (req, res) => {
  res.removeHeader("X-Powered-By") // remove x power headers
  const mongo = await connectMongo()
  const user = await authentication(req, res, mongo.Users)
  return {
    schema,
    context: {
      mongo,
      dataloaders: buildDataloaders(mongo),
      user
    },
    // tracing: true
  }
}

app.use(
  '/api',
  ...helperMiddleware,
  apolloUploadExpress({
    maxFileSize: 5 * 1000,
    maxFiles: 5
  }),
  graphqlExpress(buildOptions)
)

schema

type Image {
  # upload
  id: ID!
  path: String!
  filename: String!
  mimetype: String!
  encoding: String!
  # data
  caption: String
  created_by: User!
  created_date: Datetime
  width: Int
  height: Int
  url: String
  album: Album
  variants: [ImageVariant]
}

mutation schema

uploadImage(files: [Upload!]!): [Image!]

resolver

const imgDir = './public/uploads'
const storeUpload = async ({ stream, filename }) => {
  const id = uuid.v4()
  const path = `${imgDir}/${id}-${filename}`
  return new Promise((resolve, reject) =>
    stream
      .pipe(createWriteStream(path))
      .on('finish', () => resolve({ id, path }))
      .on('error', reject)
  )
}

const processUpload = async (upload, Images) => {
  const { stream, filename, mimetype, encoding } = await upload
  const { id, path } = await storeUpload({ stream, filename })
  const newImage = { id, filename, mimetype, encoding, path }
  const response = await Images.insert(newImage)
  return Object.assign({ id: response.insertedIds[0] }, newImage)
}

export const uploadImage = async (root, data, { mongo: { Images }, user }) => processUpload(data.files, Images)

Insomania Query

mutation Upload($files: [Upload!]!) { 
	uploadImg(files: $files) {
		filename
		encoding
		mimetype
		path
	}
}

Expected

• Upload multiple images within maximum 5 files (and maximum 5MB for each)
• Insert data to db

Result

Non-stop sending data request in Insomania

I don’t know what I missed, would you please help me out, I’m kind of newbie.

Thank you.

[jaydenseric]

You’re getting closer 😛

The reason that did not work is because the query, operationName and variables multipart form fields don’t exist in the spec, and the required operations field is missing.

You might find it useful to study the construction of the requests in the apollo-upload-server tests.

Most people never have to manually construct requests like this; everything is done for you by apollo-upload-client.

[viiiprock]

yes, follow your example and use apollo-upload-client is more easier for me to make it work, I’ll learn more about the test case, thanks in advance @jaydenseric