Ответ 1
Я много борюсь с этой проблемой и, наконец, понял! Я подробно расскажу о своих шагах, надеюсь, это поможет кому-то.
Я использовал этот модуль: https://github.com/asafdav/ng-s3upload
Я выполнил следующие шаги:
- Создать ведро
- Грант "put/Delete: разверните разделы" Разрешения "и нажмите кнопку" Добавить дополнительные разрешения ". Выберите" Все "и" Загрузить/Удалить "и сохраните.
-
Добавить конфигурацию CORS:
<?xml version="1.0" encoding="UTF-8"?> <CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/"> <CORSRule> <AllowedOrigin>*</AllowedOrigin> <AllowedMethod>GET</AllowedMethod> <AllowedMethod>POST</AllowedMethod> <AllowedMethod>PUT</AllowedMethod> <AllowedHeader>*</AllowedHeader> </CORSRule>
-
Добавьте "crossdomain.xml" в корень вашего ведра, сделав его общедоступным.
<?xml version="1.0"?> <!DOCTYPE cross-domain-policy SYSTEM "http://www.macromedia.com/xml/dtds/cross-domain-policy.dtd"> <cross-domain-policy> <allow-access-from domain="*" secure="false" /> </cross-domain-policy>
-
Создайте службу, которая вернет JSON со следующим:
{ "policy":"XXX", "signature":"YYY", "key":"ZZZ" }
- XXX - политика json, требуемая AWS, закодированная base64.
- YYY - HMAC и ваш секретный ключ.
- ZZZ - Ваш открытый ключ Здесь например, даже если вы не разработчик рельсов, прочитайте код, это очень прямолинейно.
Это самый важный шаг: убедитесь, что вы создаете правильный документ политики.
Вот мой код в С#
StringBuilder builder = new StringBuilder();
builder.Append("{")
.Append("\"expiration\": \"")
.Append(GetFormattedTimestamp(expireInMinutes))
.Append("\",")
.Append("\"conditions\": [")
.Append("{\"bucket\": \"")
.Append(bucketName)
.Append("\"},")
.Append("{\"acl\": \"")
.Append("public-read")
.Append("\"},")
.Append("[\"starts-with\", \"$key\", \"")
.Append(prefix)
.Append("\"],")
.Append("[\"starts-with\", \"$Content-Type\", \"\"],")
.Append("[ \"content-length-range\", 0, " + 10 * 1024 * 1024 + "]")
.Append("]}");
Encoding encoding = new UTF8Encoding();
this.policyString = Convert.ToBase64String(encoding.GetBytes(builder.ToString().ToCharArray()));
this.policySignature = SignPolicy(awsSecretKey, policyString);
Это генерирует следующий Json
{
"expiration":"2014-02-13T15:17:40.998Z",
"conditions":[
{
"bucket":"bucketusaa"
},
{
"acl":"public-read"
},
[
"starts-with",
"$key",
""
],
[
"starts-with",
"$Content-Type",
""
],
[
"content-length-range",
0,
10485760
]
]
}
Этот документ затем закодирован base64 и отправляется в виде строки.
Моя проблема была связана с моим политическим документом. Документ политики похож на набор правил, которые вы определяете для сеанса: имена файлов должны начинаться с чего-либо (т.е. Загружать в подпапку), размер должен быть в диапазоне.
Используйте инструменты разработчика для своего браузера и посмотрите на вкладку сети, посмотрите, какие ошибки AWS возвращают, это действительно помогло мне, оно будет указывать такие вещи, как ошибки политики, и сказать, какое условие не удалось. Обычно вы получите отказ в доступе к ошибкам, и это будет основано на условиях, установленных в документе политики или неправильных ключах.
Еще одна вещь, которую некоторые браузеры имеют проблемы с localhost CORS. Но, используя вышеизложенное, я смог загружать файлы с моей локальной машины-разработчика, используя хром.
Происхождение "localhost: 3000" не разрешено Access-Control-Allow-Origin
Из вашей ошибки кажется, что вы не настроили правила CORS на стороне AWS.