Кросс-доменная XHR-загрузка через Javascript

Возможный дубликат:Анализ xml/json в IE9

Я хочу реализовать загрузчик Javascript, используя API Imgur (я думаю, что используется один Stackoverflow). Однако я не смог заставить его работать. Я попробовал Ajax Upload, но я получил поле "Request header" X-Requested-With не разрешено Access-Control-Allow-Headers ". Как ни странно, я использовал этот плагин, и я не получил эту ошибку. Вместо этого я получил ответ XML, в котором говорилось <message>No image data was sent to the upload api</message> (что, я думаю, связано с тем, что я не мог отправить файл-объект в качестве параметра под названием "образ "), как описано в документация:

изображение | требуется | ПОСТ | Бинарный файл, данные base64 или URL

Итак, мой общий вопрос: какой самый простой способ загрузить в Imgur (учитывая, что они позволяют Cross-Domain XHR, что является большим преимуществом) в кросс-браузере (IE8 +, Chrome, Firefox и друзья)?.

Я также немного прочитал о объект HTML5 FormData, но кажется, что даже сейчас поддержка кросс-браузера невелика, и я не уверены, существуют ли javascript-реализации для IE8 +, Safari и т.д.

UPDATE: Мне удалось получить эту (почти) работу с использованием JQuery Form Plugin, но у меня все еще есть проблема this (связанная с IE9). Возможно, это релевантно для решения этого вопроса, который, в свою очередь, будет решать другой.

UPDATE2: Для справок в будущем Jquery Form Plugin работает нормально. Однако существует проблема анализа XML-ответа, который содержит все данные, относящиеся к Imgur. См. Анализ xml/json-ответа в IE9 для получения дополнительной информации об этой проблеме. Короче: JSON не вариант, XML должен работать, но это не так. Вместо этого вы можете попробовать сценарий на стороне сервера, отправив запрос через AJAX на серверную script и позволяя вашему script отправить загрузку и получить ответ правильно. Чтобы не отвлекаться от реальной проблемы, я закрою этот вопрос.

Любая помощь будет принята с благодарностью.

1 ответ

В документе Imgur API есть полностью рабочий пример JavaScript.

function upload(file) {
 // file is from a  tag or from Drag'n Drop
 // Is the file an image?
 if (!file || !file.type.match(/image.*/)) return;
 // It is!
 // Let build a FormData object
 var fd = new FormData();
 fd.append("image", file); // Append the file
 fd.append("key", "API_KEY"); // Get your own key: http://api.imgur.com/
 // Create the XHR (Cross-Domain XHR FTW!!!)
 var xhr = new XMLHttpRequest();
 xhr.open("POST", "http://api.imgur.com/2/upload.json"); // Boooom!
 xhr.onload = function() {
 // Big win!
 // The URL of the image is:
 JSON.parse(xhr.responseText).upload.links.imgur_page;
 }
 // Ok, I don't handle the errors. An exercice for the reader.
 // And now, we send the formdata
 xhr.send(fd);
}

licensed under cc by-sa 3.0 with attribution.