Загрузка браузера S3 через POST: не удается корректно обрабатывать ошибки

Я пишу приложение, в котором хочу, чтобы клиент мог загружать данные на Amazon S3 прямо из браузера. Я могу сделать так, чтобы это сработало просто отлично. Но когда возникают ошибки, я хочу обрабатывать их более изящно, чем разбрызгивание XML-документа на экране клиента.

У меня есть схема, которая, я думаю, сработает, но она проваливается. Вот что я пытаюсь сделать:

  1. создайте форму для выполнения загрузки и сохраните форму на самой S3, в том же домене, что и атрибут "action". форма.
  2. перенаправьте клиента на эту форму. Теперь их браузер сидит на https: / / .s3.amazonaws.com/something .
  3. страница содержит скрытый iframe. Форме устанавливает свои цели, чтобы этот iframe.
    4. Обработчик событий load смотрит на содержимое iframe и воздействует на него.

Итак, что-то вроде этого: 

<iframe id="foo" name="foo" style="display: none" />
<form target="foo" action="https://<bucket>.s3.amazonaws.com/">
    <input type="hidden" name="..." value="..." />
    <input type="file" name="file" />
</form>

С помощью этого javascript (используя jquery): 

function handler() {
    var message = $("#foo").contents().find('message').text();
    alert(message);
}
$("#foo").load(handler);

Используя firebug, я вижу, что iframe содержит XML-документ, это содержит узел "сообщение". Однако .find('message') всегда не удается найти что-либо в XML-документе.

Обратите внимание, что действие формы имеет тот же домен, порт и схему, что и сам документ. Так что я не думаю, что мне следует нарушать политику того же происхождения. Так ведь? Но каждый раз она терпит неудачу. Для этого используются браузеры Firefox и Google Chrome.

Спасибо за любой совет!

3 6
jquery amazon-s3 same-origin-policy

3 ответа:

Существует ряд плагинов jQuery, которые эффективно реализуют именно то, что вы пытаетесь сделать. Сделайте поиск в Google для "jQuery ajax-upload", вы можете просто использовать один из этих элементов управления из коробки, чтобы захватить результат поста или изучить их код и свернуть свой собственный.

Вы также можете посмотреть некоторые из загрузчиков на основе Flash, если вы загружаете большие файлы. Метод загрузки в чистом виде не имеет никакого способа реализации прогресса загрузки, по крайней мере, нет пока новые файловые функции не получат широкого распространения в браузерах, которые предлагает Flash. http://github.com/slaskis/s3upload#readme - хороший загрузчик файлов на основе flash, специально разработанный для S3, и дает вам функции обратного вызова в JavaScript для обработки ошибок, прогресса и многого другого.

2

Это должен быть просто комментарий, но вы можете опубликовать ответ XML-кода?

EDIT: просто чтобы немного сузить круг, я сделал простой тест и работал очень хорошо: 

<div id="foo">
    <error> 
        <code>AccessDenied</code>
        <message>Invalid according to Policy: Policy expired.</message> 
        <hostid> SZuQn5hTyf32j79AWUym1/si48oqjPifrx4goDVDLYYxc6cJVbbHroLJYcAM89+T</hostid> 
    </error> 
</div>

Затем я сделал код jQuery на своем firebug:

$("#foo").find("message").text()

Может быть, вы можете дать alert($("#foo").html()) и проверить ответ..

2

Я думаю, что вы пытаетесь решить неправильную проблему. Проблема не в деталях, с iframes и так далее, но в том, что вы хотите иметь более точный контроль над загрузкой. Загрузите файл на ваш сервер, затем отправьте запрос на сервер Amazon, и вы получите абсолютный контроль над тем, что происходит.

Значительно сложнее, конечно, но это цена контроля.

0