Im сходит с ума при загрузке изображения на Facebook. Я попробовал методы перетаскивания HTML5, Dropzone.js, а также загрузку на свой собственный сервер перед отправкой изображения через PHP. Но единственное, что я могу сделать для работы (из-за моей неопытности, признаю я), и что это не связано с загрузкой изображения на мой собственный сервер, - это использовать форму HTML, как показано в документации на Facebook:
<form id="upload_form" enctype="multipart/form-data" action="https://graph.facebook.com/event_id/photos?access_token=an_access_token" method="POST"> Please choose a photo <input name="source" type="file"><br/><br/> Say something about this photo: <input name="message" type="text" value=""><br/><br/> <input type="submit" value="Upload"/><br/> </form>
Я динамически генерирую его в Javascript и использую var
для заполнения event_id
и access_token
.
Это прекрасно работает, поэтому все мои разрешения и авторизация верны. Теперь, что Id нравится делать, это обработать ответ, потому что браузер делает так, как ожидал пользователь, когда пользователь нажимает submit
и отображает основной текст, отображающий идентификатор сообщения и еще что-то.
Итак, я создал кнопку и связал следующее с событием click
:
var fd = document.getElementById('upload_form');
if (fd) {
console.log('Sending');
var XHR = new XMLHttpRequest();
XHR.addEventListener('load', function(data) {
console.log('XHR finished:');
console.log(data);
});
XHR.addEventListener('error', function(data) {
console.log('XHR ERROR:');
console.log(data);
});
var graph_url = 'https://graph.facebook.com/'+event_id+'/photos?access_token=' + access_token;
XHR.open('POST', graph_url);
XHR.send(fd);
}
После того как пользователь выбрал изображение и щелкнул мою кнопку для выполнения вышеуказанного XHR
завершает отправку и отчеты как завершенные, но Facebook отвечает:
(#324)Requires upload file.
Пожалуйста, может кто-нибудь показать мне, где я пошла не так - это проблема уже несколько дней!
Если вы хотите использовать jquery и jquery.ajaxForm плагин
<!-- You form code stay Make sure your form.action url is valid ajaxForm use that as url -->
<form id="upload_form" enctype="multipart/form-data" action="https://graph.facebook.com/event_id/photos?access_token=an_access_token" method="POST">
Please choose a photo
<input name="source" type="file"><br/><br/>
Say something about this photo:
<input name="message" type="text" value=""><br/><br/>
<input type="submit" value="Upload"/><br/>
</form>
//your javascript to upload the image togather with message
// put this in a button, not submit button
$('#upload_form').ajaxForm({
complete: function(data) {
//process fb response
}
});
Я предлагаю вам использовать Fiddler, чтобы поймать оба соединения, с XMLHttpRequest и без него и посмотреть, какая фактическая разница между обоими запросами, я действительно не знаю, что XHR.send(fd);
но может быть, он отправляет сам контент формы, а не отправляет его?
Fiddler - очень полезный инструмент при подключении к внешним API