This is the archived documentation for Doka Image Editor v7.
Please visit pqina.nl/pintura/docs/ to see documentation for the latest version of Pintura Image Editor.
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="https://sdk.amazonaws.com/js/aws-sdk-<version>.min.js"></script>
<script type="module">
import { openDefaultEditor, createDefaultImageWriter } from './doka.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: 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
resolve(state);
}
);
// Show S3 upload progress in UI
httpUpload.on('httpUploadProgress', onprogress);
}),
}),
});
</script>