Вы можете подключаться к S3-хранилищу и управлять им, используя AWS JavaScript SDK.
Подключить AWS JavaScript SDK HTML-странице
Настроить хранилище и создать бакет s3
Установить политику CORS на бакет, используя s3cmd
Добавить файлы в бакет
Получить список файлов в бакете
Описанные ниже методы актуальны для версии AWS SDK 2.742.0
Подключить AWS JavaScript SDK HTML-странице
Пример описывает подключение библиотеки AWS JavaScript SDK версии 2.742.0 к HTML-странице.
Версию можно найти по ссылке.
<html> <head> <script src="https://sdk.amazonaws.com/js/aws-sdk-2.742.0.min.js"></script> <script src="./js/index2.js"></script> </head> <body> <h1>List of files</h1> <ul id="list"> </ul> </body> </html>
Настроить хранилище и создать бакет S3
Откройте конфигурационный файл ./js/index2.js и укажите данные хранилища и создаваемого бакета:
var s3BucketName = "test_2";
var host = "https://s-dt2.cloud.edgecore.ru";
var access_key = "1234";
var secret_key = "5678";
AWS.config.accessKeyId = access_key;
AWS.config.secretAccessKey = secret_key;
AWS.config.endpoint = host;
var s3 = new AWS.S3({
sslEnabled: true
});
Где:
test_2 — название создаваемого бакета
https://s-dt2.cloud.edgecore.ru — URL вашего хранилища
1234 — access key, который вы получили при создании хранилища
5678 — secret key, который вы получили при создании хранилища
Установить политику CORS на бакет, используя S3cmd
Пример Wildcard-политики
Пример описывает конфигурацию, согласно которой разрешено использовать кроссдоменные запросы GET, HEAD, PUT, POST и DELETE со всех источников.
Внимание! Такая конфигурация может быть небезопасна.
<CORSConfiguration> <CORSRule> <ID>Allow everything</ID> <AllowedOrigin>*</AllowedOrigin> <AllowedMethod>GET</AllowedMethod> <AllowedMethod>HEAD</AllowedMethod> <AllowedMethod>PUT</AllowedMethod> <AllowedMethod>POST</AllowedMethod> <AllowedMethod>DELETE</AllowedMethod> <AllowedHeader>*</AllowedHeader> <MaxAgeSeconds>30</MaxAgeSeconds> </CORSRule> </CORSConfiguration>
После создания конфигурации, примените ее на бакет.
s3cmd setcors cors.xml s3://<bucket_name>
Где bucket_name — название вашего бакета.
Добавить файлы в бакет
Пример описывает добавление двух файлов (test_file1 и test_file2) в бакет s3BucketName.
var params1 = {
Bucket: s3BucketName, Key: 'test_file1',
Body: "test"
};
var params2 = {
Bucket: s3BucketName, Key: 'test_file2',
Body: "test"
};
var request = s3.putObject(params1);
request.send(function (err, data) {
if (err) console.log("Error:", err.code, err.message);
else console.log(data);
});
var request = s3.putObject(params2);
request.send(function (err, data) {
if (err) console.log("Error:", err.code, err.message);
else console.log(data);
});
Получить список файлов в бакете
Пример описывает получение списка файлов, расположенных в бакете test_2.
params = {
Bucket: "test_2"
};
s3.listObjects(params, function(err, data) {
if (err) return;
data.Contents.map(function(info){
var ul = document.getElementById("list");
var li = document.createElement("li");
li.innerText = info.Key + " " + info.LastModified;
ul.append(li);
});
});
Пример полученного результата:
