Uploading files to Amazon S3

Home > Amazon S3 > Example 01

Explanation

This is an example of uploading a file to Amazon S3. To upload files to S3, you need to know the 'Region/Bucket/AccessKey/SecretAccessKey' information in advance. The following code shows how to set this information.

// Set the AWSS3 method.		
dx.setUploadMode("AWSS3");
// Set the type property of the configuration object to "NON-SECRET", then set the rest of the values.
dx.setAWSS3UploadConfig({
    type: "NON-SECRET",
	accessKeyId: "ABCD...1234",
	secretAccessKey: "ABCD...1234",
	region: "ap-northeast-2",
	bucket: "abc-bucket"
});

The example uses the filename as the key. If you want to set the filename manually, you can set a function to generate the key in the makeKey property of the configuration object.

dx.setAWSS3UploadConfig({
    ...
	// key: component's name/filename 
    makeKey: item => `${item.controlId}/${item.name}`
});

You'll also need to set up your S3 server for uploads. CORS setup is required to allow different sources to communicate with each other. Since DEXTUploadX5 uses a multipart upload method to upload files to S3, the PUT request method and ETag response header must be allowed.

# S3 CORS configuration
[
    {
        "AllowedHeaders": ["*"],
        "AllowedMethods": ["HEAD", "GET", "PUT", "POST", "DELETE"],
        "AllowedOrigins": ["*"],
        "ExposeHeaders": ["ETag"]
    }
]

Example

Result