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 the AWS script somewhere on the webpage and update the version.

<script src="https://sdk.amazonaws.com/js/aws-sdk-<version>.min.js"></script>
<!DOCTYPE html>

<link rel="stylesheet" href="./pintura.css" />

    .pintura-editor {
        height: 600px;

<div id="editor"></div>

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

    const editor = appendDefaultEditor('#editor', {
        src: 'image.jpeg',
        imageWriter: {
            store: (state, options, onprogress) =>
                new Promise((resolve, reject) => {
                    // Get file object reference
                    const { dest } = state;

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

                    // Upload to S3
                    const httpUpload = s3.upload(
                            Bucket: 'my-bucket-name',
                            Key: Date.now() + '_' + dest.name,
                            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)
                            state.store = data.Key;

                            // Resolve with updated state

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