먼저 CORS 환경을 아래와 같이 설정해 줍니다. 그리고 나서 사용이 가능합니다.
http://docs.aws.amazon.com/sdk-for-javascript/v2/developer-guide/s3-example-photo-album.html
Configuring CORS
Before the browser script can access the Amazon S3 bucket, you must first set up its CORS configuration as follows.
<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
<AllowedOrigin>*</AllowedOrigin>
<AllowedMethod>POST</AllowedMethod>
<AllowedMethod>GET</AllowedMethod>
<AllowedMethod>PUT</AllowedMethod>
<AllowedMethod>DELETE</AllowedMethod>
<AllowedMethod>HEAD</AllowedMethod>
<AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<meta charset="utf-8" />
<script src="/Scripts/jquery-1.10.2.js"></script>
<script src="http://sdk.amazonaws.com/js/aws-sdk-2.1.24.min.js"></script>
<script type="text/javascript">
AWS.config.update({
accessKeyId: '',
secretAccessKey: ''
});
AWS.config.region = 'ap-northeast-2';
</script>
<script>
$(function () {
$("#fileUploadForm").submit(function () {
var bucket = new AWS.S3({ params: { Bucket: 'bucketname' } });
var fileChooser = document.getElementById('file');
var file = fileChooser.files[0];
if (file) {
var params = {
Key: file.name,
ContentType: file.type,
Body: file,
ACL: 'public-read' // 접근 권한
};
bucket.putObject(params, function (err, data) {
// 업로드 성공
});
//bucket.putObject(params).on('httpUploadProgress',
// function (evt) {
// console.log("Uploaded :: " + parseInt((evt.loaded * 100) / evt.total) + '%');
// }).send(function (err, data) {
// alert("File uploaded successfully.");
// });
} return false;
});
});
</script>
</head>
<body>
<form id="fileUploadForm" method="post" enctype="multipart/form-data">
<input type="file" name="file" id="file" value="dataFile" required="">
<input type="submit" value="Go" />
</form>
</body>
</html>