📺

Upload Media

Graphweaver supports uploading media to a storage provider, and rendering images in the admin ui. To do this, Graphweaver supplies a storage provider class and a MediaField decorator to connect and describe the media being uploaded. An example of using AWS S3 to handle images can be seen in the examples folder.

@MediaField decorator

The @MediaField decorator is used to describe a field that represents media. It accepts:

  • storageProvider - A provider that supplies a getDownloadUrl method to the decorator to get the resource.
  • resourceId - An identifier for the storage provider to get the media, this is another field on the entity.
  • mediaType - A enum describing the kind of media.

An example of a storage provider and usage of the @MediaField decorator can be seen below:


const s3 = new S3StorageProvider({
	bucketName: process.env.AWS_S3_BUCKET,
	region: process.env.AWS_REGION,
	type: StorageType.S3,
	expiresIn: 3600,
});

@ObjectType('Submission')
export class Submission extends GraphQLEntity<OrmSubmission> {
	public dataEntity!: OrmSubmission;

	@Field(() => ID)
	id!: string;

	@ReadOnlyProperty({ adminUI: true, backend: false })
	@Field(() => String, { nullable: true })
	key?: string;

	// "resourceId" must match the name of the field on the entity that gets the url from s3
	@MediaField({ storageProvider: s3, resourceId: 'key', mediaType: MediaTypes.IMAGE })
	downloadUrl?: string;
}

Exogee