Can the editor upload to Amazon S3?

Using a function as the value of the store property on the createDefaultImageWriter method we can customize the upload process and upload files to any third-party location.

<!-- Include AWS script, make sure to update the version -->
<script src="<version>.min.js"></script>

<script type="module">
    import { openDefaultEditor, createDefaultImageWriter } from './pintura.js';

    // Set up S3 connection
    const s3 = new AWS.S3({
        accessKeyId: 'access-key',
        secretAccessKey: 'secret-access-key',
        region: 'eu-central-1',

    // Open the default image editor in a modal
    const editor = openDefaultEditor({
        src: './my-image.jpeg',

        // Set a custom image writer
        imageWriter: createDefaultImageWriter({
            store: (state, options, onprogress) =>
                new Promise((resolve, reject) => {
                    // Get file object reference
                    const { dest } = state;

                    // Upload to S3
                    const httpUpload = s3.upload(
                            Bucket: 'my-bucket-name',
                            Key: + '_' +,
                            Body: dest,
                            ContentType: dest.type,
                            ACL: 'public-read',
                        (err, data) => {
                            // Test if returned error, if so, throw error in UI
                            if (err) return reject('Something went wrong.');

                            // Remember key (store is returned in editor 'process' event)
                   = data.Key;

                            // Resolve with updated state

                    // Show S3 upload progress in UI
                    httpUpload.on('httpUploadProgress', onprogress);